Uncategorized

Blogger Search Form box code

0

Recently I explained How to add Blogger search box code to your Blogger template. Now In this post I will explain How to customize the search box code to suit your Blogger template. In order to make it easier for you , I am going to explain this with two blogger search form example codes. Once you have added the proper codes then you can have your own custom blogger search engine.

Default search box code

Here is the default code which can be used to create your own search engine in blogger.

<form id=”searchThis” action=”/search” style=”display:inline;” method=”get”><input id=”searchBox” name=”q” type=”text”/> <input id=”searchButton” value=”Go” type=”submit”/></form>

But this code will create only a basic blogger search box without any special effects. If you add this code to your blogger sidebar via a HTML / JAVASCRIPT widget , you will find it something like this

 

Customizing the Blogger search box code

The above code will create just a basic blogger search form. But it’s just not enough for blogger template designer or for those who want their blog to have a professional look. So here I have modified the default script little bit in order to add CSS codes to make special effects in blogger search box.

Here is my modified code :

<div id=’search-box’>

<form action=’/search’ id=’searchform’ method=’get’ style=’display:inline;’>
<span>SEARCH:</span>
<input class=’s’ id=’s’ name=’q’ type=’text’ value=”/>
<input class=’sub’ src=’http://techieblogger.com/wp-content/uploads/2009/06/go.gif’ type=’image’ value=’Submit’/>
</form>
</div>

and here is the CSS for this search Box code :

About the author / 

Mohamed Rias

Related Posts

Leave a reply

Your email address will not be published. Required fields are marked *

Popular

Editor’s Pick

  • Tips to shoot excellent Panoramic Photographs

    Recently, making out panoramic photos has become much easier as your software stitches them quite beautifully together. Photoshop is quite skillful and master in doing that; it has got a command called Photo Merge that weaves your photos once you hit it. Now, software is mere medium which we use to ease our post works,…

  • 35+ Inspiring Nightscape photography and Tips

    Nightscape Photography is one of the eluding styles of photography in lines of selection of photography-style by a photographer. It is sometime possible to shoot Landscape panorama, sea views, and bridges at night in such a manner as if, it has been taken at day time. A cityscape at night with lights blazing away like…

  • Notable Tips for shooting Awesome Wildlife photographs

    You can remark it as wild-time game, which surely it is. Wild is the community for animals and not ours so it’s there to decide what they will do and what they want to. You can tell them to make some gesture that well-suit your need, or you can’t ask they to align up in…

  • 85+ BreathTaking Tilt-Shift Photography and Resources

    Tilt-Shift photography is the technique of using selective focus. This is used to reduce the magnitude of large size photos to make it into miniature models. One moves the lens adjacent to the plane of the image in the shift phase while moving the lens through an angle to that of the image plane is…

  • 45+ surreal Long Exposure Photography Inspirations

    Long exposure photography is one of the coolest ways of taking pictures. It requires a longer shutter speed, anywhere from 1/2 sec up to several minutes or even a hour. The ability to take long exposures requires a user to use a tripod for optimum results (of course, some people prefer the hand shake look)….