Unable to embed Google Custom Search in my EZ-Page

Google Custom Search, which is a paid service of a more powerful Google Site Search, is not operating correctly with zencart. The search box does not display the search suggestions popup (the same type of thing as you would see when typing in keywords on google.com), and the results page is blank. I have tried copying the code Google provides onto standalone html pages, and it works fine, so the issue is compatibility with zencart.

Google is of no help, so I'm asking here. Has anyone had experience with it?

If you can't get it to work, there is a mod available that provides the same functionality:

http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=2032

Thanks, but I'd rather get Google's more powerful search to work.

Further below is the code on the search results page. But this isn't what the source code of the page contains if and only if it is displayed through zencart. As a standalone html page it works fine. In zc this function

return decodeURIComponent(keyvaluepair[1].replace(/+/g, ' '));

is displayed as this.

return decodeURIComponent(keyvaluepair[1].replace(/+/g, ' '));

Notice the lack of a backslash in the replace function. I don't know whether it's doing this because it's an EZPage or if zc is doing this every time it displays a page. I edited the EZPage text directly in phpmyadmin to include the backslash again, but the source code of the live page is still omitting the backslash.

I don't care why zc is tampering with the code, or what security issues there are. I would just like to prevent it from doing so. Is this possible? I did some kind of fix months ago so that I could use php code in an EZPage, but I don't remember what it was, and that fix doesn't seem to have stopped it from doing this.

<div id="cse" style="width: 100%;">Loading</div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript"> 
  function parseQueryFromUrl () {
    var queryParamName = "q";
    var search = window.location.search.substr(1);
    var parts = search.split('&');
    for (var i = 0; i < parts.length; i++) {
      var keyvaluepair = parts[i].split('=');
      if (decodeURIComponent(keyvaluepair[0]) == queryParamName) {
        return decodeURIComponent(keyvaluepair[1].replace(/\+/g, ' '));
      }
    }
    return '';
  }

  google.load('search', '1', {language : 'en'});
  google.setOnLoadCallback(function() {
    var customSearchOptions = {};
    var googleAnalyticsOptions = {};
    googleAnalyticsOptions['queryParameter'] = 'q';
    googleAnalyticsOptions['categoryParameter'] = '';
    customSearchOptions['googleAnalyticsOptions'] = googleAnalyticsOptions;  var customSearchControl = new google.search.CustomSearchControl(
      '004041265821061950006:cijs1uvfzfm', customSearchOptions);
    customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
    var options = new google.search.DrawOptions();
    options.setAutoComplete(true);
    customSearchControl.draw('cse', options);
    var queryFromUrl = parseQueryFromUrl();
    if (queryFromUrl) {
      customSearchControl.execute(queryFromUrl);
    }
  }, true);
