[Resolvido] [Resolvido] Logo, menu e coluna de widgets
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
[Resolvido] [Resolvido] Logo, menu e coluna de widgets
caros,
Vendo o seguinte fórum:
http://sitiomarado.forumeiros.com/
Fiquei com 2 dúvidas. Já fiz buscas e não consegui resolver nenhuma delas;
1) Como inverter o logo com o menu ?? Nesse fórum, o menu está acima do logo. Como se faz isso ????
2) A coluna da esquerda com os widgets, pode ser escondida, retrátil, apenas clicando no ícone >> ou <<. Como fazer isso ???
Meu fórum é INVISION,
[]´s
Vendo o seguinte fórum:
http://sitiomarado.forumeiros.com/
Fiquei com 2 dúvidas. Já fiz buscas e não consegui resolver nenhuma delas;
1) Como inverter o logo com o menu ?? Nesse fórum, o menu está acima do logo. Como se faz isso ????
2) A coluna da esquerda com os widgets, pode ser escondida, retrátil, apenas clicando no ícone >> ou <<. Como fazer isso ???
Meu fórum é INVISION,
[]´s
Última edição por Magno.Peugeot em 26.10.10 0:02, editado 1 vez(es)
Re: [Resolvido] [Resolvido] Logo, menu e coluna de widgets
Olá Magno.Peugeot,
1ª dúvida - Isso às vezes depende da versão do tema do fórum. Pode dizer-me qual é a do seu por favor?
2ª dúvida - Basta criar um widget personalizado, e colocar nele o seguinte código:
Coloque como título algo que lhe faça saber o que é aquele widget, depois coloque como "não" na opção "table type". Depois coloque o widget no topo da coluna.
Alguma dúvida por favor diga-nos.
Até mais.
1ª dúvida - Isso às vezes depende da versão do tema do fórum. Pode dizer-me qual é a do seu por favor?
2ª dúvida - Basta criar um widget personalizado, e colocar nele o seguinte código:
- Código:
<br><br><div id="page-body"><div id="content-container"><div id="outer-wrapper"><div id="wrapper"><div id="container"><div id="content"><div id="left"><div id="forum-widget" style="height: 13px; width: 16px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; position: absolute;background: #FFFFFF url(http://i39.tinypic.com/68esds.png) no-repeat 0 -13px;" onClick="if(my_getcookie('forum-widget')=='0') { jQuery('#content-container div#container').css('margin-right','-3px');jQuery('#content-container div#content').css('margin-right','3px');jQuery('#content-container div#left').animate({width: '180px',marginRight: '3px'}, 2000);jQuery('*+ html #content-container div#main').css('margin-left','183px');jQuery('#wrap').css('min-width','951px');jQuery('* html .conteneur_container_IE').css('margin-left','-1083px');jQuery('* html .conteneur_minwidth_IE').css('padding-left','1083px'); my_setcookie('forum-widget','1',0,0); jQuery('#forum-widget').css('background-position','0 -13px'); } else { jQuery('#content-container div#container').css('margin-right','0px');jQuery('#content-container div#content').css('margin-right','0px');jQuery('#content-container div#left').animate({width: '0px',marginRight: '0px'}, 2000);jQuery('*+ html #content-container div#main').css('margin-left','0px');jQuery('#wrap').css('min-width','768px');jQuery('* html .conteneur_container_IE').css('margin-left','-900px');jQuery('* html .conteneur_minwidth_IE').css('padding-left','900px'); my_setcookie('forum-widget','0',1,0); jQuery('#forum-widget').css('background-position','0 0px'); }"></div><div style="height:4px"></div><div class="module"><div class="inner"><span class="corners-top"><span></span></span>
<script type="text/javascript"> if(my_getcookie('forum-widget')=='0') { jQuery('#content-container div#container').css('margin-right','0px');jQuery('#content-container div#content').css('margin-right','0px');jQuery('#content-container div#left').css('width','0px').css('margin-right','0px');jQuery('*+ html #content-container div#main').css('margin-left','0px');jQuery('#wrap').css('min-width','768px');jQuery('* html .conteneur_container_IE').css('margin-left','-900px');jQuery('* html .conteneur_minwidth_IE').css('padding-left','900px'); jQuery('#forum-widget').css('background-position','0 0px'); } </script>
Coloque como título algo que lhe faça saber o que é aquele widget, depois coloque como "não" na opção "table type". Depois coloque o widget no topo da coluna.
Alguma dúvida por favor diga-nos.
Até mais.
Callie- Membro Entusiasta
- Membro desde : 20/12/2009
Mensagens : 5007
Pontos : 7285
Re: [Resolvido] [Resolvido] Logo, menu e coluna de widgets
Bom dia,
Irei começar pela segunda dúvida! Aqui fica para você, em primeira mão, um tutorial que somente irá sair aqui no FdF oficialmente nas próximas semanas, mas como está pronto acho que não tem problema em mostrar, será melhor do que eu explicar tudo novamente!
Para a primeira dúvida, deverá adicionar o seguinte código CSS na Folha de estilos do seu fórum:
Irei começar pela segunda dúvida! Aqui fica para você, em primeira mão, um tutorial que somente irá sair aqui no FdF oficialmente nas próximas semanas, mas como está pronto acho que não tem problema em mostrar, será melhor do que eu explicar tudo novamente!
- Ocultar os widgets do fórum:
Conteúdos aleatórios
Com este tutorial veremos como podemos ocultar os widgets da estrutura do fórum, para os usuários que usam o fórum em resoluções menores, naquelas em que os widgets laterais consomem muito espaço, prejudicando a visualização. Com este tutorial aprenderá a criar um botão para que o usuário possa escolher.
Atenção: o efeito não funciona para a versão phpBB 2!--> Tutoriais e astúcias <--
Ocultar os widgets do fórum
1º - Criar dois widgets personalizados:
Para que o código funcione é necessário criar dois widgets, um que ficará no topo da coluna e outro que ficará na parte inferior.
Para criar o widget teremos de aceder a:
Painel de controle -> Módulos -> Portal & Widgets -> Widgets do fórum
E carregar em:Para mais informações consulte a 2ª parte do tutorial:
Administração e instalação do portal / widgets
2º - Código de cada widget:
Agora teremos que ter cuidado, pois se queremos colocá-lo na coluna direita é um código e se queremos colocar na coluna esquerda é outro. Vejamos como deve ficar o código dos dois widgets para cada um dos casos a seguir:- Códigos para o widget na coluna da esquerda
Widget número 1
Widget número 2<div id="forum-widget" style="height: 13px; width: 16px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; cursor: pointer; position: absolute; background: #f5ebf7 url(https://2img.net/h/oi42.tinypic.com/vg54yu.png) no-repeat 0 -13px;" onClick="jQuery('#left').animate({width:'toggle',height:'toggle',opacity:'toggle'},1000); if(my_getcookie('forum-widget-ENDERECO_DO_FORUM')=='0') { my_setcookie('forum-widget-ENDERECO_DO_FORUM','1',0,0); jQuery('#forum-widget').css('background-position','0 -13px'); } else { my_setcookie('forum-widget-ENDERECO_DO_FORUM','0',1,0); jQuery('#forum-widget').css('background-position','0 0px'); }"></div><script type="text/javascript"> jQuery('#forum-widget').insertBefore('#left'); if(my_getcookie('forum-widget-ENDERECO_DO_FORUM')=='0') {jQuery('#left').animate({width:'toggle',height:'toggle',opacity:'toggle'},0); jQuery('#forum-widget').css('background-position','0 0px'); } </script>
- Códigos para o widget na coluna da direita
Widget número 1
Widget número 2<div id="forum-widget" style="cursor: pointer; height: 13px; width: 16px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; position: relative; bottom: -15px; float: right; background: #f5ebf7 url(https://2img.net/h/oi42.tinypic.com/vg54yu.png) no-repeat 0 -13px;" onClick="jQuery('#right').animate({width:'toggle',height:'toggle',opacity:'toggle'},1000); if(my_getcookie('forum-widget-ENDERECO_DO_FORUM')=='0') { my_setcookie('forum-widget-ENDERECO_DO_FORUM','1',0,0); jQuery('#forum-widget').css('background-position','0 -13px'); jQuery('#content-container div#content').css('margin-right','189px');} else { my_setcookie('forum-widget-ENDERECO_DO_FORUM','0',1,0); jQuery('#forum-widget').css('background-position','0 0px'); jQuery('#content-container div#content').css('margin-right','0px'); }"></div><script type="text/javascript"> jQuery('#forum-widget').insertBefore('#right'); if(my_getcookie('forum-widget-ENDERECO_DO_FORUM')=='0') {jQuery('#right').animate({width:'toggle',height:'toggle',opacity:'toggle'},0); jQuery('#forum-widget').css('background-position','0 0px'); jQuery('#content-container div#content').css('margin-right','0px');} </script>
Vermelho -> Cor do fundo do botão de contrair/expandir os widgets.
Verde -> Este nome deve ser único para que mais que um fórum não sejam afetados pelo mesmo sistema (por exemplo, se contrair o widget para este fórum tabém contrairá para outro), coloque algo do tipo forum-widget-ajudaforumeiroscom, evitando usar pontos, http... e coisas do gênero.
3º - Adicionar os novos widgets na estrutura:
Agora é necessário adicionar os widgets na estrutura do fórum. No ponto anterior chamamos os widgets de Widget número 1 e Widget número 2, mantenhamos este nome para sabermos o que deve ser feito. Deverá colocá-los na estrutura de forma que o 1 seja o primeiro da coluna e o 2 seja o último. Deverá ficar desta forma:
4º - Resultado final na forma de imagem:© Fórum dos FórunsSe tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Ocultar os widgets do fórum- Códigos para o widget na coluna da esquerda
Para a primeira dúvida, deverá adicionar o seguinte código CSS na Folha de estilos do seu fórum:
- Código:
#submenu {
top: 0;
left: 5px;
right: 5px;
position: absolute;
}
#logostrip {
margin-top: 25px;
}
Re: [Resolvido] [Resolvido] Logo, menu e coluna de widgets
Caros,
João, thks pela ajuda.
Solkis, 100% perfeito. Funciona que é uma beleza.
Desde já meus maiores agradecimentos e respeitos.
[]´s
Alexandre Magno
João, thks pela ajuda.
Solkis, 100% perfeito. Funciona que é uma beleza.
Desde já meus maiores agradecimentos e respeitos.
[]´s
Alexandre Magno
Tópicos semelhantes
» [RESOLVIDO]Menu igual widgets e categorias
» Adicionar coluna de Widgets em fórum
» Widgets em uma só coluna
» Altura da coluna de widgets
» [Resolvido]Parceiros - Widgets
» Adicionar coluna de Widgets em fórum
» Widgets em uma só coluna
» Altura da coluna de widgets
» [Resolvido]Parceiros - Widgets
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos