Skip to content

Google custom search results code

knice edited this page Nov 18, 2014 · 9 revisions
  • Google has changed the code used to embed search results on pages.
  • Newer Custom Search Engines (CSE) need to use the new embed code.
  • New CSEs are blocked from using the old code by the X-Frame-Options http header, which is set to SAMEORIGIN, a flag that tells the browser not to render the iframe.

Examples:

To update search pages in Cascade, use the code below (replace the cx variable with the ID for your site):

<div>&#160;<!--#START-CODE

<script>
  (function() {
    var cx = '011478904981149628265:evins_rrh0e';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
        '//www.google.com/cse/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
<gcse:searchresults-only></gcse:searchresults-only>

#END-CODE--></div>

Notes

  1. Our setup will not print the code unless there is HTML in the wysiwyg box. So, I've added a <div> and a non-breaking space.
  2. Rather than an iframe, this code prints the results with Javascript.
  3. This means the results are now affected by the rules in our stylesheet.