13 de jul. de 2012

Rank de Estrelas no Blog

Passando mais um tutorial, este eu considero bastante importante dependendo do tipo de blog/site você tenha, acho importantíssimo o leitor dar sua avaliação sobre o que achou do seu conteúdo além dos comentários! Vamos ao que interessa.



Obs: Este rank de estrelas não mostra o número de votos feitos, fiz isso para evitar um bug que ele continha.

1º Passo:
Vá em Design > Editar Html e cliquem em Expandir modelos de widgets.
Agora você escolhe onde por o Rank, segue a lista de opções:

(Abaixo do Título da Postagem) <div class="post-header-line post-header-line-1">CÓDIGO AQUI</div>

(No Fim da Postagem) <div class='post-footer'>CÓDIGO AQUI</div>

Dependendo de onde você escolheu por, copie e cole o código abaixo dentro onde tem: (CÓDIGO AQUI).

<div style="float:left; margin-right:3px;"></div>
<div class="js-kit-rating"
expr:path="data:post.url"
expr:permalink="data:post.url"
expr:title="data:post.title">
</div>


Exemplo:
<div class="post-header-line post-header-line-1">

<div style="float:left; margin-right:3px;"></div>
<div class="js-kit-rating"
expr:path="data:post.url"
expr:permalink="data:post.url"
expr:title="data:post.title">
</div>

</div>

2º Passo:
Feito isso procure por:
</body>

Logo acima coloque:
<script src='http://designonspace.comuf.com/string.js'></script>

3º Passo:
Caso queiram posicionar o rank de estrelas vocês podem usar este CSS, acima de:

]]></b:skin>
.js-kit-rating{ margin-left:??;margin-right:??;position:absolute;margin-top:??;margin-bottom:??;font-size:none;}
É isso pessoal, qualquer dúvida de vocês deixem um comentário.