Gerir efeito degradê nos tópicos

Qual é minha questão:
Gostaria de saber como se põe assim este layout amarelo ou de outra cor no perfil dos staff.



Endereço do meu fórum:
http://revolutionsfc.forumportugues.com.pt

Versão do fórum:
PHPBB3

Boa noite cordial membro,

Este é o famoso efeito degradê:

<li> https://ajuda.forumeiros.com/t61132-

Até mais.

Eu não percebi bem o Tutorial.. pode-me explicar melhor?

Simples, Veja esse tutorial, siga direitinho que consegues.

Código:

http://ajuda.forumeiros.com/t61132-

Olá Cheseburger,

Eu fiz o tutorial citado pelo Lervisic e consegui direitinho mais siga abaixo o spoiler.

[TUTORIAL] Imagem nas postagens:

Cheseburger escreveu:Eu não percebi bem o Tutorial.. pode-me explicar melhor?

Cordial membro,

Onde o senhor teve dúvida?

Até mais.

Eu não precebi a parte do valor vermelho, do que por no "nomedorank" o comando do código .JS

No campo "Título do rank" deverá substituir por este código:

Código:

<span class="nomedorank">Título do rank</span>

O valor vermelho será o comando do código .JS - E o campo selecionado como verde será o título anterior do rank, por exemplo, "Administrador".

Alguem me pode dar já feito? O título do rank que quero é Administrador

Olá cordial membro!

É bem simples, veja bem:

Código:

<span class="nomedorank">Título do rank</span>

<li> Nome do Rank: Este será o mesmo valor que o senhor colocou no código JavaScript.
<li> Titulo do Rank: Será o titulo que irá aparecer nas postagens de teu fórum, ou seja Administrador, Moderador...etc.

Agora um exemplo se fosse aplicar este efeito no FdF:

<li> Código que iria no JavaScript com investimento em todas as paginas:

Código:

jQuery(document).ready(function(){
jQuery("div.post:has('Mod')").css('background','url(http://i.imgur.com/OsHYs.png) repeat-y top right')});

<li> Código que iria no Rank:

Código:

<span class="Mod">Moderador</span>

Compreendeu?

Até mais!

Desculpem o incomodo que vos estou a dar, mas vejam, eu tenho o codigo js, tenho o codigo no rank administrador, e como vêm não aparece o efeito.
<br><br><br><br>

Olá novamente!

Retire teu fórum de manutenção por gentileza.

Até mais.

Já retirei

Estranho... Tem mais de um código JavaScript em teu fórum? Se sim, tente apenas este do efeito degradê.

Não funcionou.

Olá!

Coloque o investimento Nos tópicos por gentileza.

Até mais.

Olá Cheseburger.

Siga os seguintes passos:

Painel de Controle Módulos HTML & JAVASCRIPT Gestão dos códigos Javascript:

Habilitar o gerenciamento dos códigos JavaScript :SIM
Talvez é esse o problema

Abraços, iChees.

Eu já tinha activado, não é esse o problema..

Cordial membro,

Vamos por outro método:

Aceda a: Painel de controleVisualização  Imagens e CoresCoresAba Folha CSS.

Código:

equipefundo{background-image:url(http://i.imgur.com/Rb9If.png);background-repeat:repeat-y}.post.equipefundoMods{background-image:url(http://i.imgur.com/OsHYs.png);background-repeat:repeat-y}.post.equipefundoArt{background-image:url(http://i.imgur.com/6QFgj.png);background-repeat:repeat-y}.post.equipefundoAju{background-image:url(http://i.imgur.com/XtFaN.png);background-repeat:repeat-y}.post.online.equipefundo{background-image:url(http://2img.net/i/fa/prosilver/icon_user_online_en.png),url(http://i.imgur.com/Rb9If.png);background-repeat:no-repeat,repeat-y}.post.online.equipefundoMods{background-image:url(http://2img.net/i/fa/prosilver/icon_user_online_en.png),url(http://i.imgur.com/OsHYs.png);background-repeat:no-repeat,repeat-y}.post.online.equipefundoArt{background-image:url(http://2img.net/i/fa/prosilver/icon_user_online_en.png),url(http://i.imgur.com/6QFgj.png);background-repeat:no-repeat,repeat-y}.post.online.equipefundoAju{background-image:url(http://2img.net/i/fa/prosilver/icon_user_online_en.png),url(http://i.imgur.com/XtFaN.png);background-repeat:no-repeat,repeat-y}

<li> Coloque o código acima no inicio de teu CSS.

Feito isto Crie um Novo Java Script ou edite a antigo adicionando este código no lugar, com o investimento marcado Nos tópicos, o código vai ser este:

jQuery(document).ready(function(){e=document.getElementsByTagName('span');for(i=0;i<e.length;i++){p=e.className;n=e.parentNode.previousSibling;if(p=='equipefundo'){n.parentNode.parentNode.parentNode.parentNode.className+=' equipefundo'}if(p=='equipefundoMods'){n.parentNode.parentNode.parentNode.parentNode.className+=' equipefundoMods'}if(p=='equipefundoArt'){n.parentNode.parentNode.parentNode.parentNode.className+=' equipefundoArt'}if(p=='equipefundoAju'){n.parentNode.parentNode.parentNode.parentNode.className+=' equipefundoAju'}}});

Depois aceda à Administração dos ranks, e clique no botão :editar:para edita-los, no nome coloque este código:

equipefundo">NOME DO RANK</span>

Veja que no código Java eu deixei em negrito as tags que serão os comandos, para dizer qual imagem vai ficar, então no Rank de administrador coloque este Equipefundo, no lugar do que esta marcado em vermelho no código do Rank, veja aqui os demais comandos.

<li> Onde adicionará estes comandos?
Aqui onde esta marcado em vermelho

<span class="equipefundo">NOME DO RANK</span>

Substitua o "equipefundo" pelo nome do comando que deseja para cada rank, entende?

Atenciosamente.

Olá!

O senhor esqueceu do "." antes do Administrador, por favor, adicione-o:

Até mais.

Crazy não funcionou, vou tentar o método do Sheldon.

Sheldon não precebi muito bem o seu tutorial, não podia por o código já feito para mim, se fizer favor?

Olá!

Troque o nome do rank por este:

Código:

<span class="nomedorank2">DIGITE_AQUI_O_NOME_DO_RANK</span>

Crie um novo JavaScript com este código:

Código:

jQuery(document).ready(function(){
jQuery(".post:has('.nomedorank2')").css('background','url(http://i.imgur.com/OsHYs.png) repeat-y top right');
});

Nos tópicos!

Até mais.

Funcionou! Obrigado crazy!