Maybe, this is a popular article which you can find easily by searching in Google but in my article, I will show you how to integrate Google custom search into Magento search box. The result will show in a Magento cms page. It brings customer a feeling that is a search feature integrated for your website. This is a requirement from one of our clients for his website which you can visit at this URL: http://careandheal.com/.
Step 1: Create a search result page
We will create a CMS page which will show search result from Google custom search. I assume that all of you already know how to create CMS page. Let's choose 'search' for url key of this page. In the main content, we need to add following code:
Step 2: Customize Magento search box
The template for Magento search box can be found at app/design/frontend/base/default/template/catalogsearch/form.mini.phtml. We will customize this so it will call the result page which we created above. Change this form:
Change into following code:
You can compare to find out what needs to be changed for your code. The most important parameters in this form are:
- cref: The url of your CSE specification
- q: The query box
- action field: The URL you wish to host the results at (in this example we use a CMS page http://careandheal.com/search)
In CSE xml file, you have to define which site for the search to search from. They are called annotations. You can have a look at this file to see how this xml file is formatted: http://careandheal.com/cref_cse.xml. You can also refer to following URLs to learn about annotations definition.
If you have any question about this, comments will be helpful.