Adding a Google Custom Search Engine to your Blog

The default search gadget for Blogger has been broken for a couple of weeks (see this problem roll-up) so I decided to look for an alternative. Google offers custom search engines that are easy to configure and integrate into a Blogger blog, or any other web site. Here are the steps.

  1. Visit the Google Custom Search page 
  2. Click New Search Engine
  3. Enter your blog's URL in the Sites to Search field
  4. Click Create
  5. Click Get Code
  6. Click on the script in the grey box to highlight it and copy to the clipboard (Ctrl+C or ⌘+C)
  7. Visit the Layout page in Blogger and click Add a Gadget
  8. Add the HTML/JavaScript Gadget
  9. Paste the script from the clipboard into the Content box (Ctrl+V or ⌘+V)
  10. Click Save
This creates a search box on your blog wherever you added the gadget. By default the search results will display in an overlay on your site. There are various things that can be adjusted about the custom search, including the look and feel, integration with Google Adsense, and integration with Google Analytics. All of these can be done from the Google Custom Search page above. Just be aware that you will need to update the script in the HTML/JavaScript gadget on your blog for most of these changes.