Added Google search to this theme
The idea hit me like a cold beer pouring down my throat on a hot summer day. Crisp, clean and exciting. I've been wanting to add a search form to this theme, but I didn't want to add another tab, and putting it anywhere in the header would conflict with the background image. And then I spotted the perfect spot. Right under the categories, in the banner of the first entry on this page. With a little love from the DOM, you can now search this site using this theme and Google. Here's the relevant code that I added to the bottom of this theme.
<div id="search" style="display:none; margin-top: -17px; text-align: right">
<form id="searchForm" method="get" action="http://www.google.com/search"
onsubmit="return search()" style="margin: 0; padding: 0">
<input type="text" id="q" name="q" size="20" maxlength="255"
value="search this site" onclick="this.value=''" />
</div>
<script type="text/javascript">
// get the first entry shown in the page and append the
// hidden 'search' div from above
document.getElementById("entries")
.getElementsByTagName("div")[0]
.appendChild(document.getElementById("search"));
toggle("search");
function search() {
form = document.getElementById("searchForm");
if (form.q.value == "search this site" || form.q.value == "") {
alert("Please enter a search term to continue.");
form.q.focus();
return false;
} else {
form.q.value = form.q.value + " site:www.raibledesigns.com";
form.submit();
}
}
</script>
Boy oh boy does the DOM make it easy to do web sites! Seems to work in all the browsers I use regularly (IE/Moz on Win, Camino/Safari on Mac). It doesn't work in Opera 6, but does in Opera 7. Now back to that cold beer - I'm gettin' thirsty...