Saturday, February 17, 2007

How to put a sitesearch box in your blog

In every blogspot.com blog, there should be a search box in the navbar at the top left corner of the page. Putting a search term in the box will lead to a page with all the posts containing that search term.

However, some bloggers for various reasons like to hide or remove this navbar. You can replace this a Google sitesearch box like the one in the Header of this blog. However, to be able to do that, you have to have an AdSense account. If you want to apply for an AdSense account, you can click on the text link that reads "Generate revenue from your website. Google AdSense" at the top of the right sidebar. Also, this search box works in a different way from the search box in the navbar. It produces a page with links to posts that contain the search term.

Blogger tips

There is one more way of putting a search box that gives the same result as the search box in the navbar, that is, producing a page that contains all posts rather than links. You can see an example of the search box at this blog: Good Health Information. The search box is at the bottom of the left sidebar, below the profile. Try typing in a search term (for example - diet) into the box and click "Search" and observe what is the result. You will get a page of all the posts that contain the term "diet" in it.

The method to do this is as follows. In the Layout, click on "Add a Page Element", then select HTML/Javascript and click "Add to blog". Then in the resulting box, paste this script:

<div class="widget-content"><form id="searchblog" action="/search"
style="display: inline;" method="get"><input id="search-box" name="q"
size="20" type="text"/><input id="search-btn" value="Search"
type="submit"/></form></div>


If you wish, type in a title like what I have done (Search This Site), then click "Save changes". The new Page Element will appear at the top of whichever section you have added the Page Element (in my case, it was in the left sidebar). Drag and drop to whatever position you want, preview if you want, then at the top right of the Layout, click "Save".

Update 29 May 2007: In the demonstration blog Good Health Information, you may have noticed that there are 2 search boxes, one which is the Google sitesearch box right above the main column, and the one generated using the method described here at the bottom of the left sidebar. I have put the Google sitesearch bar in a more prominent position because of 3 reasons. I can chose to have the search result open in the same or different window with the Google sitesearch box. Also, the search result page opened by using the Google sitesearch box was generated by using my Google AdSense account. Further, I can configure the background color of the Google sitesearch box as described in Blending the color of your searchbox to the colors of your site. AdSense also places unobtrusive ads at the side of the search result page that are relevant to the search. I personally do not mind such ads because they are relevant to the matter at hand. In fact, I have AdSense in most of my blogs and I have to take care not to click on them even when the ad offers something that interest me, which is not infrequent. That would be an invalid click and can get me banned from AdSense. If you want a Google AdSense sitesearch box, you will have to join the AdSense program which you can do by clicking the text link that says "Generate revenue from your website. Google AdSense" at the top of the right sidebar of all my blogs, including this one.

Acknowledge: This tip was obtained from Teancum of What to do at SVU

