Sistema de votos estilo IPB

Nome do Arquivo: Sistema de votos estilo IPB
Autor: Daemon
Funcionalidade: Todas as versões
Categoria: Recursos BestSkins

Aqui iremos ensiná-los como aplicar um sistema de votos semelhante ao sistema da plataforma IPB.

Primeiro iremos até o painel de controle na gestão de códigos javascript, criando um novo javascript com investimento nos tópicos:
Código:


O código acima serve para a versão PunBB, para que o código funcione nas demais versões, localize esta parte:

Código:

$('.postfoot', vote.parentNode.parentNode.parentNode.parentNode).before( htmlFinal );

Troque por:

Código:

$('.postbody', vote.parentNode.parentNode.parentNode).append( htmlFinal );

Depois iremos na folha de css, ainda no painel de controle, e aplicaremos o seguinte código:

Código:

#rep_post {white-space: nowrap;margin: 6px 4px;float: right;}
#rep_post .bs_inline {list-style: none;}
#rep_post .bs_inline > li {display: inline-block;margin: 0 3px;}
#rep_post .bs_inline > li:first-child {margin-left: 0;}
#rep_post .bs_inline img {vertical-align: middle;}
#rep_post span img {cursor: pointer;}
#rep_post .reput_vote {
background-image: url('http://i.imgur.com/UGqTZqe.png');
background-repeat: repeat-x;
background-position: 0 1px;
font-size: 10px;
padding: 2px 10px !important;
color: #fff;
font-weight: bold;
display: inline-block;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
text-shadow: rgba(0,0,0,0.3) 0px -1px 0px;
}
.reput_vote.positive {background-color: #8db13e;}
.reput_vote.zero {background-color: #6a6a6a;}

Salve e veja o resultado.


Se tiver alguma dúvida em relação a este tutorial, crie um tópico de mesmo nome.

Ótimo tutorial daemon sempre com novidades obrigado

Mas esse código já não existia antes aqui na BS? 
De qualquer forma parece-me bem!

GyGu escreveu:Mas esse código já não existia antes aqui na BS? 
De qualquer forma parece-me bem!

Sim, porém este está mais "completo", digamos assim.

É que o já usado aqui na BS era só uma base do AvacWeb! esse aí é original do Daemon!

gracias . . .

Muito bom, parabéns!

Obrigado por compartilhar Daemon

Obrigao !

Obrigado! Estarei utilizando.

Até mais!

thank you for the code =)

Eu desejo

Comentando para ver

Muito bom

Parece que ficou legal :3

Ótimo código, obrigado pelo compartilhamento.

Obrigado por postar

[alerta=Atenção]Reputado com sucesso ![/alerta]

curti mt1111

Bãm de mais vou testar man..

Vamos ver kk

Código excelente Parabéns!!

testandooo