How To Setup Google Custom Search Box In Two Pages In Blogger

Do you use Google webmaster tools? if yes then I am sure that you are aware of Google custom search engine. Google custom search engine is a feature of Google webmaster tools which lets you to create a custom search engine for your blog or site and you can add it your blog also. It works on javascript and doesn't need any experience in Html or java. All you need is to setup search engine for your blog. You can read a post in which I have shared some search box where I have mentioned Google custom search engine too. You can read that post and create a custom search engine for your blog by following it, if you haven't setup a search engine yet. Click here to read that post. In this post I will tell you how to add Google custom search in blogger(two pages). If you didn't get me that what am I talking about then read below paragraph.

What is this article about?

This post is about adding Google custom search in blogger in two pages. Let me explain it more accurately. Google provides custom search engine in 7 different styles i.e a search box whose search results are shown on the same page, a search box which shows results in a Google page, a search box which shows search results only etc. For better explanation see the below image:

For instance read about every type of the above search results below:

Overlay: By selecting this option you will see the search results in an overlay.

Two page: This option lets you to add search box in one pages and show the results in other page.

Full width: This option lets you to add search box and results both in one single column.

Two column: Two column refers to the idea of search box in one area of the page and results in other area.

Compact: Like its name, this option shows results and search box both in compact form.

Results only: By selecting this option you will use your own search box and show results on a page of you blog.

Google Hosted: This option allows you to add search box in your blog but the results will be shown in a Google hosted page.

Whats the reason for adding Search box to two pages of my blog?

Well, you can use anyone of the above styles shown above but a solid reason for using search box in your blog page(Two page) is it increases your page views and hence decrease your bounce rate. Another reason for using this style is to show a search box in Google search results.

How do I add search box to my blog pages(two page):

Using custom search engine in two pages of your blog is not a problem at all, but as a beginner its complicated to use this search box in such a useful way as Google hasn't made it easy. But don't worry you can add this search box in your blog two pages by following below mentioned steps. 

First of all we have to set an action page so we need a page link where you would like to see search results so first create a page named "search results" and publish it just like I have created a search page you can see it here, now after creating page copy the url of that page and follow below steps:

Step 1: Go to Google webmaster tools, click on other resources and choose custom search.

Step 2: Click on search edit search engine and choose your search engine. If you haven't created a search engine yet then create a search engine and after that follow this post.

Step 3: Click on look and feel and choose Two page.

Step 4: Click on Save & Get Code(it will take you to a new page).

Step 5: On the code page before copying the code you have to set an action page where your search results will be shown so click on Search results details above the search box code.

Step 6: Paste the url of the search page in above space and below it type q just like I've done in the above image.

Step 7: Click on save(the page will be reloaded).

Step 8: Now copy the code and go to blogger dashboard > layout > add a gadget > Html/javascript > paste the code and click on save.

Step 9: Now you are almost done after a few steps. So now click on Next: Get code for search results:

Step 10: Copy the code(code for search results).

Step 11: Go to the page(search results), edit it switch to Html tab and paste the copied code.

Step 12: Publish the page and open your blog to test your search box.

I hope you like this post and it helped you. If you have any problem related to this post ask me in comments. Follow and subscribe to get latest updates about Google webmaster tools tutorials. Share this post with others and help me spread my blog.

Search tags: Search box, how to add search box in two pages, Google custom search box Two pages,How to steup Google custom search engine in blogger page, Google custom search box full tutorials, Google webmaster tools tutorials for blogger 101Helper.

Tweet