Raible Designs

Search improvements and HowTo set your title

I did some re-factoring to the Google search box for this theme, and also figured out a slick trick to set your weblog's title to be == $lastPost.title. Basically, I refactored my _day template to add the search box when building the page, rather than after the fact.

You ask "why, I thought you loved the DOM?" I do, but it was giving me some strange behavior: in IE, a "entry" bar would show up in the middle of the last post (fixed by scrolling) and in Mozilla Firebird, I was getting a slight "shift-left 10px" behavior of the whole page. So I built it with Velocity, here's how. In my _day template, I changed this:

<div class="entry">
   #showDayPermalink( $day )
   #showEntryDate( $day )
</div>

To this:

<div class="entry">
#if ($velocityCount == 1) 
  <div id="search" style="float: right; margin-top: -2px">
    <form id="searchForm" method="get" onsubmit="return search()"
        action="http://www.google.com/search"
        style="margin: 0; padding: 0">  
        <input type="text" id="q" name="q" size="20" 
            maxlength="255" value="search this site" 
            style="font-size: 11px; border: 1px inset silver; 
                   font-weight: normal; padding-left: 2px"
            onclick="this.value=''" /> 
    </form>
  <script type="text/javascript">
    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();
        }
    }
    document.title="Raible Designs ~ $entries.get(0).title";
  </script>
  </div>
#end
   #showDayPermalink( $day )
   #showEntryDate( $day )
</div>

There's also a hint in there to set your weblog's title to match the title of your last post. Enjoy!