</script>
<link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css" type="text/css" />
<style type="text/css">
  .gsc-control-cse {
    font-family: Arial, sans-serif;
    border-color: #747474;
    background-color: #747474;
  }
  input.gsc-input {
    border-color: #BCCDF0;
  }
  input.gsc-search-button {
    border-color: #666666;
    background-color: #CECECE;
  }
  .gsc-tabHeader.gsc-tabhInactive {
    border-color: #E9E9E9;
    background-color: #E9E9E9;
  }
  .gsc-tabHeader.gsc-tabhActive {
    border-top-color: #FF9900;
    border-left-color: #E9E9E9;
    border-right-color: #E9E9E9;
    background-color: #FFFFFF;
  }
  .gsc-tabsArea {
    border-color: #E9E9E9;
  }
  .gsc-webResult.gsc-result,
  .gsc-results .gsc-imageResult {
    border-color: #FFFFFF;
    background-color: #747474;
  }
  .gsc-webResult.gsc-result:hover,
  .gsc-webResult.gsc-result.gsc-promotion:hover,
  .gsc-imageResult:hover {
    border-color: #FFFFFF;
    background-color: #747474;
  }
  .gs-webResult.gs-result a.gs-title:link,
  .gs-webResult.gs-result a.gs-title:link b,
  .gs-imageResult a.gs-title:link,
  .gs-imageResult a.gs-title:link b {
    color: #ffcc00;
  }
  .gs-webResult.gs-result a.gs-title:visited,
  .gs-webResult.gs-result a.gs-title:visited b,
  .gs-imageResult a.gs-title:visited,
  .gs-imageResult a.gs-title:visited b {
    color: #ffcc00;
  }
  .gs-webResult.gs-result a.gs-title:hover,
  .gs-webResult.gs-result a.gs-title:hover b,
  .gs-imageResult a.gs-title:hover,
  .gs-imageResult a.gs-title:hover b {
    color: #ffcc00;
  }
  .gs-webResult.gs-result a.gs-title:active,
  .gs-webResult.gs-result a.gs-title:active b,
  .gs-imageResult a.gs-title:active,
  .gs-imageResult a.gs-title:active b {
    color: #ffcc00;
  }
  .gsc-cursor-page {
    color: #ffcc00;
  }
  a.gsc-trailing-more-results:link {
    color: #ffcc00;
  }
  .gs-webResult .gs-snippet,
  .gs-imageResult .gs-snippet,
  .gs-fileFormatType {
    color: #ffffff;
  }
  .gs-webResult div.gs-visibleUrl,
  .gs-imageResult div.gs-visibleUrl {
    color: #66cccc;
  }
  .gs-webResult div.gs-visibleUrl-short {
    color: #66cccc;
  }
  .gs-webResult div.gs-visibleUrl-short {
    display: none;
  }
  .gs-webResult div.gs-visibleUrl-long {
    display: block;
  }
  .gs-promotion div.gs-visibleUrl-short {
    display: none;
  }
  .gs-promotion div.gs-visibleUrl-long {
    display: block;
  }
  .gsc-cursor-box {
    border-color: #FFFFFF;
  }
  .gsc-results .gsc-cursor-box .gsc-cursor-page {
    border-color: #E9E9E9;
    background-color: #747474;
    color: #ffcc00;
  }
  .gsc-results .gsc-cursor-box .gsc-cursor-current-page {
    border-color: #FF9900;
    background-color: #FFFFFF;
    color: #ffcc00;
  }
  .gsc-webResult.gsc-result.gsc-promotion {
    border-color: #336699;
    background-color: #FFFFFF;
  }
  .gsc-completion-title {
    color: #ffcc00;
  }
  .gsc-completion-snippet {
    color: #ffffff;
  }
  .gs-promotion a.gs-title:link,
  .gs-promotion a.gs-title:link *,
  .gs-promotion .gs-snippet a:link {
    color: #0000CC;
  }
  .gs-promotion a.gs-title:visited,
  .gs-promotion a.gs-title:visited *,
  .gs-promotion .gs-snippet a:visited {
    color: #0000CC;
  }
  .gs-promotion a.gs-title:hover,
  .gs-promotion a.gs-title:hover *,
  .gs-promotion .gs-snippet a:hover {
    color: #0000CC;
  }
  .gs-promotion a.gs-title:active,
  .gs-promotion a.gs-title:active *,
  .gs-promotion .gs-snippet a:active {
    color: #0000CC;
  }
  .gs-promotion .gs-snippet,
  .gs-promotion .gs-title .gs-promotion-title-right,
  .gs-promotion .gs-title .gs-promotion-title-right *  {
    color: #000000;
  }
  .gs-promotion .gs-visibleUrl,
  .gs-promotion .gs-visibleUrl-short {
    color: #008000;
  }
  .gsc-input input.gsc-input {
    background: none repeat scroll 0% 0% white !important;
  }
</style> 

I've looked through several threads trying to figure out whether it's possible to integrate Google Custom Search with Zen Cart. I have a website that sells medical equipment, and there are many different ways of referring to the products I sell, so it would be very useful to have a tool like Google to make better sense out of queries on the site and provide relevant results instead of the notorious "There is no product that matches the search criteria." page.

I'm going to try to install Google Custom Search on my own. If I can figure out how to make it work, I'll post it here. I'm guessing that my hack will mess with core files, so if one of the Zen Cart forum managers or other experts could give feedback on a better way to do it, I'd be glad to make whatever changes I need to.

Stand by for a possible solution...

By the way, an intermediate solution would be to allow the Zen Cart search to be configured to not be so exclusive. I know that it can't be designed to be all that intelligent, but out of the box it seems nearly useless in my opinion.

mayleesboutique:

I've looked through several threads trying to figure out whether it's possible to integrate Google Custom Search with Zen Cart. I have a website that sells medical equipment, and there are many different ways of referring to the products I sell, so it would be very useful to have a tool like Google to make better sense out of queries on the site and provide relevant results instead of the notorious "There is no product that matches the search criteria." page.

I'm going to try to install Google Custom Search on my own. If I can figure out how to make it work, I'll post it here. I'm guessing that my hack will mess with core files, so if one of the Zen Cart forum managers or other experts could give feedback on a better way to do it, I'd be glad to make whatever changes I need to.

Stand by for a possible solution...

By the way, an intermediate solution would be to allow the Zen Cart search to be configured to not be so exclusive. I know that it can't be designed to be all that intelligent, but out of the box it seems nearly useless in my opinion.
Well you can start by not trying to use EZ Pages to do this since excecuting PHP code on an EZ Page can't happen.. (which is probably a LARGE part of why the OP's attempt to get this work failed) Suggest creating a page JUST for the Google search form.. You can use one of the admin editable defined pages or create a NEW defined page for your Google search form.. You CAN run PHP from the defined pages provided you add the code using a TEXT editor and not a WYSIWYG editor.. Good luck..

Did anyone come up with a solution for this?

ShopVille:

Did anyone come up with a solution for this?

Did you try the solution I suggested???????? (just above your post) If you have the Google search code, this should work..

Otherwise you can consider paying for the services of programmer to develop a Google search module for you..