How To Connect Two Pages To Use Google Search Box?

Google custom search engine for websites and blogs is another way to provide easy navigation to your visitors and readers as well as make ...



create Google Search box Google custom search engine for websites and blogs is another way to provide easy navigation to your visitors and readers as well as make some extra cash out of Adsense. Its best advantage is that it will help Google to index your pages quickly. All those pages which are indexed by this search box function is automatically indexed by robots and added to Google's databases.  Its not just about Making money but about deep indexing and site navigation. After the introduction of Plus project, Google developers have transformed all services to look like Google Plus. They recently introduced a search box which looks exactly like Google's official search box. You can see it towards to top right corner of our site. If you insert a query inside the box and hit enter you will land on a different page where results are displayed.


We have dedicated a whole new page for search results in order to provide users with more flexibility. You may also notice that as soon as the search page loads, the search box at the top-right disappears and instead you see one inside the middle of the page. In order to connect two pages in blogger you will have to follow this easy tutorial.












Note before you may start you must learn how to create a custom search box and how to integrate AdSense into it. We have already published detailed tutorials on it which you may follow below:


Google Custom Search Engine Series


Part1: How to Create a Google Search box?

Note: Follow this part only to create the box, stop where it tells you how to add it to blogger. We will learn how to add it by connecting two pages in today's tutorial.



Part3: Customize the Fonts and Colors of the search box

Note:-

You wont require reading this part if you want to use the latest Blue Look that the tutorial today shares.


Part3: How To Connect Two Pages To Use the Google Search Box?




Choosing the style


We assume that you have read Part1 above and you are ready to choose the GooglePlus style box.


  1. Go To http://www.google.com/cse/manage/all

  2. Click the control panel link next to your search box title

  3. From the left menu choose "Look and Feel"

  4. For layout choose "Two Page"

  5. For Style choose "New! Default"  If you wish to customize the link colors on the search results page, click the customize button to make the changes


create google search box

    6.  Click Save & Get code

    7.   Now do not close the window and open a a new tab and do this:


  • Go to blogger

  • Click Pages form list menu

  • Create a new page and title it "SEARCH RESULTS"

  • Write nothing inside it and click Publish

  • Now visit this new page and copy its URL from browser address bar

  • Done!


    8.    Now go back to the first window where you have the code for the search box.

    9.    Where it asks for Specify search results details paste inside the first box the URL of the SEARCH RESULTS page you just created. See the screenshot below for our page

search results details

Inside the second box where you are asked to specify the query parameter embedded in the URL of search results, you can keep it default or you can simply replace the letter "q" with your blog short name. If you search anything on our blog you will see MBT parameter appearing in the URL inside the address bar as shown below:

query parameter

   10.  After you have filled the two boxes click "Save Changes"

   11. You will see two big boxes containing a code. Copy the code from first box which says "Paste this code in the page where you'd like the search box to appear. "  And Paste it inside a HTML/JavaScript widget and drag this widget to your blog layout's top-right position as shown below:

. position  search box

Note: In the above step we created a HTML/JavaScript widget by going to blogger > Layout > Add a Gadget and then chose HTML/JavaScript widget.

    12.  Now after you have positioned the search box the only part left is adding the second code inside your SEARCH RESULTS page. To do this copy the second code from the box which says "Paste this code on URL of Your SEARCH RESULTS Page, where you'd like the search results to appear".

Now go to your SEARCH RESULTS page inside blogger and paste the code inside the HTML section of the editor as shown below:

search results page

    13.  Hit update and you are all done!

Visit your blogs to see a million dollar worth search box right on your sidebar. Play with it to see how search results appear. :)


Hide the Search box and Social Networking Buttons



Your Page might also be displaying social networking buttons and Adsense Ad below title. In order to clean up the search page you must hide them and also hide the search box in the sidebar so that visitor may not see two box on one page. To hide widgets kindly read our detailed tutorial on controlling the widget display in blogger:



Need Help?



This post may seem a little techy but believe us its really easy to implement. If you need any help or get yourself into any trouble just let us know pal. Let us know how did you find this tutorial and what else would you love to know regard Google powered Custom Search Engine. Take good care of yourselves. Peace and blessings pals. :)

COMMENTS

Name

Affiliate Marketing,12,Announcement,34,Bing,9,Bitcoin,38,blog,7,Blogger Resources,42,Blogger Templates,4,blogger tricks,156,Blogging ethics,69,Blogging tips,198,Bugs and Errors,34,Copyright Violation,9,CSS and HTMLTricks,95,Designs,8,drop down menu,7,eBook,12,Email Marketing,7,Events,30,Facebook,30,Facebook tricks,49,Google,157,Google AdSense,42,Google Analytics,7,Google Plus,51,Google Plus Tricks,38,Guest Posts,112,home,2,How To,77,JSON Feeds,25,Kitchen Recipes,2,Label Based Sitemap Themes,1,Make Money Online,108,Marketing,16,MBT Blogger Templates,7,Menus,1,News,146,Pages,1,Posts,10,presentations,15,Responsive,10,Reviews,7,SEO,305,Settings,6,Shortcode,15,Sitemap Themes,1,Social Media,155,Templates,1,Tips,2,Tools,1,Traffic Tips,80,Video,19,Web Designing,62,web hosting,18,Webmaster Tools,97,Widgets,199,wordpress,26,
ltr
item
SEO and SEM Guide For Bloggers: How To Connect Two Pages To Use Google Search Box?
How To Connect Two Pages To Use Google Search Box?
http://lh6.ggpht.com/-JJLmbQDHCwQ/T8EpOLrMyiI/AAAAAAAAGhE/S8KU1GhWKDA/image%25255B69%25255D.png?imgmax=800
http://lh6.ggpht.com/-JJLmbQDHCwQ/T8EpOLrMyiI/AAAAAAAAGhE/S8KU1GhWKDA/s72-c/image%25255B69%25255D.png?imgmax=800
SEO and SEM Guide For Bloggers
https://www.experiencelab.info/2012/05/how-to-connect-two-pages-to-use-google.html
https://www.experiencelab.info/
https://www.experiencelab.info/
https://www.experiencelab.info/2012/05/how-to-connect-two-pages-to-use-google.html
true
2959477579779989044
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share. STEP 2: Click the link you shared to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy