How To Put Google Custom Search Box In Your Blogs Header Section


| | 2 comments
In this post I'm going to show you an easy trick to add a Google Custom Search Box to your Blogger header area.I'm sure you have seen plenty of blogs (Including this one) with search boxes and other content in the header section.I think it makes good use of the free space in your header area and gives your blog a more professional look.If you dont have a Google Custom Search Box To Use,In a previous post i showed you how to get a Google Custom Search box for your blog Click Here for that post.

The search box will be positioned differently than it is in my header.To see a Demonstration of how it will look Click Here.


Adding the search box is easy here's how its done :

How To Put Google Custom Search Box In Your Blogs Header

1.Click 'layout'-> 'Edit html' for your blog.
(Tick The 'Expand Widget Templates' Box)

Blogger layout

edit html blogger

Expand widget templates blogger

2.Find the following piece of code in your blogs html:
(Click 'Ctrl F' for a search box to find the code)


 Affiliate Reporting

<p class='description'><span><data:description/></span></p>


3.Paste the code for your search box directly Below the code above.
Before we finish : If you need more help or have an opinion or suggestion Please leave a comment Below.
To help you this is a Do-Follow Blog leaving a comment will also help your blogs Google rank.
OK Back to business ....

Example:


<div class='descriptionwrapper'>
<p class='description'><span><data:description/></span></p>

<-----YOUR SEARCH BOX CODE GOES HERE----->

</div>
</b:includable>
Thats it !

Once you have added the code click save and your done.

Has it worked well on your blog?
If You Enjoyed This Post Please Take 5 Seconds To Share It.

Stay Connected With Free Updates

Subscribe via Email

2 comments:

  1. Hey,

    Thanks for this tip.

    What's bad is the my Google Custom Search doesn't fit in my blog and I had to make it so it opens in a new window. But thanks for writing this!
    ReplyDelete
  2. This worked really great for me! I have been trying to find a way to put it in with the code that Adsense has given and you are the only blog that I have found showed me exactly how to do it. The only problem I am having now is getting the actual search to work! I don't know why this has been so difficult for me. If you think you might know why the actual "search" isn't working for me please let me know any tips! I added the other code that Google Adsense gives you the "Search Results Code" in a post...but that didn't seem to help either. Thanks for any help! My website is crissylavery.com
    ReplyDelete

Asking a question ? Make sure to click the subscribe by email link below the comment form to get notified of replies !