Personalizar a barra de menu

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Personalizar a barra de menu

Mensagem por Galileu em 04/05/14, 01:48 am

  • Descrição:
Olá, amigos! Novamente estou aqui, desta vez preciso saber se na plataforma do Invision eu consigo customizar o layout do meu Menu de Navegação para deixá-lo de forma semelhante à deste fórum:


  • Informações:
Fórum:http://e-gamesbrasil.forumeiros.comVersão:INVISION
Tipo:Pedido de códigoTags:Personalizar,barra



Última edição por Galileu em 06/05/14, 08:26 pm, editado 1 vez(es)
avatar

Galileu
Nível 9

Masculino
Inscrito dia : 16/12/2012
Mensagens : 189
Pontos Ativos : 291

Ver perfil do usuário http://cidadezumbi.forumeiros.com

Resolvido Re: Personalizar a barra de menu

Mensagem por Tiaguu em 04/05/14, 10:27 pm

Olá você pode acessar o site CSS MENU MAKER, lá se encontra vários menus que você pode utilizar em seu fórum.

Caso você gostar dê uma olhada nesse tutorial.

Tiaguu
Usuário destaque

Masculino
Inscrito dia : 28/08/2011
Mensagens : 644
Pontos Ativos : 977

Ver perfil do usuário http://wscgames.forumeiros.com/

Resolvido Re: Personalizar a barra de menu

Mensagem por Galileu em 05/05/14, 10:48 pm

O tutorial não funcionou, houveram bugs no fórum que resultaram à má aparência do menu. Alguma outra solução?
avatar

Galileu
Nível 9

Masculino
Inscrito dia : 16/12/2012
Mensagens : 189
Pontos Ativos : 291

Ver perfil do usuário http://cidadezumbi.forumeiros.com

Resolvido Re: Personalizar a barra de menu

Mensagem por Tiaguu em 05/05/14, 11:27 pm

No tutorial o BrunoH oferece um HTML, nesse HTML deve ser colocado dois códigos, ou seja, dois menus, um quando o visitante está logado e o outro e quando está deslogado.
No CssMenu Maker tem uma aba quando você está editando o menu, chamada CSS, basta copiar e colocar em sua CSS.

Se possível pode colocar um print do erro ?

@Edit:

Aqui está o HTML completo, basta mudar os links.
Código:
jQuery(document).ready(function(){
jQuery("#page-header .navbar, body table.bodylinewidth tbody tr td.bodyline table tbody tr td a:eq(0), #pun-head #pun-navlinks, #submenu").before("<div class='novomenu'></div>");
jQuery("#page-header .navbar, body table.bodylinewidth tbody tr td.bodyline table tbody tr td a:eq(0), #pun-head #pun-navlinks, #submenu").css({"display":"none"});});
jQuery(document).ready(function(){if(jQuery('#logout').length){var m="<div id='cssmenu'>
<ul>
  <li><a href='http://omortovivorpg.forumeiros.com/forum'><span>Início</span></a></li>
  <li><a href='http://omortovivorpg.forumeiros.com/portal'><span>Portal</span></a></li>
  <li class='has-sub'><a href='#'><span>Products</span></a>
      <ul>
        <li class='has-sub'><a href='#'><span>Product 1</span></a>
            <ul>
              <li><a href='#'><span>Sub Item</span></a></li>
              <li class='last'><a href='#'><span>Sub Item</span></a></li>
            </ul>
        </li>
        <li class='has-sub'><a href='#'><span>Product 2</span></a>
            <ul>
              <li><a href='#'><span>Sub Item</span></a></li>
              <li class='last'><a href='#'><span>Sub Item</span></a></li>
            </ul>
        </li>
      </ul>
  </li>
  <li><a href='http://omortovivorpg.forumeiros.com/memberlist'><span>Membros</span></a></li>
  <li><a href='http://omortovivorpg.forumeiros.com/groups'><span>Grupos</span></a></li>
  <li><a href='http://omortovivorpg.forumeiros.com/register'><span>Perfil</span></a></li>
  <li><a href='http://omortovivorpg.forumeiros.com/privmsg'><span>Mensagens privadas</span></a></li>
  <li class='last'><a href='http://omortovivorpg.forumeiros.com/login?logout=1'><span>Sair</span></a></li>
</ul>
</div>"}else{var m="<div id='cssmenu'>
<ul>
  <li><a href='index.html'><span>Início</span></a></li>
  <li><a href='http://omortovivorpg.forumeiros.com/portal'><span>Portal</span></a></li>
  <li class='has-sub'><a href='#'><span>Products</span></a>
      <ul>
        <li class='has-sub'><a href='#'><span>Product 1</span></a>
            <ul>
              <li><a href='#'><span>Sub Item</span></a></li>
              <li class='last'><a href='#'><span>Sub Item</span></a></li>
            </ul>
        </li>
        <li class='has-sub'><a href='#'><span>Product 2</span></a>
            <ul>
              <li><a href='#'><span>Sub Item</span></a></li>
              <li class='last'><a href='#'><span>Sub Item</span></a></li>
            </ul>
        </li>
      </ul>
  </li>
  <li><a href='http://omortovivorpg.forumeiros.com/memberlist'><span>Membros</span></a></li>
  <li><a href='http://omortovivorpg.forumeiros.com/groups'><span>Grupos</span></a></li>
  <li><a href='http://omortovivorpg.forumeiros.com/register'><span>Registar-se</span></a></li>
  <li class='last'><a href='http://omortovivorpg.forumeiros.com/login'><span>Login</span></a></li>
</ul>
</div>"};jQuery('.novomenu').replaceWith(m)});

Só basta você adicionar o CSS do menu no seu fórum.


Espero ter ajudado.

Tiaguu
Usuário destaque

Masculino
Inscrito dia : 28/08/2011
Mensagens : 644
Pontos Ativos : 977

Ver perfil do usuário http://wscgames.forumeiros.com/

Resolvido Re: Personalizar a barra de menu

Mensagem por Galileu em 06/05/14, 08:26 pm

Consegui resolver.
avatar

Galileu
Nível 9

Masculino
Inscrito dia : 16/12/2012
Mensagens : 189
Pontos Ativos : 291

Ver perfil do usuário http://cidadezumbi.forumeiros.com

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum