Header igual ao Forumeiros

3 participantes

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

Tópico resolvido Header igual ao Forumeiros

Mensagem por Daniel Z 30.01.15 22:02

Detalhes da dúvida


Versão do fórum : PunBB
Nível de acesso : Administrador
Navegador usado : Google Chrome
Imagem :
Imagem da minha dúvida:

Membros afetados : Todos os membros do fórum
Problema começou : Presente desde o início.
Endereço do fórum : http://rpg-players.forumbrasil.net/

Descrição do problema

Boa noite, pessoal.
Como o título diz, gostaria de deixar o cabeçalho do fórum igual ao forumeiros:

Barra
Banner
Menus

Tentei aplicar alguns códigos presentes em outros tópicos, mas creio que meu overall_header esteja bem modificado, como mostrado abaixo, onde é aplicado umas divs como "logos1" e "logos2".

overall_header:


Última edição por Daniel Z em 31.01.15 17:28, editado 1 vez(es)
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Sennior 30.01.15 22:24

Saudações,

Mas o senhor deseja os códigos ou imagens?
As imagens são apenas para o FdF, se outro fórum estiver usando tais imagens poderá acarretar em serias advertências.

Até mais.
Sennior

Sennior
Principal Contribuidor
Principal Contribuidor

Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903

https://ajuda.forumeiros.com/forum https://www.facebook.com/GladstonHenriq https://twitter.com/UmGladston

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 30.01.15 23:38

Apenas os códigos para ajustar o template, @Sennior.

Hoje no meu fórum, o banner e os campos de menus ficam lado a lado, e eu gostaria que ficassem organizados como no forumeiros, com a barra no topo, o banner abaixo, e os menus abaixo do banner.
Tentei acrescentar uns "<br>" no overall_header, mas ficou bem desconfigurado.
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 2:59

Olá!

Adicione uma 'br', aqui:
Código:

<!-- BEGIN switch_user_logged_out -->                  
<div id="logos1">
  <div class="logos2">
    <a href="/" id="pun-logo"><img src="http://i.imgur.com/Na7vk.png" alt="Warfare 365"></a>      
      <ul id="nav">
        <span style="display: none;">{GENERATED_NAVBAR}</span>
        <li class="menuitem home"><a href="/" rel="nofollow">Página Inicial</a></li>
        <li class="menuitem faq"><a href="/t430-faq-para-duvidas-gerais#9520" rel="nofollow">FAQ</a></li>
        <li class="menuitem register"><a href="/register" rel="nofollow">Cadastre-se</a></li>
        <li class="menuitem login"><a href="/login" rel="nofollow">Entrar</a></li>
      </ul>
  </div>      
</div>                  
<!-- END switch_user_logged_out -->
 
  
<!-- BEGIN switch_user_logged_in -->  
<div id="logos1">
  <div class="logos2">
    <a href="/" id="pun-logo"><img src="http://i.imgur.com/Na7vk.png" alt="Warfare 365"></a>
      <ul id="nav">
        <span style="display: none;">{GENERATED_NAVBAR}</span>
        <li class="menuitem home"><a href="/" rel="nofollow">Página Inicial</a></li>
        <li class="menuitem faq"><a href="/t430-faq-para-duvidas-gerais#9520" rel="nofollow">FAQ</a></li>
        <li class="menuitem users"><a href="/memberlist" rel="nofollow">Membros</a></li>
        <li class="menuitem logout"><a href="/login?logout" rel="nofollow">Sair</a></li>
        <li class="menuitem profile"><a href="/profile?mode=editprofile" rel="nofollow">Painel de Controle</a></li>
        <li class="menuitem inbox"><a href="/privmsg?folder=inbox">Mensagens <span id="inbox_number"></span></a></li>
      </ul>
  </div>
</div>
<!-- END switch_user_logged_in -->    
Esse código acima, foi retirado de seu template. Se buscar, ele estará lá.
Antes de:
Código:
  <li class="menuitem home"><a href="/" rel="nofollow">Página Inicial</a></li>
Código:
 <li class="menuitem home"><a href="/" rel="nofollow">Página Inicial</a></li>
Busque duas vezes o código acima, e faça o procedimento duas vezes.
Adicione um:
Código:
<br>

Atenciosamente,
Loko.
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 15:06

Olá, @EuficoLoko.

A estrutura ficou separada como solicitada, só é preciso agora alguns ajustes, pois os menus acabaram invadindo a área de descrição dos fóruns:
Header igual ao Forumeiros SHKLRLq




E caso eu coloque algum elemento dentro da mensagem da Homepage, como um iframe, os menus acabam se alojando dentro do campo:
Header igual ao Forumeiros X2IjOdW
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 15:10

Olá!

Creio que isso seja erro, em seu navegador. Veja como eu visualizo:
Header igual ao Forumeiros Tg7NL6i
Seta http://prntscr.com/5zcalx
Experimente apertar CTRL + F5 e limpar os cookies.

Atenciosamente,
Loko.
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 15:14

Você está certo, @EuficoLoko.
Utilizei outro navegador e ficou correto.

Poderia ajudar então a somente centralizar o banner e os menus, e diminuir o espaçamento entre eles, igual ao forumeiros?
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 15:23

É claro, segue o código CSS:

Para a logo:
Código:
#pun-logo {
left: 30% !important;
position: relative !important;
}
Procure por '30', vá aumentando e/ou diminuindo.
Para o menu, será esse CSS:
Código:
#nav {
position: relative !important;
left: -40% !important;
}
Procure por '40', vá aumentando e/ou diminuindo.

Ficará assim:
Header igual ao Forumeiros FLQT2Kr

Atenciosamente,
EuficoLoko.
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 15:38

