Melhor Resposta / Botão Obrigado

Detalhes da questão

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

Descrição

Bom, meu fórum tem um sistema de reputação que eu não botei já veio direto no css eu acho.
Eu queria trocar a aparência da melhor resposta dele quero deixar assim olhe.

Meu sistema como está: https://i.imgur.com/6mPEYCS.jpg
Como eu quero: https://i.imgur.com/Lvb2rmW.jpg


Sobe botão obrigado Então, vamos lá.

Bom, meu botão obrigado ele aparecesse apenas em tópicos que membros criam
ou seja se eu criar um tópico o membro responder e depois eu responder novamente.
ao invés de aparecer o botão para o membro dar obrigado a quem ajudou ele certo?
mas ele não aparece por exemplo, se eu ajudar o membro ele ficar satisfeito.
Da mesma forma ele ira aparecer para o membro e não para mim no caso eu iria tem que dar o obrigado para o membro seja que eu ajudei. no caso seria ao contrario não.

Então eu queria o botão obrigado apenas para Administrador/Moderador/Designer.
no caso para o membro clicar em obrigado caso seja ajudado, espero que entenda até mais.

OBS: Eu quero que apareça o botão obrigado apenas em Tópico de administrador/moderador/designer até em resposta.

Olá Amigo, crie um novo javascript com esse codigo com investimento nos topicos:

Código:

$(function() {
if($('.posthead:first h2 strong').length) {
  $('.post[style^="background-color"] .posthead').append(
    '<div id="best-res" class="answerBadgeInPost">✓ Melhor Resposta</div>'
  );
  var badge = $('#best-res'),
      badgePost = badge.parents('.post'),
      autor = badgePost.find('.username a').html(),
      avatarEl = badgePost.find('.user .user-ident .user-basic-info a'),
      avatarImg = avatarEl.find('img').attr('src'),
      avatarUrl = avatarEl.attr('href'),
      linkPost = badgePost.find('.posthead a').attr('href'),
      post = badgePost.find('.entry-content div').last().prev().html();
  if(badge.length) {
      $('#main-content .paged').before(
        '<div class="post_feature_box">' +
        ' <span class="userphoto">' +
        '  <a href="' + avatarUrl + '">' +
        '  <img src="' + avatarImg + '" alt="' + avatarImg + '" />' +
        '  </a>' +
        ' </span>' +
        ' <div style="margin-left: 65px;">' +
        '  <span class="badge">Melhor Resposta</span>' + autor + '<div class="best_post">' + post + '</div>' +
        '  <a href="' + linkPost + '"><span class="badge">Visualizar post completo</span></a>' +
        ' </div>' +
        '</div>'
      );
  }
}
});

E adicione esse codigo na sua folha de estilo css:

Código:

#best-res {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -webkit-box-shadow: inset 0 1px 0 0 #0376a3, 0 2px 3px rgba(0,0,0,0.2);
    background: #02678f url(http://imgur.com/srUpLQz.png) repeat-x;
    border: 1px solid #005780;
    border-radius: 3px;
    color: #fff;
    float: right;
    height: 30px;
    line-height: 30px;
    margin: 15px 5px 0 0;
    padding: 0 12px;
    position: relative;
    text-shadow: rgba(0,0,0,0.8) 0 1px 0;
}

Bom, while se e esse código era sobre o sistema melhor resposta ele não resultou ficou normal como já estava em meu fórum olhe: https://i.imgur.com/xQxRJEW.jpg
Apenas ficou um novo botão de Melhor reposta até.

Olá novamente, troque o codigo js por este:

Código:

$(function(){
    $('.post .posthead[style="background-color:#eaf8e2;"]').append('<div id="best-res" class="answerBadgeInPost">✓ &nbsp;Melhor Resposta</div>').attr('style','background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0) 100%);background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.3)), color-stop(100%,rgba(255,255,255,0)));
background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%);background-image: -o-linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%);background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%);background-image: linear-gradient(to bottom, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%);-webkit-box-shadow: inset rgba(255,255,255,0.35) 0px 1px 0px;-moz-box-shadow: inset rgba(255,255,255,0.35) 0px 1px 0px;box-shadow: inset rgba(255,255,255,0.35) 0px 1px 0px;background: #dfedd1;text-shadow: rgba(255,255,255,0.8) 0px 1px 0px;border: 1px solid #accf8b;');
    var topicauthor = $('.post #best-res').parents('.post').find('.user .username a').html();
    var topicavatar = $('.post #best-res').parents('.post').find('.postmain .postbody .user .user-ident .user-basic-info a img').attr('src');
    var urlavt= $('.post #best-res').parents('.post').find('.postmain .postbody .user .user-ident .user-basic-info a').attr('href');
    var topicpost = $('.post #best-res').parents('.post').find('.posthead a').attr('href');
    var topicdata = $('.post #best-res').parents('.post').find('.posthead h2 .data-post').html();
    var bestTopic = $('.post #best-res').parents('.post').find('.entry-content').html();
if($('#best-res').length){
    $('.main.paged').before('<div class="post_feature_box">
<span class="ipsUserPhoto"><img src="'+topicavatar+'" /></span>
<span class="ipsBadge">Melhor Resposta</span> '+topicauthor+', '+topicdata+'<div style="border: 1px solid #ddd; border-bottom: 1px solid #ececec; margin: 3px;"></div><div style="display: inline-block;">'+bestTopic+'</div><a href="'+topicpost+'">
        <span class="ipsBadge" style="background: #B3B3B3;font-weight: normal !important;">Visualizar todo o conteúdo do post <img class="icon" src="http://i.imgur.com/omzqZnf.png"></span></a>
</div>');}
    });

e troque o css por este:

Código:

/*feature box*/
.post_feature_box {
  margin-top: 5px;
  max-width:100%;
  background-color: rgb(234, 248, 226);
  border: 1px dotted rgb(51, 51, 51);
  padding: 6px;
  min-height: 60px;
}
#best-res {
color: #436500;
background: #dfedd1;
text-shadow: rgba(255,255,255,0.8) 0px 1px 0px;
border: 1px solid #accf8b;
border-top: 0;
padding: 0 12px;
height: 30px;
line-height: 30px;
position: relative;
float: right;
margin: -1px -2px 8px 8px;
-webkit-border-bottom-left-radius: 3px;
-webkit-border-bottom-right-radius: 3px;
-moz-border-radius: 0px 0px 3px 3px;
border-radius: 0px 0px 3px 3px;
}
.ipsUserPhoto {
float: left;
padding: 1px;
border: 1px solid #d5d5d5;
background: #fff;
-webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
margin-right: 8px;
}
.ipsUserPhoto:hover {
border-color: #7d7d7d;
}
.ipsUserPhoto img {
width: 50px;
height: 50px;
}
.ipsBadge {
background: #7ba60d;
display: inline-block;
height: 16px;
line-height: 16px;
padding: 0 5px;
font-size: 9px;
font-weight: bold;
text-transform: uppercase;
color: #fff;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
vertical-align: middle;
margin-right: 8px;
}

Troque em > #eaf8e2 < pela cor que você definiu como fundo da mensagem agradecida.

como como já estava eu quero saber se tem como deixar ele apenas no titulo olhe.

Print: https://i.imgur.com/Kz41XgI.jpg eu quero saber se tem como deixar igual a esta parte onde está verde?

Poderia me passar o link desse fórum por gentileza? isto ajudaria...

Está aqui:
http://maisforum.forumeiros.com/

Olá, tente esse codigo js:

Código:


