Personalizar botão de reputar

Detalhes da questão

Endereço do fórum: http://heavenlands.forumeiros.com/
Versão do fórum: PunBB

Descrição

Olá. Tenho este sistema no meu fórum: https://i.imgur.com/63LsD2E.png (REPUTAÇÃO)
Gostaria de deixá-lo e colocar este sistema: https://i.imgur.com/rHfcjUz.png Como o que existe aqui na Forumeiros. (Fundo verde com um Coração Branco + o valor, no canto superior direito das postagens)
Único tópico que achei aqui foi este, porém o cara não disse o que modificou no ViewTopic...
https://ajuda.forumeiros.com/t104118-reputacao-ips-ipb
Meu viewtopic_body

Código:

<script type="text/javascript">//<![CDATA[
var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}', _atr = '{JS_DIR}addthis/', _ati = '{PATH_IMG_FA}addthis/'{ADDTHIS_LANG}, addthis_localize = { share_caption: "{L_SHARE_CAPTION}", email: "{L_EMAIL}", email_caption: "{L_EMAIL_CAPTION}", favorites: "{L_SHARE_BOOKMARKS}", print: "{L_PRINT}", more: "{L_MORE}" };
$(function(){

    if(typeof(_atc) == "undefined") {
        _atc = { };
    }

    _atc.cwait = 0;
    $('.addthis_button').mouseup(function(){
        if ($('#at15s').css('display') == 'block') {
            addthis_close();
        }
    });
});

var hiddenMsgLabel = { visible:'{JS_HIDE_HIDDEN_MESSAGE}', hidden:'{JS_SHOW_HIDDEN_MESSAGE}' };
showHiddenMessage = function(id)
{
    try
    {
        var regId = parseInt(id, 10);
        if( isNaN(regId) ) { regId = 0; }
       
        if( regId > 0)
        {
            $('.post--' + id).toggle(0, function()
        {
            if( $(this).is(":visible") )
            {
              $('#hidden-title--' + id).html(hiddenMsgLabel.visible);
            }
            else
            {
              $('#hidden-title--' + id).html(hiddenMsgLabel.hidden);
            }
        });
        }
    }
    catch(e) { }
   
  return false;
};

//]]>
</script>

<!-- BEGIN switch_user_logged_in -->
<div id="pun-visit" class="clearfix">
  <ul>
      <!-- BEGIN switch_plus_menu -->
      <li>
        <script type="text/javascript">//<![CDATA[
            var url_favourite = '{switch_user_logged_in.U_FAVOURITE_JS_PLUS_MENU}';
            var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
            var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
            var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
            var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
            var url_tellfriend = '{U_TELLFRIEND_JS_PLUS_MENU}';
            insert_plus_menu_new('f{FORUM_ID}&amp;t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
        //]]>
        </script>
      </li>
      <!-- END switch_plus_menu -->
      <li><a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&amp;pub=forumotion">{L_SHARE}</a></li>
      <li><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a></li>
      <li><a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></li>
      <!-- BEGIN watchtopic -->
      <li>{S_WATCH_TOPIC}</li>
      <!-- END watchtopic -->
  </ul>
  <p>{LOGGED_AS}. {LAST_VISIT_DATE}</p>
</div>
<!-- END switch_user_logged_in -->
<!-- BEGIN switch_user_logged_out -->
<div id="pun-visit">
  <p>{L_NOT_CONNECTED} {L_LOGIN_REGISTER}</p>
</div>
<!-- END switch_user_logged_out -->

<div class="pun-crumbs noprint clearfix">
  <span class="crumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a href="{U_INDEX}" itemprop="url"><span itemprop="title">{L_INDEX}</span></a>{NAV_CAT_DESC}&nbsp;»&nbsp;
      <strong><a href="{TOPIC_URL}" itemprop="url"><span itemprop="title">{TOPIC_TITLE}</span></a></strong>
    </span>
    <div class="right">
        <!-- BEGIN switch_twitter_btn -->
        <span>
            <a href="https://twitter.com/share" class="twitter-share-button" data-via="{TWITTER}">Tweet</a>
            <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
        </span>
        <!-- END switch_twitter_btn -->
      <!-- BEGIN switch_fb_likebtn -->
      <script>(function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/{LANGUAGE}/all.js#xfbml=1";
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));</script> 
      <span class="fb-like" data-href="{FORUM_URL}{TOPIC_URL}" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></span>
      <!-- END switch_fb_likebtn -->
    </div>
