Widgets organizados e personalizados no fórum

por Rockeirinho 25.09.11 15:54

Qual é minha questão:
Eu queria fazer/deixar uns widgets personalizados iguais a esse:
http://narutorpgfuture.forumeiros.com
, no meu fórum e se puder saebr também o tamanho da página dele [aquela que arruma no estrutura e hierarquia ou perto disso.

e ainda eu queria saber como criar uma área para colocar eventos e várias outras coisas assim iguais a esse fórum:

http://narutorpgakatsuki.com/forum

Endereço do meu fórum:
narutogxrpg.forumeiros.com

Versão do meu fórum:
PHPBB3

por Dury 26.09.11 1:03

Olá,

Painel de controle ->> Módulos ->> Portal e Widgets ->> Gestão dos widgets do fórum ->>
Clique no botão " Editar

" de um widget ou crie um, e no campo do código, cole o seguinte código:

Código:: <div> <table border="0" cellpadding="0" cellspacing="0" width="293" valign="top"> <tr name="table 1"><td name="table 1"> <div> <table border="0" cellpadding="3" cellspacing="3" width="170" valign="top"> <tr name="table 2"><td name="table 2"> <div> <table border="0" cellpadding="0" cellspacing="0" width="100%" style=" -moz-border-radius: 0px;"> <tr name="NRF"> <td height="83">&nbsp</td> <td rowspan=2 height="106" width="117" background="http://i66.servimg.com/u/f66/14/56/85/28/menunr14.png" style="-moz-border-radius: 0px; background-repeat: repeat-x;">&nbsp</td>  <td rowspan=2 height="106" background="http://i66.servimg.com/u/f66/14/56/85/28/menunr13.png" style="-moz-border-radius: 0px; background-repeat: repeat-x;">&nbsp</td> <td height="83">&nbsp</td> </tr><tr> <td width="21" height="23" background="http://i26.servimg.com/u/f26/14/56/85/28/menu_011.png" style="-moz-border-radius: 0px; background-repeat: no-repeat;">&nbsp</td> <td width="22" height="23" background="http://i26.servimg.com/u/f26/14/56/85/28/menu_012.png" style="-moz-border-radius: 0px; background-repeat: no-repeat;">&nbsp</td> </tr> <tr><td width="21" background="http://i66.servimg.com/u/f66/14/56/85/28/menu_015.png" style="-moz-border-radius: 0px; background-repeat: repeat-y;">&nbsp</td> <td colspan=2 name="conteudo NRF" style="background-color: #ffffff"> <div> <ul class="ulmenu" id="nav"> <li class="limenu">SEU_MENU_AQUI </ul> </div>  </td> <td width="21" background="http://i66.servimg.com/u/f66/14/56/85/28/menu_013.png" style="-moz-border-radius: 0px; background-repeat: repeat-y;">&nbsp</td></tr> <tr><td width="21" height="23" background="http://i26.servimg.com/u/f26/14/56/85/28/menu_015.png" style="-moz-border-radius: 0px; background-repeat: no-repeat;">&nbsp</td> <td colspan=2 height="23" background="http://i66.servimg.com/u/f66/14/56/85/28/menu_011.png" style="-moz-border-radius: 0px; background-repeat: repeat-x;">&nbsp</td> <td width="22" height="23" background="http://i26.servimg.com/u/f26/14/56/85/28/menu_017.png" style="-moz-border-radius: 0px; background-repeat: no-repeat;">&nbsp</td></tr></table> </div> </td></tr>

Já o outro código demorei um século só para achar...

Código:: <hjtml> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <body> <style ="css"> .thumbnail{position:relative;z-index:0}.thumbnail:hover{background-color:transparent;z-index:50}.thumbnail span{-moz-border-radius:10px;-webkit-border-radius:10px;background-image:url(http://img205.imageshack.us/img205/4733/1111010.png);border-bottom:2px solid grey;border-radius:10px;border-right:1px solid grey;left:-1000px;padding:10px;position:absolute;text-align:justify;text-decoration:none;visibility:hidden}.thumbnail:hover span{left:-140px;top:-90px;visibility:visible;width:135px}.p1{-moz-border-radius-bottomleft:50px;-moz-border-radius-bottomright:50px;-moz-box-shadow:0 0 5px #CFCFCF;-webkit-border-radius:0 0 50px 50px;-webkit-box-shadow:0 0 5px #CFCFCF;background-image:url(http://img205.imageshack.us/img205/4733/1111010.png);border-bottom:solid 3px #CFCFCF;border-left:solid 2px #CFCFCF;border-radius-bottomleft:50px;border-radius-bottomright:50px;border-right:solid 2px #CFCFCF;border-top:solid 2px #CFCFCF;box-shadow:0 0 5px #CFCFCF;color:#EFEFEF;font-size:19px;font-variant:small-caps;letter-spacing:2px;margin:4px 2px -5px;padding:4px 0 5px;text-align:center;text-shadow:1px 1px 1px #000}.p2{-moz-border-radius:20px;-moz-box-shadow:0 0 5px grey;-webkit-border-radius:20px;-webkit-box-shadow:0 0 5px grey;background-image:url(http://img51.imageshack.us/img51/3967/basefondp1.png);border-bottom:solid 5px #BACCD3;border-left:solid 3px #BACCD3;border-radius:20px;border-right:solid 3px #BACCD3;border-top:solid 5px #BACCD3;box-shadow:0 0 5px grey;margin-right:20px;padding:7px}.p3{border:dotted 2px #9F9F9F;margin:0 10px 0 0;padding:3px}.p4{-moz-border-radius:10px;background-image:url(http://img51.imageshack.us/img51/3967/basefondp1.png);border-bottom:2px solid #BFBFBF;border-left:1px solid #BFBFBF;border-radius:10px;margin:0 2px;padding:5px;text-align:justify} .p5{-moz-border-radius:10px;background-image:url(http://img51.imageshack.us/img51/3967/basefondp1.png);border-bottom:2px solid #BFBFBF;border-radius:10px;border-right:1px solid #BFBFBF;margin:0 2px;padding:10px;text-align:justify} .p6{-moz-border-radius:10px;background-image:url(http://img51.imageshack.us/img51/3967/basefondp1.png);border-bottom:2px solid #BFBFBF;border-left:1px solid #BFBFBF;border-radius:10px;border-right:1px solid #BFBFBF;margin:0 2px;padding:5px;text-align:justify}textarea.inputbox{background-color:#DFDFDF}.profilentour{-moz-border-radius:20px;-moz-box-shadow:0 0 5px #CFCFCF;-webkit-border-radius:20px;-webkit-box-shadow:0 0 5px #CFCFCF;background-image:url(http://img51.imageshack.us/img51/3967/basefondp1.png);border-bottom:solid 5px #BACCD3;border-left:solid 3px #BACCD3;border-radius:20px;border-right:solid 3px #BACCD3;border-top:solid 5px #BACCD3;box-shadow:0 0 5px #CFCFCF;margin:15px 3px -9px;padding:3px 7px 7px;text-align:center!important}.avatarentour{-moz-border-radius:4px;-moz-box-shadow:0 0 5px #707070;-webkit-border-radius:4px;-webkit-box-shadow:0 0 5px #707070;background-image:url(http://img217.imageshack.us/img217/9863/fondprofil.png);border-radius:4px;box-shadow:0 0 5px #707070;margin-bottom:7px;padding:5px}.profilentinfos{-moz-border-radius:20px;-moz-box-shadow:0 0 5px #CFCFCF;-webkit-border-radius:20px;-webkit-box-shadow:0 0 5px #CFCFCF;background-image:url(http://img51.imageshack.us/img51/3967/basefondp1.png);border-bottom:solid 5px #BACCD3;border-left:solid 3px #BACCD3;border-right:solid 3px #BACCD3;border-top:solid 5px #BACCD3;box-shadow:0 0 5px #CFCFCF;margin:0 3px;padding:8px 7px 10px;text-align:center} </style> <br><table style="text-align: left; margin-left: auto; margin-right: auto;"><tbody><tr><td><div style="margin-right: 20px;" class="p4"><div style="position: relative; bottom: 22px; text-shadow: 1px 1px 1px black; letter-spacing: 2px; text-align: center; width: 230px; margin-bottom: -17px; font-variant: small-caps; color:#4c1010;"><font size="5"><i>Anuncios;</i></font></div><div id="subnav"><a href="http://www.narutorpgakatsuki.com/f1-regras-gerais" title="Ler as regras">Regras</a></div><div id="subnav"><a href="#" title="Ler a historia">Historia</a></div> <div id="subnav" style="margin-bottom: 5px;"><a href="http://www.narutorpgakatsuki.com/f50-noticias" title="Ve as noticias do forum">Noticias</a></div></div></td> <td><div class="p5" style="width: 220px;"><div style="position: relative; bottom: 25px; text-align: center; text-shadow: 1px 1px 1px black; letter-spacing: 2px; margin-bottom: -22px; font-variant: small-caps; color:#4c1010;"><font size="5"><i>Eventos ;</i></font></div><div style="text-align: justify;"><font face="Verdana" size="1">/!\ [EVENTO]Video! <a href="http://www.narutorpgakatsuki.com/t16952-eventovideo#89888" >Clique Aqui.</a><br>/!\ [EVENTO]Divulgue! <a href="http://www.narutorpgakatsuki.com/t16982-eventodivulgue#90097" >Clique Aqui.</a></font></div></div></td></tr></tbody></table> </body></html>

¬¬ Desculpe a demora amigo. Piscada

por Rockeirinho 26.09.11 1:12

O primeiro code desconfigurou toda a pagina deixando tudo do lado esquerdo , bem expremido como um widget .

E o segundo , ao invez de ficar no topo lá igual ao fórum que eu passei , ficou espremido do lado também como um widget .

Me desculpe por eu estar encomodando tanto a vocês .

por Dury 26.09.11 1:15

Á, que isso meu amigo... "Eu ficaria emcomodado se você não explicasse sua questão".

Então, poderia adicionar uma imagem para que eu possa ver? É que eu apliquei em páginas HTML e na Home Page os códigos, ao não ser o do naruto pgfuture.

por Rockeirinho 26.09.11 1:24

aaah consegui o código daquelas coisas de eventos e tals , mas está aparecendo o link do fórum que vc tirou o negócio , que no caso é o naruto rpg akatsuki , teria como colocar o link de outro fórum ? se puder assinalar onde eu coloco !

Editade: Não consegui , apenas no pré-visualiado que funcionou , quando eu clico em confirmar e atualizo a pagina do meu fórum , dá não aparece nada .

E assim fica o fórum

https://2img.net/r/ihimizer/img694/2405/0erro.png

https://2img.net/r/ihimizer/img694/3772/0doubleerro.jpg

por Rockeirinho 27.09.11 1:34

Up's .

Erro sobre o 2º código : Creio que eu não estou sabendo colocar , porque pelo que me parece está criando outra pagina , ao invez de aparecer na página principal .

Erro sobre o código 2º é o fórum todo estar na largura e widget .

por Luciano98 29.09.11 23:21

Olá!

Painel de controle Módulos Portal e Widgets Gestão dos widgets do fórum
Clique em "Criar um Widget personalizado".
O nome e o título do Widget você escolhe.
Em "Utilizar um table type :" selecione "Não".

Na "Fonte do widget" coloque esse codigo:

Código:: <div> <table border="0" cellpadding="0" cellspacing="0" height="190" width="165"" style=" -moz-border-radius: 0px;"> <tbody><tr> <td width="21" height="30" background="http://i26.servimg.com/u/f26/14/56/85/28/cxggff10.png" style="-moz-border-radius: 0px; background-repeat: no-repeat;"> </td> <td height="30" width="117" background="http://i66.servimg.com/u/f66/14/56/85/28/votaaa10.png" style="-moz-border-radius: 0px; background-repeat: repeat-x;"> </td> <td height="30" background="http://i66.servimg.com/u/f66/14/56/85/28/menu_014.png" style="-moz-border-radius: 0px; background-repeat: repeat-x;"> </td> <td width="22" height="30" background="http://i26.servimg.com/u/f26/14/56/85/28/rgrg10.png" style="-moz-border-radius: 0px; background-repeat: no-repeat;"> </td></tr> <tr><td width="21" background="http://i66.servimg.com/u/f66/14/56/85/28/menu_012.png" style="-moz-border-radius: 0px; background-repeat: repeat-y;"> </td> <td colspan="2" style="background-color: #ffffff">CONTEUDO</td> <td width="21" background="http://i26.servimg.com/u/f26/14/56/85/28/menu_014.png" style="-moz-border-radius: 0px; background-repeat: repeat-y;"> </td></tr> <tr><td width="21" height="23" background="http://i26.servimg.com/u/f26/14/56/85/28/menu_015.png" style="-moz-border-radius: 0px; background-repeat: no-repeat;"> </td> <td colspan="2" height="23" background="http://i26.servimg.com/u/f26/14/56/85/28/menu_016.png" style="-moz-border-radius: 0px; background-repeat: repeat-x;"> </td> <td width="22" height="23" background="http://i26.servimg.com/u/f26/14/56/85/28/menu_017.png" style="-moz-border-radius: 0px; background-repeat: no-repeat;"> </td></tr></tbody></table> </div>

CONTEUDO = Conteúdo que estará dentro do Widget, nada fora disso pode ser modificado.

Até mais.

Widgets organizados e personalizados no fórum

Widgets organizados e personalizados no fórum

Re: Widgets organizados e personalizados no fórum

Re: Widgets organizados e personalizados no fórum

Re: Widgets organizados e personalizados no fórum

Re: Widgets organizados e personalizados no fórum

Re: Widgets organizados e personalizados no fórum

Re: Widgets organizados e personalizados no fórum