var color = '#dfedd1'; //Cor da mensagem agradecida
var _0x4a0e=["\x6C\x65\x6E\x67\x74\x68","\x2E\x70\x6F\x73\x74\x3A\x66\x69\x72\x73\x74\x20\x68\x33\x20\x73\x74\x72\x6F\x6E\x67","\x3C\x64\x69\x76\x20\x69\x64\x3D\x22\x62\x65\x73\x74\x2D\x72\x65\x73\x22\x20\x63\x6C\x61\x73\x73\x3D\x22\x61\x6E\x73\x77\x65\x72\x42\x61\x64\x67\x65\x49\x6E\x50\x6F\x73\x74\x22\x3E\u2713\x20\x4D\x65\x6C\x68\x6F\x72\x20\x52\x65\x73\x70\x6F\x73\x74\x61\x3C\x2F\x64\x69\x76\x3E","\x61\x70\x70\x65\x6E\x64","\x64\x69\x76\x2E\x70\x6F\x73\x74\x2E\x70\x6F\x73\x74\x5B\x73\x74\x79\x6C\x65\x3D\x22\x62\x61\x63\x6B\x67\x72\x6F\x75\x6E\x64\x2D\x63\x6F\x6C\x6F\x72\x3A","\x3B\x22\x5D","\x68\x74\x6D\x6C","\x2E\x61\x75\x74\x68\x6F\x72\x20\x73\x70\x61\x6E","\x66\x69\x6E\x64","\x2E\x70\x6F\x73\x74","\x70\x61\x72\x65\x6E\x74\x73","\x23\x62\x65\x73\x74\x2D\x72\x65\x73","\x73\x72\x63","\x61\x74\x74\x72","\x2E\x70\x6F\x73\x74\x6D\x61\x69\x6E\x20\x2E\x70\x6F\x73\x74\x62\x6F\x64\x79\x20\x2E\x75\x73\x65\x72\x20\x2E\x75\x73\x65\x72\x2D\x69\x64\x65\x6E\x74\x20\x2E\x75\x73\x65\x72\x2D\x62\x61\x73\x69\x63\x2D\x69\x6E\x66\x6F\x20\x61\x20\x69\x6D\x67","\x68\x72\x65\x66","\x2E\x70\x6F\x73\x74\x6D\x61\x69\x6E\x20\x2E\x70\x6F\x73\x74\x62\x6F\x64\x79\x20\x2E\x75\x73\x65\x72\x20\x2E\x75\x73\x65\x72\x2D\x69\x64\x65\x6E\x74\x20\x2E\x75\x73\x65\x72\x2D\x62\x61\x73\x69\x63\x2D\x69\x6E\x66\x6F\x20\x61","\x73\x70\x61\x6E\x2E\x70\x6F\x73\x74\x5F\x69\x64\x20\x61","\x73\x70\x61\x6E\x2E\x64\x61\x74\x61\x2D\x70\x6F\x73\x74","\x70\x72\x65\x76","\x6C\x61\x73\x74","\x2E\x65\x6E\x74\x72\x79\x2D\x63\x6F\x6E\x74\x65\x6E\x74\x20\x64\x69\x76","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x70\x6F\x73\x74\x5F\x66\x65\x61\x74\x75\x72\x65\x5F\x62\x6F\x78\x22\x3E\x3C\x73\x70\x61\x6E\x20\x63\x6C\x61\x73\x73\x3D\x22\x75\x73\x65\x72\x70\x68\x6F\x74\x6F\x22\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x22\x3E\x3C\x69\x6D\x67\x20\x73\x72\x63\x3D\x22","\x22\x20\x61\x6C\x74\x3D\x22","\x22\x2F\x3E\x3C\x2F\x61\x3E\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x64\x69\x76\x20\x73\x74\x79\x6C\x65\x3D\x22\x6D\x61\x72\x67\x69\x6E\x2D\x6C\x65\x66\x74\x3A\x20\x36\x35\x70\x78\x3B\x22\x3E\x3C\x73\x70\x61\x6E\x20\x63\x6C\x61\x73\x73\x3D\x22\x62\x61\x64\x67\x65\x22\x3E\x4D\x65\x6C\x68\x6F\x72\x20\x52\x65\x73\x70\x6F\x73\x74\x61\x3C\x2F\x73\x70\x61\x6E\x3E","\x2C\x20","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x62\x65\x73\x74\x5F\x70\x6F\x73\x74\x22\x3E","\x3C\x2F\x64\x69\x76\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x22\x3E\x3C\x73\x70\x61\x6E\x20\x63\x6C\x61\x73\x73\x3D\x22\x62\x61\x64\x67\x65\x22\x3E\x56\x69\x73\x75\x61\x6C\x69\x7A\x61\x72\x20\x70\x6F\x73\x74\x20\x63\x6F\x6D\x70\x6C\x65\x74\x6F\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x2F\x61\x3E\x3C\x2F\x64\x69\x76\x3E\x3C\x2F\x64\x69\x76\x3E","\x62\x65\x66\x6F\x72\x65","\x23\x6D\x61\x69\x6E\x2D\x63\x6F\x6E\x74\x65\x6E\x74\x20\x2E\x70\x61\x67\x65\x64"];$(function (){if($(_0x4a0e[1])[_0x4a0e[0]]){$(_0x4a0e[4]+color+_0x4a0e[5])[_0x4a0e[3]](_0x4a0e[2]);var _0x3a31x1=$(_0x4a0e[11])[_0x4a0e[10]](_0x4a0e[9])[_0x4a0e[8]](_0x4a0e[7])[_0x4a0e[6]]();var _0x3a31x2=$(_0x4a0e[11])[_0x4a0e[10]](_0x4a0e[9])[_0x4a0e[8]](_0x4a0e[14])[_0x4a0e[13]](_0x4a0e[12]);var _0x3a31x3=$(_0x4a0e[11])[_0x4a0e[10]](_0x4a0e[9])[_0x4a0e[8]](_0x4a0e[16])[_0x4a0e[13]](_0x4a0e[15]);var _0x3a31x4=$(_0x4a0e[11])[_0x4a0e[10]](_0x4a0e[9])[_0x4a0e[8]](_0x4a0e[17])[_0x4a0e[13]](_0x4a0e[15]);var _0x3a31x5=$(_0x4a0e[11])[_0x4a0e[10]](_0x4a0e[9])[_0x4a0e[8]](_0x4a0e[18])[_0x4a0e[6]]();var _0x3a31x6=$(_0x4a0e[11])[_0x4a0e[10]](_0x4a0e[9])[_0x4a0e[8]](_0x4a0e[21])[_0x4a0e[20]]()[_0x4a0e[19]]()[_0x4a0e[6]]();if($(_0x4a0e[11])[_0x4a0e[0]]){$(_0x4a0e[31])[_0x4a0e[30]](_0x4a0e[22]+_0x3a31x3+_0x4a0e[23]+_0x3a31x2+_0x4a0e[24]+_0x3a31x2+_0x4a0e[25]+_0x3a31x1+_0x4a0e[26]+_0x3a31x5+_0x4a0e[27]+_0x3a31x6+_0x4a0e[28]+_0x3a31x4+_0x4a0e[29]);} ;} ;} );

