Como colocar esse Menu ?

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

Resolvido Como colocar esse Menu ?

Mensagem por Léo Sivi em 23/11/12, 02:36 am

Bom queria saber se tem como deixar esse menu da img abaixo igual o padrão do Forumeiros, com inicio, portal, calendario, membros, login, sair, etc;
Espero que tenham entendido.
Agradeço a Ajuda !!!



Fórum: http://bramegacity.forumeiros.com (phpBB 3)

Imagens do problema:


Última edição por Léo Sivi em 23/11/12, 06:05 pm, editado 1 vez(es)
avatar

Léo Sivi
Nível 4

Masculino
Inscrito dia : 01/06/2012
Mensagens : 26
Pontos Ativos : 48

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

Resolvido Re: Como colocar esse Menu ?

Mensagem por Consolado em 23/11/12, 08:23 am

Olá!

Crie seu menu aqui: http://cssmenumaker.com/
Caso queira como o fórum citado acima, aqui está: http://cssmenumaker.com/menu/red-opera-drop-down-menu

Me envie também o CSS e o HTML gerado pelo sistema!

Melhores cumprimentos.
avatar

Consolado
Super usuário

Inscrito dia : 09/05/2011
Mensagens : 4243
Pontos Ativos : 6128

Ver perfil do usuário

Resolvido Re: Como colocar esse Menu ?

Mensagem por Léo Sivi em 23/11/12, 01:06 pm

Sim eu criei, mas nao deu. Bom primeiramente nem apareceu mas eu vi q se eu criar o botão logar e eu tiver logado ele vai aparece tbm, entende, ele nao fica padrão igual o do Forumeiros. Caso vc consiga criar um menu nessa img seguindo os botões que tem no Padrão Agradeço Muito !
avatar

Léo Sivi
Nível 4

Masculino
Inscrito dia : 01/06/2012
Mensagens : 26
Pontos Ativos : 48

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

Resolvido Re: Como colocar esse Menu ?

Mensagem por FreakMeat em 23/11/12, 01:09 pm

Ola voce gostaria apenas dos nomes menos as imagens ?
avatar

FreakMeat
Usuário avançado

Masculino
Inscrito dia : 03/04/2012
Mensagens : 362
Pontos Ativos : 597

Ver perfil do usuário http://styledesigner.criaforum.com

Resolvido Re: Como colocar esse Menu ?

Mensagem por Léo Sivi em 23/11/12, 01:40 pm

nao nao amigo, eu qero esse menu aki olha:
http://i.imgur.com/NUUan.png

e deixar ele igual o Padrão da Forumeiros, assim:

Fórum, Portal, Calendário, Galeria, FAQ, Buscar, Membros, Grupos, Perfil, MP, Sair.

*Esses Tbm, Logar, Registre-se
avatar

Léo Sivi
Nível 4

Masculino
Inscrito dia : 01/06/2012
Mensagens : 26
Pontos Ativos : 48

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

Resolvido Re: Como colocar esse Menu ?

Mensagem por Consolado em 23/11/12, 01:48 pm

Olá!

O senhor já fez o menu?

Me envie o CSS e o HTML gerado pelo sistema!

Melhores cumprimentos.
avatar

Consolado
Super usuário

Inscrito dia : 09/05/2011
Mensagens : 4243
Pontos Ativos : 6128

Ver perfil do usuário

Resolvido Re: Como colocar esse Menu ?

Mensagem por Léo Sivi em 23/11/12, 02:41 pm

Aki está o HTML:
Spoiler:
<div id='cssmenu'>
<ul>
<li><a href='http://bramegacity.forumeiros.com/forum'><span>Início</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/'><span>Portal</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/calendar'><span>Calendário </span></a></li>
<li><a href='http://bramegacity.forumeiros.com/gallery/index.htm'><span>Galeria </span></a></li>
<li><a href='http://bramegacity.forumeiros.com/faq'><span>FAQ</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/search'><span>Buscar</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/memberlist'><span>Membros</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/groups'><span>Grupos</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/profile?mode=editprofile'><span>Perfil</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/privmsg?folder=inbox'><span>Mensagens Privadas</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/login?logout=1&tid=57b272618d751c5f94ab8da789d69ec9&key=e1b36e'><span>Sair</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/login'><span>Login</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/register'><span>Registrar-se</span></a></li>
</ul>
</div>

e Aki o CSS:
Spoiler:

#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
margin: 0;
padding: 0;
position: relative;
}
#cssmenu {
height: 49px;
border-radius: 5px 5px 0 0;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
background: #141414;
background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#32323a', EndColorStr='#141414', GradientType=0);
border-bottom: 2px solid #e00f16;
}
#cssmenu:after,
#cssmenu ul:after {
content: '';
display: block;
clear: both;
}
#cssmenu a {
background: #141414;
background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#32323a', EndColorStr='#141414', GradientType=0);
color: #ffffff;
display: inline-block;
font-family: Helvetica, Arial, Verdana, sans-serif;
font-size: 12px;
line-height: 49px;
padding: 0 20px;
text-decoration: none;
}
#cssmenu ul {
list-style: none;
}
#cssmenu > ul {
float: left;
}
#cssmenu > ul > li {
float: left;
}
#cssmenu > ul > li:hover:after {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: 50%;
bottom: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #e00f16;
margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
border-radius: 5px 0 0 0;
-moz-border-radius: 5px 0 0 0;
-webkit-border-radius: 5px 0 0 0;
}
#cssmenu > ul > li:last-child > a {
border-radius: 0 5px 0 0;
-moz-border-radius: 0 5px 0 0;
-webkit-border-radius: 0 5px 0 0;
}
#cssmenu > ul > li.active > a {
box-shadow: inset 0 0 3px #000000;
-moz-box-shadow: inset 0 0 3px #000000;
-webkit-box-shadow: inset 0 0 3px #000000;
background: #070707;
background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
}
#cssmenu > ul > li:hover > a {
background: #070707;
background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
box-shadow: inset 0 0 3px #000000;
-moz-box-shadow: inset 0 0 3px #000000;
-webkit-box-shadow: inset 0 0 3px #000000;
}
#cssmenu .has-sub {
z-index: 1;
}
#cssmenu .has-sub:hover > ul {
display: block;
}
#cssmenu .has-sub ul {
display: none;
position: absolute;
width: 200px;
top: 100%;
left: 0;
}
#cssmenu .has-sub ul li {
*margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
background: #e00f16;
border-bottom: 1px dotted #ec6f73;
filter: none;
font-size: 11px;
display: block;
line-height: 120%;
padding: 10px;
}
#cssmenu .has-sub ul li:hover a {
background: #b00c11;
}
#cssmenu .has-sub .has-sub:hover > ul {
display: block;
}
#cssmenu .has-sub .has-sub ul {
display: none;
position: absolute;
left: 100%;
top: 0;
}
#cssmenu .has-sub .has-sub ul li a {
background: #b00c11;
border-bottom: 1px dotted #d06d70;
}
#cssmenu .has-sub .has-sub ul li a:hover {
background: #80090d;
}

avatar

Léo Sivi
Nível 4

Masculino
Inscrito dia : 01/06/2012
Mensagens : 26
Pontos Ativos : 48

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

Resolvido Re: Como colocar esse Menu ?

Mensagem por BrunoH. em 23/11/12, 02:54 pm

Olá!
Aceda a "Gestão dos Códigos JavaScript":
Painel de Controle Seta Módulos Seta HTML & JAVASCRIPT Seta Gestão dos Códigos JavaScript
Clique em "Criar um novo JavaScript"
Título Seta Coloque um título qualquer.
Investimento Seta Em Todas as páginas
Código:
Código:
jQuery(document).ready(function(){if(jQuery('#logout').length){var m="<div id='cssmenu'>
<ul>
<li><a href='http://bramegacity.forumeiros.com/forum'><span>Início</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/'><span>Portal</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/calendar'><span>Calendário </span></a></li>
<li><a href='http://bramegacity.forumeiros.com/gallery/index.htm'><span>Galeria </span></a></li>
<li><a href='http://bramegacity.forumeiros.com/faq'><span>FAQ</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/search'><span>Buscar</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/memberlist'><span>Membros</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/groups'><span>Grupos</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/profile?mode=editprofile'><span>Perfil</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/privmsg?folder=inbox'><span>Mensagens Privadas</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/login?logout=1&tid=57b272618d751c5f94ab8da789d69ec9&key=e1b36e'><span>Sair</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/login'><span>Login</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/register'><span>Registrar-se</span></a></li>
</ul>
</div>"};jQuery('#page-header .navbar').replaceWith(m)});
e Salve!
Fazendo isto, agora aceda a "Folha de Estilo CSS":
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores Seta Folha de Estilo CSS
Código:
Código:
#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
margin: 0;
padding: 0;
position: relative;
}
#cssmenu {
height: 49px;
border-radius: 5px 5px 0 0;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
background: #141414;
background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#32323a', EndColorStr='#141414', GradientType=0);
border-bottom: 2px solid #e00f16;
}
#cssmenu:after,
#cssmenu ul:after {
content: '';
display: block;
clear: both;
}
#cssmenu a {
background: #141414;
background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#32323a', EndColorStr='#141414', GradientType=0);
color: #ffffff;
display: inline-block;
font-family: Helvetica, Arial, Verdana, sans-serif;
font-size: 12px;
line-height: 49px;
padding: 0 20px;
text-decoration: none;
}
#cssmenu ul {
list-style: none;
}
#cssmenu > ul {
float: left;
}
#cssmenu > ul > li {
float: left;
}
#cssmenu > ul > li:hover:after {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: 50%;
bottom: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #e00f16;
margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
border-radius: 5px 0 0 0;
-moz-border-radius: 5px 0 0 0;
-webkit-border-radius: 5px 0 0 0;
}
#cssmenu > ul > li:last-child > a {
border-radius: 0 5px 0 0;
-moz-border-radius: 0 5px 0 0;
-webkit-border-radius: 0 5px 0 0;
}
#cssmenu > ul > li.active > a {
box-shadow: inset 0 0 3px #000000;
-moz-box-shadow: inset 0 0 3px #000000;
-webkit-box-shadow: inset 0 0 3px #000000;
background: #070707;
background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
}
#cssmenu > ul > li:hover > a {
background: #070707;
background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
box-shadow: inset 0 0 3px #000000;
-moz-box-shadow: inset 0 0 3px #000000;
-webkit-box-shadow: inset 0 0 3px #000000;
}
#cssmenu .has-sub {
z-index: 1;
}
#cssmenu .has-sub:hover > ul {
display: block;
}
#cssmenu .has-sub ul {
display: none;
position: absolute;
width: 200px;
top: 100%;
left: 0;
}
#cssmenu .has-sub ul li {
*margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
background: #e00f16;
border-bottom: 1px dotted #ec6f73;
filter: none;
font-size: 11px;
display: block;
line-height: 120%;
padding: 10px;
}
#cssmenu .has-sub ul li:hover a {
background: #b00c11;
}
#cssmenu .has-sub .has-sub:hover > ul {
display: block;
}
#cssmenu .has-sub .has-sub ul {
display: none;
position: absolute;
left: 100%;
top: 0;
}
#cssmenu .has-sub .has-sub ul li a {
background: #b00c11;
border-bottom: 1px dotted #d06d70;
}
#cssmenu .has-sub .has-sub ul li a:hover {
background: #80090d;
}
e Valide!

Até mais! Piscada
avatar

BrunoH.
Principal contribuidor
Principal contribuidor

Inscrito dia : 15/06/2012
Mensagens : 7675
Pontos Ativos : 10382

Ver perfil do usuário http://premiumdesign3d.blogspot.com.br/ https://www.facebook.com/brunohenrique.com.br

Resolvido Re: Como colocar esse Menu ?

Mensagem por Léo Sivi em 23/11/12, 03:07 pm

ficou todo Branco olha:



e alem disso qnd vc está logado aparece o botão 'registre-se' e o 'logar' ( q nao deveria aparecer, pois esse menu deveria ficar estilo o padrao da forumeiros, qnd vc está logado nao aparece esses botões.
avatar

Léo Sivi
Nível 4

Masculino
Inscrito dia : 01/06/2012
Mensagens : 26
Pontos Ativos : 48

Ver perfil do usuário http://bramegacity.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