Client Side

All the fancy frizz

Replace WordPress search with Google Search

Written by: Peter Fisher on October 19, 2012
Tagged under: , ,
Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn

WordPressOne of the biggest drivers on the web is searching for information and the largest search engines on the internet is Google. So why stick with the default search engine in WordPress which is, lets face it pretty poor at best. Instead of  using the default WordPress search feature you can tap into the power of Google search and display the results on a designated results page.

Letting Google take care of the search feature on your blog/site is very simple and quick to set-up.  Also if you combine  Google Search and  Google AdSense you will benefit  from the adverts displayed on the results page. It’s a bit of a no brainer really.

So let’s get started with the set up. Fundamentally Google Search is split into two sections.  The first is the search form. This can be customized with different styles and can include language translations and auto completion.

The second section is the results. These sit within an iframe of no smaller then 795 pixels in width and if turned on will include Google adverts around the top and right hand edge. The results can also be tailored with different styles to suit your website.

Here is a quick run down of what you need to do in order to set-up Google Search:

  1. Login to Google Adsense
  2. Click on the My Ads tab at the top in blue
  3. Click on Search on the left hand side
  4. If its not enabled then do so by clicking on the option in the middle pane
  5. Now click on New Custom Search Engine
  6. Fill out the form and click Save and Get Code
  7. Copy the form code and paste it onto a page which you would like the search form to go.
  8. Create a new page called search-results.html copy and paste the results page code into this new page
  9. Upload the changes to the site
  10. Test

The steps above are quite generic and as I’m doing it for my  WordPress blog, I created a new text/html widget for the right hand sidebar and pasted the search form code (in step 7) into there. I then created the search-results.php file with the following contents:

The search form is up in the top right hand corner.  If you enter a keyword and click on the Search button you will be redirected to the search-results.php page with a list of search results.  As and example use the keywords PHP or WordPress.

Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn

Peter Fisher is a web developer working in Gloucester UK. Founder of the digital agency Websomatic, author of this blog and the HowToCodeWell Youtube channel. Peter has over ten years of web development experience under his belt

Read all about Peter Fisher

Leave a Reply

Your email address will not be published. Required fields are marked *