troque o "#dfedd1" pela cor da mensagem de agradecido

não resultou..

Tente este:

Código:


$(function() {
    if ($('.posthead:first h2 strong').length) {
        var color = '#dfedd1';
        $('.post .posthead[style="background-color:' + color + ';"]').append('<div id="best-res" class="answerBadgeInPost">✓ Melhor Resposta</div>');
        var autor = $('#best-res').parents('.post').find('.user .username a').html();
        var avatar = $('#best-res').parents('.post').find('.postmain .postbody .user .user-ident .user-basic-info a img').attr('src');
        var urlavt = $('#best-res').parents('.post').find('.postmain .postbody .user .user-ident .user-basic-info a').attr('href');
        var linkpost = $('#best-res').parents('.post').find('.posthead a').attr('href');
        var data = $('#best-res').parents('.post').find('.posthead h2 .data-post').html();
        var post = $('#best-res').parents('.post').find('.entry-content div').last().prev().html();
        if ($('#best-res').length) {
            $('#main-content .paged').before('<div class="post_feature_box"><span class="userphoto"><a href="' + urlavt + '"><img src="' + avatar + '" alt="' + avatar + '"/></a></span><div style="margin-left: 65px;"><span class="badge">Melhor Resposta</span>' + autor + ', ' + data + '<div class="best_post">' + post + '</div><a href="' + linkpost + '"><span class="badge">Visualizar post completo</span></a></div></div>')
        }
    }
});


Infelizmente não resultou olhe não precisa do efeito melhor resposta.
Irei retirar ele mas como faço para retirar por que eu acho que ele já veio no CSS.

Retire os CSS e JS passado nesse topico e acesse:

Painel de Controle -> Visualização -> Imagens e Cores -> Cores

procure por Cor do fundo de uma mensagem agradecida :

e deixe #FFF

e pronto... não estará aparecendo mais o "Melhor Resposta".

#Edit Resolvido pode fechar..