add a search box to your blog

My super fancy matchy search boxes have been a bit unreliable lately, so until I find a better code for them, I'm providing this basic search box code that you can add anywhere to your blog. Just copy/paste the code into an HTML/JavaScript widget/gadget in your Page Elements. Depending on how your navigation menu is formatted, you can also try adding the box directly after the code for your menu.
<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="search-box" style="border: 1px solid #ffffff" name="q" size="25" type="text"/>
<input id="search-btn" value="Search" type="submit"/>
</form>
If you'd like to give the box a colored border, change the hex color code, below in PINK, to any hex color code you'd like:
<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="search-box" style="border: 1px solid #FF6666" name="q" size="25" type="text"/>
<input id="search-btn" value="Search" type="submit"/>
</form>
You can also change the solid line surrounding the box to dashed or dotted, or even increase the 1 value to make the border thicker:
<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="search-box" style="border: 2px dashed #FF6666" name="q" size="25" type="text"/>
<input id="search-btn" value="Search" type="submit"/>
</form>


RETURN TO TUTORIALS