</div>

<div class="main paged">
  <div class="paged-head clearfix">
            <h1>{TOPIC_TITLE}</h1>
      <!-- BEGIN topicpagination -->
      <p class="paging">{PAGINATION}</p>
      <!-- END topicpagination -->
      <p class="posting">
        <!-- BEGIN switch_user_authpost -->
        <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a>&nbsp;&nbsp;
        <!-- END switch_user_authpost -->

        <!-- BEGIN switch_user_authreply -->
        <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a>
        <!-- END switch_user_authreply -->
      </p>
  </div>
  {POLL_DISPLAY}
  <div class="main-head clearfix">
      <p class="h2">
        <a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a>&nbsp;<a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a>&nbsp;<a href="#bottom">{L_GOTO_DOWN}</a>&nbsp;&nbsp;
        {L_MESSAGE} [{PAGE_NUMBER}]
      </p>
  </div>

  <div class="main-content topic">
      <!-- BEGIN postrow -->
        <!-- BEGIN hidden -->
            <p class="p-hidden">{postrow.hidden.MESSAGE}</p>
        <!-- END hidden -->
       
        <!-- BEGIN displayed -->
       
        <div class="post post--{postrow.displayed.U_POST_ID}"{postrow.displayed.THANK_BGCOLOR} style="{postrow.displayed.DISPLAYABLE_STATE}">
            <a name="{postrow.displayed.U_POST_ID}" style="position: relative; top: -20px; width: 1px;" id="{postrow.displayed.U_POST_ID}"></a>
            <div class="postmain"{postrow.displayed.THANK_BGCOLOR}>
              <div id="p{postrow.displayed.U_POST_ID}" class="posthead"{postrow.displayed.THANK_BGCOLOR}>
                  <h2>
                    <strong>{postrow.displayed.COUNT_POSTS}</strong>
                    {postrow.displayed.POST_DATE_NEW}
                  </h2>
              </div>

              <div class="postbody"{postrow.displayed.THANK_BGCOLOR}>
                  <div class="user">
                    <div class="user-ident">
                        <h4 class="username">{postrow.displayed.POSTER_NAME}</h4>
                        <div class="user-basic-info">
                          {postrow.displayed.POSTER_AVATAR}<br />
                          {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
                        </div>
                    </div>
                    <div class="user-info">
                        {postrow.displayed.ONLINE_IMG}
                        <!-- BEGIN profile_field -->
                        <span class="post_field">{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}</span>
                        <!-- END profile_field -->
                        {postrow.displayed.POSTER_RPG}
                    </div>
                  </div>

                  <div class="post-entry">
                    <div class="entry-content">
                        <!-- BEGIN switch_vote_active -->
                        <div class="vote gensmall">
                          <!-- BEGIN switch_vote -->
                          <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}"><img src="http://i.imgur.com/Xy0XH1b.png"></a></div>
                          <!-- END switch_vote -->

                          <!-- BEGIN switch_bar -->
                          <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
                              <!-- BEGIN switch_vote_plus -->
                              <div class="vote-bar-plus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
                              <!-- END switch_vote_plus -->

                              <!-- BEGIN switch_vote_minus -->
                              <div class="vote-bar-minus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
                              <!-- END switch_vote_minus -->
                          </div>
                          <!-- END switch_bar -->

                          <!-- BEGIN switch_no_bar -->
                          <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar">----</div>
                          <!-- END switch_no_bar -->

                          <!-- BEGIN switch_vote -->
                       
                          <!-- END switch_vote -->
                        </div>
                        <!-- END switch_vote_active -->
                        <div>
                          <div>{postrow.displayed.MESSAGE}</div>
                          <!-- BEGIN switch_attachments -->
                          <dl class="attachbox">
                              <dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt>
                              <dd>
                                <!-- BEGIN switch_post_attachments -->
                                <dl class="file">
                                    <dt>
                                      <img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" alt="" />

                                      <!-- BEGIN switch_dl_att -->
                                      <a class="postlink" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}
                                      <!-- END switch_dl_att -->

                                      <!-- BEGIN switch_no_dl_att -->
                                      {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}
                                      <!-- END switch_no_dl_att -->
                                    </dt>

                                    <!-- BEGIN switch_no_comment -->
                                    <dd>
                                      <em>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em>
                                    </dd>
                                    <!-- END switch_no_comment -->

                                    <!-- BEGIN switch_no_dl_att -->
                                    <dd>
                                      <em><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></em>
                                    </dd>
                                    <!-- END switch_no_dl_att -->

                                    <dd>({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</dd>
                                </dl>
                                <!-- END switch_post_attachments -->
                              </dd>
                          </dl>
                          <!-- END switch_attachments -->
                          <div class="clear"></div>
                        </div>
                        <p>
                          {postrow.displayed.EDITED_MESSAGE}
                        </p>
                    </div>
                  </div>
              </div>

              <!-- BEGIN switch_signature -->
              <div class="sig-content">
                  {postrow.displayed.SIGNATURE_NEW}
              </div>
              <!-- END switch_signature -->

              <div class="postfoot">
                  <div class="user-contact profile_{postrow.displayed.PROFILE_POSITION}">
                    {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field -->
                  </div>
                  <div class="post-options profile_{postrow.displayed.PROFILE_POSITION}">
                    {postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG}
                  </div>
                  <div style="clear:both;"></div>
              </div>
            </div>
        </div>
        <!-- BEGIN first_post_br -->
        </div>
        <hr id="first-post-br" />
        <div class="main-content topic">
        <!-- END first_post_br -->
        <!-- END displayed -->
      <!-- END postrow -->
  </div>

  <div class="main-foot clearfix">
      <p class="h2">
        <a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a>&nbsp;<a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a>&nbsp;<a href="#top">{L_BACK_TO_TOP}</a>&nbsp;&nbsp;
        {L_MESSAGE} [{PAGE_NUMBER}]
      </p>
      <p class="options">
        <input type="hidden" name="t" value="{TOPIC_ID}" />

        <!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
        <input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />

        <!-- BEGIN viewtopic_bottom -->
        {S_TOPIC_ADMIN}
        <!-- END viewtopic_bottom -->
      </p>
  </div>

  <a name="bottomtitle"></a>

  <div class="paged-foot clearfix">
      <!-- BEGIN topicpagination -->
      <p class="paging">{PAGINATION}</p>
      <!-- END topicpagination -->
      <p class="posting">
        <!-- BEGIN switch_user_authpost -->
        <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a>&nbsp;&nbsp;
        <!-- END switch_user_authpost -->

        <!-- BEGIN switch_user_authreply -->
        <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a>
        <!-- END switch_user_authreply -->
      </p>
  </div>

</div>

<div class="pun-crumbs">
  <p class="crumbs">
      <a href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}&nbsp;»&nbsp;
      <strong><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></strong>
  </p>
</div>

<!-- BEGIN promot_trafic -->
<div class="main" id="ptrafic_close" style="display:none">
  <div class="main-head clearfix">
      <p class="h2">{PROMOT_TRAFIC_TITLE}</p>
      <p class="options"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_MORE_IMG}" alt="+" align="" border="0" /></a></p>
  </div>
</div>
<div class="main" id="ptrafic_open" style="display:''">
  <div class="main-head clearfix">
      <p class="h2">{PROMOT_TRAFIC_TITLE}</p>
      <p class="options"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_LESS_IMG}" alt="-" align="" border="0" /></a></p>
  </div>
  <div class="main-content clearfix">
      <!-- BEGIN link -->
      »&nbsp;<a href="{promot_trafic.link.U_HREF}" target="_blank" title="{promot_trafic.link.TITLE}" rel="nofollow">{promot_trafic.link.TITLE}</a><br />
      <!-- END link -->
  </div>
