title: How to change the menu classes in Joomla 3 default.php file to mimic custom menu classes
body: <p>Ok the background on this is as follows: 
  1.  I want the joomla menu nav to switch from its default classes to my custom classes and add an  tag for the pages active menu item (if neccessary)</p>
  
  <p>The default classes in the default.php file is this</p>
  
  <pre><code>&lt;ul class="nav menu&lt;?php echo $class_sfx;?&gt;"&lt;?php
  $tag = '';
  
  if ($params-&gt;get('tag_id') != null)
  {
      $tag = $params-&gt;get('tag_id') . '';
      echo ' id="' . $tag . '"';
  }
   ?&gt;&gt;
   &lt;?php
   foreach ($list as $i =&gt; &amp;$item)
   {
  $class = 'item-' . $item-&gt;id;
  
  if ($item-&gt;id == $active_id)
  {
      $class .= ' current';
  }
  
  if (in_array($item-&gt;id, $path))
  {
      $class .= ' active';
  }
  elseif ($item-&gt;type == 'alias')
  {
      $aliasToId = $item-&gt;params-&gt;get('aliasoptions');
  
      if (count($path) &gt; 0 &amp;&amp; $aliasToId == $path[count($path) - 1])
      {
          $class .= ' active';
      }
      elseif (in_array($aliasToId, $path))
      {
          $class .= ' alias-parent-active';
      }
  }
  
  if ($item-&gt;type == 'separator')
  {
      $class .= ' divider';
  }
  
  if ($item-&gt;deeper)
  {
      $class .= ' deeper';
  }
  
  if ($item-&gt;parent)
  {
      $class .= ' parent';
  }
  
  if (!empty($class))
  {
      $class = ' class="' . trim($class) . '"';
  }
  
  echo '&lt;li' . $class . '&gt;';
  
  // Render the menu item.
  switch ($item-&gt;type) :
      case 'separator':
      case 'url':
      case 'component':
      case 'heading':
          require JModuleHelper::getLayoutPath('mod_menu', 'default_' .                                                 $item-&gt;type);
          break;
  
      default:
          require JModuleHelper::getLayoutPath('mod_menu', 'default_url');
          break;
  endswitch;
  
  // The next item is deeper.
  if ($item-&gt;deeper)
  {
      echo '&lt;ul class="nav-child unstyled small"&gt;';
  }
  elseif ($item-&gt;shallower)
  {
      // The next item is shallower.
      echo '&lt;/li&gt;';
      echo str_repeat('&lt;/ul&gt;&lt;/li&gt;', $item-&gt;level_diff);
  }
  else
  {
      // The next item is on the same level.
      echo '&lt;/li&gt;';
  }
   }
   ?&gt;&lt;/ul&gt;
  </code></pre>
  
  <p>the output via browser is this</p>
  
  <pre><code>&lt;ul class="nav menu"&gt;
  &lt;li class="item-101 current active"&gt;&lt;a href="/"&gt;Home&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;
  </code></pre>
  
  <p>the output I would like it to be is this... </p>
  
  <pre><code> &lt;ul class="title-area"&gt;
      &lt;li class="name"&gt;
      &lt;h1&gt;&lt;a href="#"&gt;My Site&lt;/a&gt;&lt;/h1&gt;
    &lt;/li&gt;
   &lt;/ul&gt;
  </code></pre>
  
  <p>My brute intution would tell me to change the nav to title-area but I am unsure of how to incorporate "name" into the li structure.  </p>
  
  <p>Moreover, I am assuming the  tag is only for the page that is active or present at the moment... This would be nice to incorporate as well... as my foundation css structure has the line height already assigned to that structure of html.  </p>
  
  <p>help is appreciated.  </p>