28 comments:

  1. Thank you very much. Very useful tip, as usual.

    ReplyDelete
  2. I have found your blog to be very helpful, but there is one thing I want to learn to do that I haven't seen yet. I want the background (and ideally the sidebar, although that's not as important) not to scroll down, so that just the blog posts would scroll down when I use the scrollbar. Is that possible? If so, how do you do it?

    ReplyDelete
  3. hi, i love your blog and everything in it! i really do. i have spent 2 days looking at (and trying some of) your instructions. i'm a semi-new blogger, in that i started years ago and never really got around to updating my blog - well until now. so thank you very much. and thank you too for making them so easy as i have no knowledge whatsoever with html(?) yet i have managed to do things in my blog i can only dream of!!

    thank you also for the wonderful picture of your smile, it is always refreshing to see who is beyond the words.

    i have a request i'd like to make, and i'm hoping you can help me. = )
    i'd like to know where i can (or how i can) put sort of a notepad in my sidebar, very much like a shoutbox except more like a postit - which is going to be a "note to self." i know this defeats the purpose of the main blog entry, but i just want to put short reminders to self sometimes. i hope this request didn't confuse you.

    again thank you very very much for this wonderful entries. = )

    ReplyDelete
  4. Will it be a "PostIt" that will be filled in by yourself or by your visitors. Will it be something like what you see in the bottom of the right sidebar of this blog Good Legal Information with the title "NotePad"? Or something like a Guestbook that let your visitors put in stuff?

    Peter
    Dummies Guide to Google Blogger

    ReplyDelete
  5. by myself, but without having to go to the layout page and put it there and then changing and saving my layout every time. is that possible at all? i'm thinking now it would have to be a widget or an add-on. i've seen a postit widget (from yahoo) but i think that's for a desktop and not really a blog.

    ReplyDelete
  6. It is now very easy putting searchbox, etc in the New Blogger. Just do it via the "Add a Page Element" in the Layout. It is also called a widget. If you have problem, maybe I will specially write out a post on how to add a sitesearch box in your blog. Just let me know where you want the search box.

    Peter (Blog*star 2006)
    Blogger Tips and Tricks

    ReplyDelete
  7. In old blogger, the archive would automatically update if you clicked on an older post.
    This no longer happens, so you can not access older posts via the archive other than the 10 shown there.
    Have you noticed this and figured out a workaround by any chance?
    Thanks
    ParisBreakfasts

    ReplyDelete
  8. Thanks for your help yesterday, Peter. If not for you I would still be trying to figure out how to make widgets work on my FTP Blogger site. I plugged you this morning on my blog.

    I have another puzzler, this regarding Blog Search. I have always used FTP for my blog but I recently changed my URL. Now Blog Search can't find me. All word searches come back "Your search - anything blogurl:http://ponderingpig.com/ - did not match any documents."
    Ping is set to yes, as is "Add your blogs to our listings". The search box in the 'Edit Posts' subtab works perfectly.
    Can you give me any suggestions to fix Blog Search?

    ReplyDelete
  9. Enviroman, you provide great advice, however I would disagree here.

    You should put a site search box at the bottom of each post, in case your visitors want to look for additional information after reading your topic.

    Put your most valuable ads in the top right and left of your site. That's primo real estate, don't waste it on something that sends your viewers away from you for free or little or no money. :)

    Best Regards as always,
    brettbum
    Softduit Partners

    ReplyDelete
  10. Unfortunately I don't have a blog where there are more than 10 articles in a month, so am unable to check if that is so. But what I have done is to check on the number of articles displayed when I click the archives for 2006 for this blog Blogger Tips and Tricks and I counted 48 posts displayed on the page. (The archive page is Blogger Tips and Tricks 2006 archive.

    Peter a.k.a. enviroman
    Enviroman Says

    ReplyDelete
  11. Hi Brett,

    Thanks for your comments, which I agree with. That is why I have not put a searchbox in this blog other than the Google sitesearch box in the header, which will open in new windows. And even for this post, in the test blog I used Good Health Information, the searchbox was dragged and dropped to the bottom of the right sidebar. It was added just for demonstration purpose, not really for any need for a search box. If I want a seach box, I will use a Google sitesearch box since I have a Google AdSense account. However, some readers may not have such an account, and thus do not have that choice.

    Peter a.k.a. enviroman
    Enviroman Says

    ReplyDelete
  12. where I paste googlesearch code for google search .I want google search same as your blog have at title of blog.
    Please help

    regards
    http://vista-tip.blogspot.com/

    ReplyDelete
  13. hii,
    Really helpful tutorial Peter, keep it up. I think i have search box on my blog? Don't i ? :)
    Just kidding thanks for sharing

    ReplyDelete
  14. hi peter, i would just like to share, i finally found what i was looking for, it's the google notepad. and i put it in my sidebar. only problem is anyone can delete what's in it (very temporary) but i like it so far. thanks so much for your tutorials.

    ReplyDelete
  15. Hi Chella,

    Thanks for the tips. Will be checking it out.

    Peter a.k.a. enviroman
    Enviroman Says

    ReplyDelete
  16. multilingual blogs are also possible, it appears

    try http://agileukraine.blogspot.com/
    if interested

    let me know you're interested in the techniques

    ReplyDelete
  17. Hii Peter,
    Do i need to put one more search box on my new blog(http://visitformoney.blogspot.com) ? How is the new link unit and google search on my blog? PLEASE REVIEW. Thank you

    Best Regards
    Eliena Andrewss

    ReplyDelete
  18. You have removed the navbar which means you also have removed the blogsearch box. You have the Google Sitesearch (but set to search the web by default. To search your site, your visitor will have to tick the radio button. If you want your visitor to search your site by default, you will have to regenerate the script again) which produces a different SERP (search engine result page). I would suggest you add the blogsearch box but put it below the fold as it is less important.

    Peter a.k.a. enviroman
    Enviroman Says

    ReplyDelete
  19. Thank you so much! It's very helpful.

    ReplyDelete
  20. very useful information , thanks a lot , i 've been looking this one for ages , ohh yeah Peter never've dissappoint me with surprises :)
    freeacnetips.blogspot.com

    ReplyDelete
  21. Your blog is a great help to newbie bloggers like myself. Thanks for sharing these tips with us. I found your blog only a couple of days ago and I have used some of your tips already.

    Thanks again.

    ReplyDelete
  22. Hi Peter,

    Thanks for the search code (the small one on the side). Just wondering how do I limit the search to display 10 results at a time? and can you also show me how to make the appear centred instead of aligned left? many thanks in advance!

    ReplyDelete
  23. how can i get the google search box like the one you have on the top?

    ReplyDelete
  24. Thanks for the code. Is it possible to include labels in the search result?

    ReplyDelete
  25. Hi Pigpigscorner,

    Label (categories) pages are not indexed by search engines

    ReplyDelete
  26. How To Put Shoutmix On Right Side? can U tell me?

    ReplyDelete
  27. Go to
    www.shoutmix.com/
    and get your ShoutMix codes which is in the form of an (iFrame which you can copy-paste into post editor in the main column or in a HTML/Javascript usually in the sidebar. Adjust height and width as desired.

    ReplyDelete

Find help, info, instructions, tips, tricks

Tip: Use search box below or this box, labels in the first right sidebar, archive, ctrl+F for this page or sitemap to find topics