</div>
<!-- END promot_trafic -->

<!-- BEGIN switch_forum_rules -->
<div class="main" id="forum_rules">
  <div class="main-head clearfix">
      <p class="h2">{L_FORUM_RULES}</p>
  </div>
  <table class="main-content frm">
      <tr>
        <!-- BEGIN switch_forum_rule_image -->
        <td class="logo">
            <img src="{RULE_IMG_URL}" alt="" />
        </td>
        <!-- END switch_forum_rule_image -->
        <td class="rules entry-content">
            {RULE_MSG}
        </td>
      </tr>
  </table>
</div>
<!-- END switch_forum_rules -->

<!-- BEGIN switch_user_logged_in -->
<a name="quickreply"></a>
{QUICK_REPLY_FORM}
<!-- END switch_user_logged_in -->

<div id="pun-info" class="main">
  <div class="main-content">
      <div id="stats">
        <p>{L_TABS_PERMISSIONS} <br />{S_AUTH_LIST}</p>
      </div>
  </div>
</div>

<!-- BEGIN switch_image_resize -->
<script type="text/javascript">
//<![CDATA[
$(resize_images({ 'selector' : '.post-entry .entry-content', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
//]]>
</script>
<!-- END switch_image_resize -->

<!-- <script src="{JS_DIR}addthis/addthis_widget_bak002.js" type="text/javascript"></script> -->
<!-- <script src="{JS_DIR}addthis/addthis_widget.js" type="text/javascript"></script> -->
<!-- --><script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=forumotion" async></script><!-- -->

Olá amigo! não é necessário de modificações no template.
O hancki fez isto, por que optou '-'

Crie um novo javascript com investimento nos topicos com esse código:

Código:

$(function() {
    var campoRep = $('.post_field:contains("Reputação")');
    campoRep.css('color', '#5F7A47').css('font-size', '13px').css('font-weight', '700');
    campoRep.find('span.label').css('font-size', '0px');
    $('.post_field:contains("Reputação")').html(function(_, html) {
        var imagem = '<img src="http://i.imgur.com/SUwscZI.png" style="margin-top:-9px;padding-right:2px;"/>';
        return html.replace(/Reputação/g, imagem)
    });
});

Observação: Retire o javascript do seu "reputação" atual, para não dar conflito.

Atenciosamente,
While.

Mas eu quero deixar o sistema atual, se eu fizer isso e deletar o outro, somente https://i.imgur.com/rHfcjUz.png este sistema irá funcionar...

Aaah você quer que esse seja o botão curtir nos posts?

Desculpe, não havia entendido, fico no aguardo pra ver se é isto mesmo.

Atenciosamente,
While.

Eu já tenho o botão de curtir no meu fórum, eu quero que ele apenas exiba a quantidade de CURTIDAS que esta postagem já recebeu, como nesta imagem: https://i.imgur.com/rHfcjUz.png
Print do meu fórum: https://i.imgur.com/IuGqoXR.png

Boas.

Leia este tutorial, deve sanar a sua questão:
https://ajuda.forumeiros.com/t100407-

Abraços.
Fraise

O efeito não foi como eu queria.
Apenas fez uma barra verde quando dou Curtir no post de alguém. Gostaria que informasse a quantidade de pessoas que deram Curtir sem ter que passar o cursor em cima, igual aqui no Forumeiros.

Olá , troque seu javascripts de reputar, por este:

Código:

document.write('<style>.fa_vote,.fa_voted,.fa_count{font-size:12px;font-family:Verdana,Arial,Helvetica,Sans-serif;display:inline-block!important;width:auto!important;transition:300ms}.fa_voted,.fa_vote:hover{opacity:0.4}.fa_voted{cursor:default}.fa_count{font-weight:bold;margin:0 3px;cursor:default}.fa_positive{color:#4A0}.fa_negative{color:#A44}.fa_votebar,.fa_votebar_inner{background:#C44;height:3px}.fa_votebar_inner{background:#4A0;transition:300ms}</style>');$(function(){var config={position_left:true,negative_vote:false,vote_bar:false,icon_plus:'<img src="http://i.imgur.com/SUwscZI.png" alt="+" style="vertical-align:text-bottom;"/>',icon_minus:'<img src="http://i18.servimg.com/u/f18/18/21/41/30/minus10.png" alt="-"/>',title_plus:'Curtir post do %{USERNAME}\'s',title_minus:'Não Curti o post do %{USERNAME}\'s',title_like_singular:'%{VOTES} pessoa gostou do post do%{USERNAME}\'s',title_like_plural:'%{VOTES} pessoas gostaram do post do %{USERNAME}\'s ',title_dislike_singular:'%{VOTES} pessoa deu deslike no post do %{USERNAME}\'s',title_dislike_plural:'%{VOTES} pessoas gostaram do post do %{USERNAME}\'s',title_vote_bar:'%{VOTES} pessoas gostaram do post do %{USERNAME}\'s %{PERCENT}'},submit_vote=function(){var next=this.nextSibling,box=this.parentNode,bar=box.getElementsByTagName('DIV'),vote=box.getElementsByTagName('A'),mode=/eval=plus/.test(this.href)?1:0,i=0,j=vote.length,pos,neg,percent;$.get(this.href,function(){next.innerHTML=+next.innerHTML+1;next.title=next.title.replace(/(\d+)/,function(M,$1){return+$1+1});pos=+vote[0].nextSibling.innerHTML;neg=vote[1]?+vote[1].nextSibling.innerHTML:0;percent=pos==0?'0%':pos==neg?'50%':Math.round(pos/(pos+neg)*100)+'%';if(bar[0]){bar[0].style.display='';bar[0].firstChild.style.width=percent;box.title=box.title.replace(/\d+\/\d+/,pos+'/'+(pos+neg)).replace(/\(\d+%\)/,'('+percent+')')}});for(;i<j;i++){vote[i].href='#';vote[i].className=vote[i].className.replace(/fa_vote/,'fa_voted');vote[i].onclick=function(){return false}}return false},vote=$('.vote'),i=0,j=vote.length,version=$('.bodylinewidth')[0]?0:document.getElementById('wrap')?1:$('.pun')[0]?2:document.getElementById('ipbwrapper')?3:'badapple',vdata={tag:['SPAN','LI','SPAN','LI'][version],name:['.name','.postprofile dt > strong','.username','.popmenubutton'][version],actions:['.post-options','.profile-icons','.post-options','.posting-icons'][version],},post,plus,minus,n_pos,n_neg,title_pos,title_neg,li,ul,bar,button,total,percent,span,pseudo,vote_bar;if(version=='badapple'){if(window.console)console.warn('Este plugin não é otimizado na sua versão do fórum, favor pedir suporte no bestweb.');return}for(;i<j;i++){post=$(vote[i]).parentsUntil('.post').parent()[0];bar=$('.vote-bar',vote[i])[0];button=$('.vote-button',vote[i]);pseudo=$(vdata.name,post).text()||'MISSING_STRING';ul=$(vdata.actions,post)[0];li=document.createElement(vdata.tag);li.className='fa_reputation';if(li.tagName=='SPAN')li.style.display='inline-block';if(bar){total=+bar.title.replace(/.*?\((\d+).*/,'$1');percent=+bar.title.replace(/.*?(\d+)%.*/,'$1');n_pos=Math.round(total*(percent/100));n_neg=total-n_pos}else{n_pos=0;n_neg=0}title_pos=(n_pos==1?config.title_like_singular:config.title_like_plural).replace(/%\{USERNAME\}/g,pseudo).replace(/%\{VOTES\}/g,n_pos);title_neg=(n_neg==1?config.title_dislike_singular:config.title_dislike_plural).replace(/%\{USERNAME\}/g,pseudo).replace(/%\{VOTES\}/g,n_neg);li.innerHTML='<span class="fa_count fa_positive" title="'+title_pos+'">'+n_pos+'</span>'+(config.negative_vote?' <span class="fa_count fa_negative" title="'+title_neg+'">'+n_neg+'</span>':'');span=li.getElementsByTagName('SPAN');plus=document.createElement('A');plus.href=button[0]?button[0].firstChild.href:'#';plus.onclick=button[0]?submit_vote:function(){return false};plus.className='fa_vote'+(button[0]?'':'d')+' fa_plus';plus.innerHTML=config.icon_plus;plus.title=(button[0]?config.title_plus:title_pos).replace(/%\{USERNAME\}/g,pseudo);span[0]&&li.insertBefore(plus,span[0]);if(config.negative_vote){minus=document.createElement('A');minus.href=button[1]?button[1].firstChild.href:'#';minus.onclick=button[1]?submit_vote:function(){return false};minus.className='fa_vote'+(button[1]?'':'d')+' fa_minus';minus.innerHTML=config.icon_minus;minus.title=(button[1]?config.title_minus:title_neg).replace(/%\{USERNAME\}/g,pseudo);span[1]&&li.insertBefore(minus,span[1])}if(config.vote_bar){vote_bar=document.createElement('DIV');vote_bar.className='fa_votebar';vote_bar.innerHTML='<div class="fa_votebar_inner" style="width:'+percent+'%;"></div>';vote_bar.style.display=bar?'':'none';li.title=config.title_vote_bar.replace(/%\{USERNAME\}/,pseudo).replace(/%\{VOTES\}/,n_pos+'/'+(n_pos+n_neg)).replace(/%\{PERCENT\}/,'('+percent+'%)');li.appendChild(vote_bar)}config.position_left?ul.insertBefore(li,ul.firstChild):ul.appendChild(li);vote[i].parentNode.removeChild(vote[i])}});

É do mesmo estilo a do fdf, porém com a imagem que o senhor pediu.
Veja:



Atenciosamente,
While.

Ufa, funcionou. Eu sei que estou abusando demais, mas não seria possível colocar o número de curtidas pra esquerda? Código:

Código:

document.write('<style>.fa_vote,.fa_voted,.fa_count{font-size:12px;font-family:Verdana,Arial,Helvetica,Sans-serif;display:inline-block!important;width:auto!important;transition:300ms}.fa_voted,.fa_vote:hover{opacity:0.4}.fa_voted{cursor:default}.fa_count{font-weight:bold;margin:0 3px;cursor:default}.fa_positive{color:#000000}.fa_negative{color:#A44}.fa_votebar,.fa_votebar_inner{background:#C44;height:3px}.fa_votebar_inner{background:#000000;transition:300ms}</style>');$(function(){var config={position_left:true,negative_vote:false,vote_bar:false,icon_plus:'<img src="http://i.imgur.com/8U2XG7U.png" alt="+" style="vertical-align:text-bottom;"/>',icon_minus:'<img src="http://i18.servimg.com/u/f18/18/21/41/30/minus10.png" alt="-"/>',title_plus:'Curtir post do %{USERNAME}\'s',title_minus:'Não Curti o post do %{USERNAME}\'s',title_like_singular:'%{VOTES} pessoa gostou do post do%{USERNAME}\'s',title_like_plural:'%{VOTES} pessoas gostaram do post do %{USERNAME}\'s ',title_dislike_singular:'%{VOTES} pessoa deu deslike no post do %{USERNAME}\'s',title_dislike_plural:'%{VOTES} pessoas gostaram do post do %{USERNAME}\'s',title_vote_bar:'%{VOTES} pessoas gostaram do post do %{USERNAME}\'s %{PERCENT}'},submit_vote=function(){var next=this.nextSibling,box=this.parentNode,bar=box.getElementsByTagName('DIV'),vote=box.getElementsByTagName('A'),mode=/eval=plus/.test(this.href)?1:0,i=0,j=vote.length,pos,neg,percent;$.get(this.href,function(){next.innerHTML=+next.innerHTML+1;next.title=next.title.replace(/(\d+)/,function(M,$1){return+$1+1});pos=+vote[0].nextSibling.innerHTML;neg=vote[1]?+vote[1].nextSibling.innerHTML:0;percent=pos==0?'0%':pos==neg?'50%':Math.round(pos/(pos+neg)*100)+'%';if(bar[0]){bar[0].style.display='';bar[0].firstChild.style.width=percent;box.title=box.title.replace(/\d+\/\d+/,pos+'/'+(pos+neg)).replace(/\(\d+%\)/,'('+percent+')')}});for(;i<j;i++){vote[i].href='#';vote[i].className=vote[i].className.replace(/fa_vote/,'fa_voted');vote[i].onclick=function(){return false}}return false},vote=$('.vote'),i=0,j=vote.length,version=$('.bodylinewidth')[0]?0:document.getElementById('wrap')?1:$('.pun')[0]?2:document.getElementById('ipbwrapper')?3:'badapple',vdata={tag:['SPAN','LI','SPAN','LI'][version],name:['.name','.postprofile dt > strong','.username','.popmenubutton'][version],actions:['.post-options','.profile-icons','.post-options','.posting-icons'][version],},post,plus,minus,n_pos,n_neg,title_pos,title_neg,li,ul,bar,button,total,percent,span,pseudo,vote_bar;if(version=='badapple'){if(window.console)console.warn('Este plugin não é otimizado na sua versão do fórum, favor pedir suporte no bestweb.');return}for(;i<j;i++){post=$(vote[i]).parentsUntil('.post').parent()[0];bar=$('.vote-bar',vote[i])[0];button=$('.vote-button',vote[i]);pseudo=$(vdata.name,post).text()||'MISSING_STRING';ul=$(vdata.actions,post)[0];li=document.createElement(vdata.tag);li.className='fa_reputation';if(li.tagName=='SPAN')li.style.display='inline-block';if(bar){total=+bar.title.replace(/.*?\((\d+).*/,'$1');percent=+bar.title.replace(/.*?(\d+)%.*/,'$1');n_pos=Math.round(total*(percent/100));n_neg=total-n_pos}else{n_pos=0;n_neg=0}title_pos=(n_pos==1?config.title_like_singular:config.title_like_plural).replace(/%\{USERNAME\}/g,pseudo).replace(/%\{VOTES\}/g,n_pos);title_neg=(n_neg==1?config.title_dislike_singular:config.title_dislike_plural).replace(/%\{USERNAME\}/g,pseudo).replace(/%\{VOTES\}/g,n_neg);li.innerHTML='<span class="fa_count fa_positive" title="'+title_pos+'">'+n_pos+'</span>'+(config.negative_vote?' <span class="fa_count fa_negative" title="'+title_neg+'">'+n_neg+'</span>':'');span=li.getElementsByTagName('SPAN');plus=document.createElement('A');plus.href=button[0]?button[0].firstChild.href:'#';plus.onclick=button[0]?submit_vote:function(){return false};plus.className='fa_vote'+(button[0]?'':'d')+' fa_plus';plus.innerHTML=config.icon_plus;plus.title=(button[0]?config.title_plus:title_pos).replace(/%\{USERNAME\}/g,pseudo);span[0]&&li.insertBefore(plus,span[0]);if(config.negative_vote){minus=document.createElement('A');minus.href=button[1]?button[1].firstChild.href:'#';minus.onclick=button[1]?submit_vote:function(){return false};minus.className='fa_vote'+(button[1]?'':'d')+' fa_minus';minus.innerHTML=config.icon_minus;minus.title=(button[1]?config.title_minus:title_neg).replace(/%\{USERNAME\}/g,pseudo);span[1]&&li.insertBefore(minus,span[1])}if(config.vote_bar){vote_bar=document.createElement('DIV');vote_bar.className='fa_votebar';vote_bar.innerHTML='<div class="fa_votebar_inner" style="width:'+percent+'%;"></div>';vote_bar.style.display=bar?'':'none';li.title=config.title_vote_bar.replace(/%\{USERNAME\}/,pseudo).replace(/%\{VOTES\}/,n_pos+'/'+(n_pos+n_neg)).replace(/%\{PERCENT\}/,'('+percent+'%)');li.appendChild(vote_bar)}config.position_left?ul.insertBefore(li,ul.firstChild):ul.appendChild(li);vote[i].parentNode.removeChild(vote[i])}});

Não sei se entendi... seria assim?


Se sim... troque o script pra este:

Código:

document.write('<style>a.fa_vote.fa_plus, a.fa_voted.fa_plus {float:right!important;}.fa_vote,.fa_voted,.fa_count{font-size:12px;font-family:Verdana,Arial,Helvetica,Sans-serif;display:inline-block!important;width:auto!important;transition:300ms}.fa_voted,.fa_vote:hover{opacity:0.4}.fa_voted{cursor:default}.fa_count{font-weight:bold;margin:0 3px;cursor:default}.fa_positive{color:#000000}.fa_negative{color:#A44}.fa_votebar,.fa_votebar_inner{background:#C44;height:3px}.fa_votebar_inner{background:#000000;transition:300ms}</style>');$(function(){var config={position_left:true,negative_vote:false,vote_bar:false,icon_plus:'<img src="http://i.imgur.com/8U2XG7U.png" alt="+" style="vertical-align:text-bottom;"/>',icon_minus:'<img src="http://i18.servimg.com/u/f18/18/21/41/30/minus10.png" alt="-"/>',title_plus:'Curtir post do %{USERNAME}\'s',title_minus:'Não Curti o post do %{USERNAME}\'s',title_like_singular:'%{VOTES} pessoa gostou do post do%{USERNAME}\'s',title_like_plural:'%{VOTES} pessoas gostaram do post do %{USERNAME}\'s ',title_dislike_singular:'%{VOTES} pessoa deu deslike no post do %{USERNAME}\'s',title_dislike_plural:'%{VOTES} pessoas gostaram do post do %{USERNAME}\'s',title_vote_bar:'%{VOTES} pessoas gostaram do post do %{USERNAME}\'s %{PERCENT}'},submit_vote=function(){var next=this.nextSibling,box=this.parentNode,bar=box.getElementsByTagName('DIV'),vote=box.getElementsByTagName('A'),mode=/eval=plus/.test(this.href)?1:0,i=0,j=vote.length,pos,neg,percent;$.get(this.href,function(){next.innerHTML=+next.innerHTML+1;next.title=next.title.replace(/(\d+)/,function(M,$1){return+$1+1});pos=+vote[0].nextSibling.innerHTML;neg=vote[1]?+vote[1].nextSibling.innerHTML:0;percent=pos==0?'0%':pos==neg?'50%':Math.round(pos/(pos+neg)*100)+'%';if(bar[0]){bar[0].style.display='';bar[0].firstChild.style.width=percent;box.title=box.title.replace(/\d+\/\d+/,pos+'/'+(pos+neg)).replace(/\(\d+%\)/,'('+percent+')')}});for(;i<j;i++){vote[i].href='#';vote[i].className=vote[i].className.replace(/fa_vote/,'fa_voted');vote[i].onclick=function(){return false}}return false},vote=$('.vote'),i=0,j=vote.length,version=$('.bodylinewidth')[0]?0:document.getElementById('wrap')?1:$('.pun')[0]?2:document.getElementById('ipbwrapper')?3:'badapple',vdata={tag:['SPAN','LI','SPAN','LI'][version],name:['.name','.postprofile dt > strong','.username','.popmenubutton'][version],actions:['.post-options','.profile-icons','.post-options','.posting-icons'][version],},post,plus,minus,n_pos,n_neg,title_pos,title_neg,li,ul,bar,button,total,percent,span,pseudo,vote_bar;if(version=='badapple'){if(window.console)console.warn('Este plugin não é otimizado na sua versão do fórum, favor pedir suporte no bestweb.');return}for(;i<j;i++){post=$(vote[i]).parentsUntil('.post').parent()[0];bar=$('.vote-bar',vote[i])[0];button=$('.vote-button',vote[i]);pseudo=$(vdata.name,post).text()||'MISSING_STRING';ul=$(vdata.actions,post)[0];li=document.createElement(vdata.tag);li.className='fa_reputation';if(li.tagName=='SPAN')li.style.display='inline-block';if(bar){total=+bar.title.replace(/.*?\((\d+).*/,'$1');percent=+bar.title.replace(/.*?(\d+)%.*/,'$1');n_pos=Math.round(total*(percent/100));n_neg=total-n_pos}else{n_pos=0;n_neg=0}title_pos=(n_pos==1?config.title_like_singular:config.title_like_plural).replace(/%\{USERNAME\}/g,pseudo).replace(/%\{VOTES\}/g,n_pos);title_neg=(n_neg==1?config.title_dislike_singular:config.title_dislike_plural).replace(/%\{USERNAME\}/g,pseudo).replace(/%\{VOTES\}/g,n_neg);li.innerHTML='<span class="fa_count fa_positive" title="'+title_pos+'">'+n_pos+'</span>'+(config.negative_vote?' <span class="fa_count fa_negative" title="'+title_neg+'">'+n_neg+'</span>':'');span=li.getElementsByTagName('SPAN');plus=document.createElement('A');plus.href=button[0]?button[0].firstChild.href:'#';plus.onclick=button[0]?submit_vote:function(){return false};plus.className='fa_vote'+(button[0]?'':'d')+' fa_plus';plus.innerHTML=config.icon_plus;plus.title=(button[0]?config.title_plus:title_pos).replace(/%\{USERNAME\}/g,pseudo);span[0]&&li.insertBefore(plus,span[0]);if(config.negative_vote){minus=document.createElement('A');minus.href=button[1]?button[1].firstChild.href:'#';minus.onclick=button[1]?submit_vote:function(){return false};minus.className='fa_vote'+(button[1]?'':'d')+' fa_minus';minus.innerHTML=config.icon_minus;minus.title=(button[1]?config.title_minus:title_neg).replace(/%\{USERNAME\}/g,pseudo);span[1]&&li.insertBefore(minus,span[1])}if(config.vote_bar){vote_bar=document.createElement('DIV');vote_bar.className='fa_votebar';vote_bar.innerHTML='<div class="fa_votebar_inner" style="width:'+percent+'%;"></div>';vote_bar.style.display=bar?'':'none';li.title=config.title_vote_bar.replace(/%\{USERNAME\}/,pseudo).replace(/%\{VOTES\}/,n_pos+'/'+(n_pos+n_neg)).replace(/%\{PERCENT\}/,'('+percent+'%)');li.appendChild(vote_bar)}config.position_left?ul.insertBefore(li,ul.firstChild):ul.appendChild(li);vote[i].parentNode.removeChild(vote[i])}});

Atenciosamente,
While.

Perfeito, muito obrigado!