Blogspot Script for an HTML Search Box
Blogger is Google's push-button publishing website. It gives registered users the tools to create and publish content to a URL ending in the domain name ".blogspot.com." When you build your Blogger website, you can choose from dozens of different gadgets that enhance the appearance of your blog and increase its functionality. Adding an HTML code for a search box is one of these options.
Other People Are Reading
-
Search Box Comes Standard
-
Visit your blog and look at the top left-hand corner of the screen; you should see a small text box with a magnifying glass next to it: this comes standard on all Blogger blogs. This search box scans your blog -- and only your blog -- for whatever you or your visitors want. If you want to change the location of this text box, however, or expand its functionality, you'll have to create a new one.
HTML Code for Search Box
-
Your first option for creating a search box on your blog is to generate HTML code for it. Start with this:
<form id="searchThis" action="http://www.nameofyourblog.com/search" style="display:inline;" method="get">
<strong>SEARCH THIS SITE!<br/></strong>
<input id="b-query" maxlength="15" name="q" size="25" type="text"/>
<input id="b-searchbtn" value="Search" type="submit"/>
</form>Change different parts of this basic code to make it your own. First, for "nameofyourblog.com" insert the complete URL for your blog. Next, instead of "Search this site!" you can put any text you like; this text will appear above your search text box. The number next to "maxlength" determines the maximum number of characters allowable in a search, while the number next to "size" determines the width of the search box -- in this case, 25 characters. Insert this script into a gadget on your blog by clicking on the "Design" tab inside your Blogger dashboard. Then, click on the "Add a Gadget" link in the Page Elements section and choose "HTML/Javascript" from the list of options.
-
Using a Pre-Made Gadget
-
If you're not comfortable using HTML to generate code for a search box, Blogger has a pre-made gadget you can use instead. Click on the "Design" tab inside your Blogger dashboard. Then, in the Page Elements section, click on the "Add a Gadget" link in the simulated layout. Click on the "Search Box" option. Select a title for your search box, then decide whether you want users to be able to search just your blog, the sites you've linked to or the entire web.
Relocating Your Script
-
Whether you created a search box using HTML or used a pre-made gadget, you can change the placement of your search box on your Blogger site. From the Page Elements section, click on the gadget and drag it into the desired location on your blog's layout. Press the "Preview" button at the top of the page to see how the gadget looks in its new location before clicking on the "Save" button to make the change take effect.
-
References
- Photo Credit Thinkstock Images/Comstock/Getty Images