Olá, EuficoLoko.
Centralizou certinho.

Só não consegui ajustar a imagem de fundo a modo que se prolongue juntamente dos fundos da barra e do banner, e fica um espaço entre os dois bem grande:

Header igual ao Forumeiros VXYWJjz

Código:
#nav {
position: relative !important;
left: -30% !important;
background-image:url('http://i.imgur.com/vCVDBHB.png');
background-repeat: (repeat-x) !important;
}

Seria apenas ajustar esses dois Feliz
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 15:58

Olá!

Acrescente em sua CSS:
Código:
ul#nav{
line-height: 30px !important;
margin-top: 10% !important;
}
Procure por '30px', vá aumentando para aumentar a largura.
procure por '10%', quanto mais aumentar mais ele vai descer.
Resultado:
Header igual ao Forumeiros 8655gBh

Atenciosamente,
Loko.
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 16:08

Muito obrigado, @EuficoLoko.
Só restou a questão da largura do campo.

Header igual ao Forumeiros CoZxUyo

O Line-height afeta apenas a altura, e então aplicando agora para a largura, minha questão fica resolvida.
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 16:16

Olá!

Troque meu último código, por esse:
Código:
ul#nav{
line-height: 20px !important;
padding-left: 51% !important;
padding-right: 50% !important;
margin-right: -50% !important;
}
Resultado:
Header igual ao Forumeiros QzL1jWB

Atenciosamente,
Loko.
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 16:25

Olá, @EuficoLoko.

Ficou assim:

Header igual ao Forumeiros UXUDL6a
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 16:27

Olá!

Novamente venho lhe dizer, resete os cookies ou visualize por outro navegador.
Veja:
Header igual ao Forumeiros JZvghd7
A imagem acima, retrata o estado atual de vosso fórum. Feliz
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 16:32

Estranho, @EuficoLoko.
Eu limpei os cookies e utilizei três navegadores diferentes: IE, Vivaldi, Firefox.
E nenhum deles está conforme sua screenshot. Todos foram limpados os cookies.
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 16:34

Experimente pelo 'Google Chrome', este e o meu navegador. Feliz
A propósito, seus navegadores estão atualizados?

Atenciosamente,
Loko.
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 16:36

Encontrei o problema, @EuficoLoko.

Header igual ao Forumeiros 0YKus54

Quando você está logado no fórum, aparece mais opções no campo, como membros e Painel de controle, e esse aumento de campos, acaba desconfigurando o local.
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 16:46

Olá!

Aqui ainda fica normal, mas adicione em sua CSS:
Código:
#nav li.menuitem.inbox a[href="/privmsg?folder=inbox"]{position: relative !important;white-space: nowrap !important;top: -18px !important;left: 100px !important;}
Ele modificara a localização do menu 'Mensagens'.

Atenciosamente,
EuficoLoko.
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 16:52

Olá, @

O resultado foi este, com os cookies dos navegadores limpos:

Chrome
Não logado:
Header igual ao Forumeiros Rp7PB5O
Logado:
Header igual ao Forumeiros MGt2pP0

FireFox:
Não logado:
Header igual ao Forumeiros NXd91Cm
Logado:
Header igual ao Forumeiros Ca1Bj1n
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 17:10

Olá!

Estranho, aqui continua perfeito..
Troque o meu último código, por esse:
Código:
.loko {
background: url('http://i.imgur.com/6neqrhQ.png') no-repeat left center;
float: right !important;
position: relative !important;
white-space: nowrap !important;
top: -18px !important;
left: 100px !important;
}

E além disso, no meu penúltimo código:
Código:
ul#nav{
line-height: 20px !important;
padding-left: 51% !important;
padding-right: 50% !important;
margin-right: -50% !important;
}
Acima busque por 'padding-left: 51%', quanto mais aumentar, mais distancia ele vai ter para o lado esquerdo.
Procure por 'padding-right': 50%, quanto mais aumentar, mais distância o menu terá do lado direito.
Procure por 'margin-right: 50%', quanto mais aumentar, mais para o lado esquerdo ele vai ir.
Faça as suas modificações.

Além disso, crie um novo js - Em todas as páginas:
Código:
$(function(){$('ul#nav li.inbox:contains("Mensagens")').addClass('loko').css('float', 'right !important');});
Ele fará com que o menu 'Mensagens', fique junto ao seu ícone na posição correta.
Header igual ao Forumeiros 88WVJGe

Atenciosamente,
Loko.
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 17:20

Ficou assim, @EuficoLoko:

Não logado:
Header igual ao Forumeiros U6i8r8I
Logado:
Header igual ao Forumeiros N7Z7GOi

Realmente em nenhum dos casos ele atinge as bordas como é acontece nos outros casos.

Uma pergunta:
<div id="logos1">
<div class="logos2">

Estão atrelados a essa área no overall_header.

Um dos dois não pode esta afetando o template?
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 17:25

Então, lamento dizer mais o problema e ai.
Eu não fiz nenhuma edição pelo console e o fórum está assim:

Não logado:
Header igual ao Forumeiros Ok8PuZb
Logado:
Header igual ao Forumeiros Kbz0glq

Tente reinstalar o seu navegador. Essas divs, não alteram nada meu caro; elas só fazem parte do html mesmo.
Não há como resolver um problema, que não existe. Perdoe-me. ...
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por Daniel Z 31.01.15 17:27

Vou verificar aqui. Obrigado assim mesmo.
Daniel Z

Daniel Z
***

Membro desde : 30/04/2012
Mensagens : 116
Pontos : 189

http://rpgteste.queroforum.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Header igual ao Forumeiros

Mensagem por EuficoLoko 31.01.15 17:33

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos