•► Tutorial 100% feito por mim: Yok
•► Acredito que este tópico ira ajudar aqueles que tem dificuldades em adicionar Novos Menus, Novos Submenus, edita-los e enfeita-los com frescuras.
•► O código abaixo contem o Menu.
<div id="Nome Do Menu" class="menuitem">
<span onclick="MenuItemAction('nome do menu')">
<div class="MenuButton" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/button-background.gif);">
<div onmouseover="MouseOverMenuItem(this);" onmouseout="MouseOutMenuItem(this);"><div class="Button" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/button-background-over.gif);"></div>
<span id="forum_Lights" class="Lights">
<div class="light_lu" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
<div class="light_ld" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
<div class="light_ru" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
</span>
<div id="forum_Icon" class="Icon" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/imagem1.gif);"></div>
<div id="forum_Label" class="Label" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/label-forum.gif);"></div>
<div id="forum_Extend" class="Extend" style="background-image: url(<?PHP echo $layout_name; ?>/images/general/plus.gif);"></div>
</div>
</div>
</span>
•► Sumario: Primeiro você ira editar as seguintes partes do código.
Todas as colocações usando essa tag //-- nao copie, apenas leia
<div id="Nome do Menu" //--aqui voce colocara o nome do menu a sua escolha
<span onclick="MenuItemAction('nome do menu')"> //--novamente aqui voce ira colocar apenas o nome do menu <precisa ser igual a de cima .= sim precisa>
<div id="forum_Icon" class="Icon" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/imagem1.gif);"></div> //-- aqui é onde voce ira modificar o icone que aparecera no seu novo menu.
Basta apenas voce entrar no seguinte diretório <C:\xampp\htdocs\layouts\tibiarl\images\menu\>agora voce ira precisar de uma imagem <.GIF> , apos obtela basta apenas voce renomea-la
para o nome <imagem1> e colar na pasta <C:\xampp\htdocs\layouts\tibiarl\images\menu\> e pronto seu novo icon estara no menu.
<div id="forum_Label" class="Label" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/imagem2.gif);"></div> //-- voce ira repetir o processo de cima
porem aqui voce ira colocar a imagem que dara o nome ao seu menu. Você precisara de uma imagem <.GIF> com o nome de <imagem2>
•► Adicionando: Para adicionar o Menu ao seu site, vá ate o seguinte diretório <C:\xampp\htdocs\layouts\tibiarl> e abra o seguinte arquivo layout.php. Você encontra linhas de códigos parecidas com essas
<div id="forum_Submenu" class="Submenu">
<a href="?subtopic=forum">
<div id="submenu_forum" class="Submenuitem" onmouseover="MouseOverSubmenuItem(this)" onmouseout="MouseOutSubmenuItem(this)">
<div class="LeftChain" style="background-image:url(<?PHP echo $layout_name; ?>/images/general/chain.gif);"></div>
<div id="ActiveSubmenuItemIcon_forum" class="ActiveSubmenuItemIcon" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/icon-activesubmenu.gif);"></div>
<div id="ActiveSubmenuItemLabel_forum" class="SubmenuitemLabel">Server Forum</div>
<div class="RightChain" style="background-image:url(<?PHP echo $layout_name; ?>/images/general/chain.gif);"></div>
</div>
</a>
</div>
</div>
<div id="account" class="menuitem">
<span onclick="MenuItemAction('account')">
<div class="MenuButton" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/button-background.gif);">
<div onmouseover="MouseOverMenuItem(this);" onmouseout="MouseOutMenuItem(this);"><div class="Button" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/button-background-over.gif);"></div>
<span id="account_Lights" class="Lights">
<div class="light_lu" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
<div class="light_ld" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
<div class="light_ru" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
</span>
<div id="account_Icon" class="Icon" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/icon-account.gif);"></div>
<div id="account_Label" class="Label" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/label-account.gif);"></div>
<div id="account_Extend" class="Extend" style="background-image: url(<?PHP echo $layout_name; ?>/images/general/plus.gif);"></div>
</div>
</div>
</span>
•► Se olharem com cuidado vocês verão a linha do Código do Submenu sendo terminada em </div> e começando uma nova linha
<div id="account" class="menuitem">. Diante disso , com seu código já editado você colara ele entre essas duas linhas de códigos.
•► Resultado:
<div id="forum_Submenu" class="Submenu">
<a href="?subtopic=forum">
<div id="submenu_forum" class="Submenuitem" onmouseover="MouseOverSubmenuItem(this)" onmouseout="MouseOutSubmenuItem(this)">
<div class="LeftChain" style="background-image:url(<?PHP echo $layout_name; ?>/images/general/chain.gif);"></div>
<div id="ActiveSubmenuItemIcon_forum" class="ActiveSubmenuItemIcon" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/icon-activesubmenu.gif);"></div>
<div id="ActiveSubmenuItemLabel_forum" class="SubmenuitemLabel">Server Forum</div>
<div class="RightChain" style="background-image:url(<?PHP echo $layout_name; ?>/images/general/chain.gif);"></div>
</div>
</a>
</div>
</div>
<div id="Nome do Menu" class="menuitem">
<span onclick="MenuItemAction('Nome do Menu')">
<div class="MenuButton" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/button-background.gif);">
<div onmouseover="MouseOverMenuItem(this);" onmouseout="MouseOutMenuItem(this);"><div class="Button" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/button-background-over.gif);"></div>
<span id="forum_Lights" class="Lights">
<div class="light_lu" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
<div class="light_ld" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
<div class="light_ru" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
</span>
<div id="forum_Icon" class="Icon" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/imagem1.gif);"></div>
<div id="forum_Label" class="Label" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/imagem2.gif);"></div>
<div id="forum_Extend" class="Extend" style="background-image: url(<?PHP echo $layout_name; ?>/images/general/plus.gif);"></div>
</div>
</div>
</span>
<div id="account" class="menuitem">
<span onclick="MenuItemAction('account')">
<div class="MenuButton" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/button-background.gif);">
<div onmouseover="MouseOverMenuItem(this);" onmouseout="MouseOutMenuItem(this);"><div class="Button" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/button-background-over.gif);"></div>
<span id="account_Lights" class="Lights">
<div class="light_lu" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
<div class="light_ld" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
<div class="light_ru" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/green-light.gif);"></div>
</span>
<div id="account_Icon" class="Icon" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/icon-account.gif);"></div>
<div id="account_Label" class="Label" style="background-image:url(<?PHP echo $layout_name; ?>/images/menu/label-account.gif);"></div>
<div id="account_Extend" class="Extend" style="background-image: url(<?PHP echo $layout_name; ?>/images/general/plus.gif);"></div>
</div>
</div>
</span>
•► Caso você tenha seguido o tópico a risca você ira ter exito, caso não tenha conseguido deixe sua mensagem para mim poder ajuda-lo
Este tópico ainda sofrera atualizações !