Matt RaibleMatt Raible is a Java Champion and Developer Advocate at Okta. developer.okta.com

The JHipster Mini-Book The JHipster Mini-Book is a guide to getting started with hip technologies today: Angular, Bootstrap, and Spring Boot. All of these frameworks are wrapped up in an easy-to-use project called JHipster.

This book shows you how to build an app with JHipster, and guides you through the plethora of tools, techniques and options you can use. Furthermore, it explains the UI and API building blocks so you understand the underpinnings of your great application.

For book updates, follow @jhipster-book on Twitter.

10+ YEARS


Over 10 years ago, I wrote my first blog post. Since then, I've authored books, had kids, traveled the world, found Trish and blogged about it all.

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!

Posted in Roller at Jul 01 2003, 02:46:22 PM MDT Add a Comment
Comments:

Post a Comment:
  • HTML Syntax: Allowed