<ul id="tabs">
      <!-- **** INSERT NAVIGATION ITEMS HERE (use id="selected" to identify the page you're on **** -->
      <li><a href="index.php">home</a></li>
      <li><a href="about.php">about</a></li>
      <li><a href="portfolio.php">portfolio</a></li>
      <li><a href="services.php">services</a></li>
      <li><a href="contact.php">contact</a></li>
      <li><a target="_blank" href="/blog">blog</a></li>
    </ul>
    <script type="text/javascript">
      window.onload=function () {
        function tabSelector (tabs) {
          function basename (location) {
            return location.split('/').pop().split('?').shift().split('#').shift();
          }
          var current = basename(window.location.href);
          var ti;
          for (ti in tabs) {
            if (typeof(tabs[ti]) === 'object')
              tabs[ti].id = (basename(tabs[ti].href) == current) ? 'selected' : null;
            }
          }
          tabSelector (document.getElementById('tabs').getElementsByTagName('a'));
        }
    </script>