Um novo menu no SMF 1.1.x

[Costa]

Com 2 colunas.
Vão na vossa pasta do tema default, e abram o ficheiro index.template.php

  Encontre o código

Code Select Expand

   // Show the start of the tab section.
   echo '
         <table cellpadding="0" cellspacing="0" border="0" style="margin-left: 10px;">
            <tr>
               <td class="maintab_' , $first , '">&nbsp;</td>';

   // Show the [home] button.
   echo ($current_action=='home' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'home' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '">' , $txt[103] , '</a>
            </td>' , $current_action == 'home' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

   // Show the [help] button.
   echo ($current_action == 'help' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'help' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=help">' , $txt[119] , '</a>
            </td>' , $current_action == 'help' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

   // How about the [search] button?
   if ($context['allow_search'])
      echo ($current_action == 'search' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'search' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=search">' , $txt[182] , '</a>
            </td>' , $current_action == 'search' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

   // Is the user allowed to administrate at all? ([admin])
   if ($context['allow_admin'])
      echo ($current_action == 'admin' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'admin' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=admin">' , $txt[2] , '</a>
            </td>' , $current_action == 'admin' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

   // Edit Profile... [profile]
   if ($context['allow_edit_profile'])
      echo ($current_action == 'profile' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'profile' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=profile">' , $txt[79] , '</a>
            </td>' , $current_action == 'profile' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

   // Go to PM center... [pm]
   if ($context['user']['is_logged'] && $context['allow_pm'])
      echo ($current_action == 'pm' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'pm' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=pm">' , $txt['pm_short'] , ' ', $context['user']['unread_messages'] > 0 ? '[<strong>'. $context['user']['unread_messages'] . '</strong>]' : '' , '</a>
            </td>' , $current_action == 'pm' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

   // The [calendar]!
   if ($context['allow_calendar'])
      echo ($current_action == 'calendar' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'calendar' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=calendar">' , $txt['calendar24'] , '</a>
            </td>' , $current_action == 'calendar' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

   // the [member] list button
   if ($context['allow_memberlist'])
      echo ($current_action == 'mlist' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'mlist' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=mlist">' , $txt[331] , '</a>
            </td>' , $current_action == 'mlist' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';


   // If the user is a guest, show [login] button.
   if ($context['user']['is_guest'])
      echo ($current_action == 'login' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'login' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=login">' , $txt[34] , '</a>
            </td>' , $current_action == 'login' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';


   // If the user is a guest, also show [register] button.
   if ($context['user']['is_guest'])
      echo ($current_action == 'register' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'register' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=register">' , $txt[97] , '</a>
            </td>' , $current_action == 'register' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';


   // Otherwise, they might want to [logout]...
   if ($context['user']['is_logged'])
      echo ($current_action == 'logout' || $context['browser']['is_ie4']) ? '<td class="maintab_active_' . $first . '">&nbsp;</td>' : '' , '
            <td valign="top" class="maintab_' , $current_action == 'logout' ? 'active_back' : 'back' , '">
               <a href="', $scripturl, '?action=logout;sesc=', $context['session_id'], '">' , $txt[108] , '</a>
            </td>' , $current_action == 'logout' ? '<td class="maintab_active_' . $last . '">&nbsp;</td>' : '';

   // The end of tab section.
   echo '
            <td class="maintab_' , $last , '">&nbsp;</td>
         </tr>
      </table>';
  Isto é o menu original. Substitua este código pelo seguinte;

Código

Code Select Expand

            // Show the start of the tab section.
            echo '
            <table width="100%" cellpadding="0" cellspacing="0" border="0">
               <tr>
                  <td class="catbg" height="32">
                  <div id="menu">
                  <ul class="menu">
                 
                     <li class="level1">
                     <a href="', $scripturl, '" class="level1"><span><span class="title">' , $txt[103] , '</span></span></a>
                     </li>
                     
                     <li class="level1">
                     <a href="', $scripturl, '?action=help" class="level1"><span><span class="title">' , $txt[119] , '</span></span></a>
                     </li>';
                 
                     if ($context['allow_search'])
                     echo '
                     <li class="level1">
                     <a href="', $scripturl, '?action=search" class="level1"><span><span class="title">' , $txt[182] , '</span></span></a>
                     </li>';
                     
                     if ($context['allow_calendar'])
                     echo '
                     <li class="level1">
                     <a href="', $scripturl, '?action=calendar" class="level1"><span><span class="title">' , $txt['calendar24'] , '</span></span></a>
                     </li>';
                     
                     if ($context['allow_memberlist'])
                     echo '
                     <li class="level1 parent">
                     <a href="', $scripturl, '?action=mlist" class="level1 parent"><span><span class="title">' , $txt[331] , '</span></span></a>
                     </li>';
                     echo '
                     
                  </ul>
                  </div>
                  </td>
               </tr>
               <tr>
                  <td class="catbg" height="32">
                  <div id="menu">
                  <ul class="menu">';
                 
                  if ($context['allow_admin'])
                  echo '
                  <li class="level1">
                  <a href="', $scripturl, '?action=admin" class="level1"><span><span class="title">' , $txt[2] , '</span></span></a>
                  </li>';
                 
                  if ($context['allow_edit_profile'])
                  echo '
                  <li class="level1 parent">
                  <a href="', $scripturl, '?action=profile" class="level1 parent"><span><span class="title">' , $txt[79] , '</span></span>
                  </a>
                  </li>';
                 
                  if ($context['user']['is_logged'] && $context['allow_pm'])
                  echo '
                  <li class="level1 parent">
                  <a href="', $scripturl, '?action=pm" class="level1 parent"><span><span class="title">' , $txt['pm_short'] , ' ', $context['user']['unread_messages'] > 0 ? '[<strong>'. $context['user']['unread_messages'] . '</strong>]' : '' , '</span></span>
                  </a>
                  </li>';
                 
                  if ($context['user']['is_guest'])
                  echo '
                  <li class="level1">
                  <a href="', $scripturl, '?action=login" class="level1"><span><span class="title">' , $txt[34] , '</span></span></a>
                  </li>';
                 
                  if ($context['user']['is_guest'])
                  echo '
                  <li class="level1">
                  <a href="', $scripturl, '?action=register" class="level1"><span><span class="title">' , $txt[97] , '</span></span></a>
                  </li>';
                 
                  if ($context['user']['is_logged'])
                  echo '
                  <li class="level1">
                  <a href="', $scripturl, '?action=logout;sesc=', $context['session_id'], '" class="level1"><span><span class="title">' , $txt[108] , '</span></span></a>
                  </li>';
                  echo '
                  </ul>
                  </div>
                  </td>
               </tr>
            </table>';


   echo '
            <td class="maintab_' , $last , '">&nbsp;</td>
         </tr>
      </table>';

  E para finalizar, no ficheiro style.css, adicionar no fim;

Código

Code Select Expand

div#menu {
   left: 40px;
   z-index: 11;
   height: 39px;
   background: url('images/sep_black.png') no-repeat 0 0;; padding-left:1px; padding-right:0px; padding-top:0px; padding-bottom:0px
}

resultado


div#menu ul {
   margin: 0px;
   padding: 0px;
   list-style: none;
   float: left; 
}

div#menu li {
   position: relative;
   margin: 0px;
   padding: 0px;
   display: block;
   float: left;
   z-index: 5; 
   font-weight: bold;
}

div#menu li a, #menu li span.separator {
   height: 39px;
   display: block;
   float: left;
   line-height: 32px;
   text-decoration: none;
   color: #FFFFFF;
}

div#menu li span { 
   display: block;
}

div#menu li span { 
   background-repeat: no-repeat;
   background-position: 95% 0px;
}

div#menu a:hover, div#menu span.separator:hover, div#menu span.sfhover { 
   color: #D2D2D2;
}

div#menu li.active { 
   font-weight: bold;
}

div#menu li.active ul { 
   font-weight: normal;
}

div#menu li.parent span.separator { 
   cursor: pointer;
}


div#menu ul.menu {
   padding-right: 1px;
   background: url('images/sep_white.png') no-repeat 100% 0;
}

div#menu li.level1 {
   background: url('images/sep_white.png') no-repeat 0 0;
}

div#menu a.level1, div#menu span.level1 {
   background: url('images/sep_black.png') no-repeat 100% 0;
   color: #fff; /*mude a cor das letras aqui*/
   font-size: 100%; /*mude o tamanho das letras aqui*/
     
}

div#menu a.level1 span, div#menu span.level1 span {
   padding: 5px 20px 0px 20px;
}

div#menu li:hover a.level1, div#menu li.sfhover a.level1, div#menu li:hover span.level1, div#menu li.sfhover span.level1 { 
   color: #CFD7DE;
}
div#menu a.level1 span.title, div#menu span.level1 span.title{
   padding: 0px;
}

coloque as imagens anexadas na pasta images