Installation d'un bouton de vote problématique

[foxies]

Détails techniques

Version du forum : ModernBB
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour

Après avoir consulté différents tutoriels (celui-ci en particulier) qui m'ont donné envie d'installer un bouton "like" comme on le retrouve sur ce forum je me rends compte que le bouton de vote est manquant sur le mien. Mon template viewtopic_body a certes été modifié, mais même en le remplaçant par celui de base, les boutons de vote initiaux (= le plus et le moins) ne s'affichent pas dans mes messages. J'indique de plus que j'ai activé le système de réputation ainsi que le bouton "Merci".

Comme vous pouvez le voir sur le screen, je souhaite introduire un bouton "like" (qui ne permet donc que des votes positifs) juste à côté des boutons "citer", "éditer" et "supprimer" - la place voulue est indiquée par un cercle rouge.

Template modifié

Code:

<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 = {  };
    }
});

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>

<div class="thread-title"><h2>{TOPIC_TITLE}</h2>
  <div class="thread-buttons">
 <!-- BEGIN switch_user_authpost -->
 <a href="{U_POST_NEW_TOPIC}"><div class="thread-button1 masterTooltip" title="Créer un nouveau sujet"></div></a>
 <!-- END switch_user_authpost -->
 <!-- BEGIN switch_user_authreply -->
 <a href="{U_POST_REPLY_TOPIC}"><div class="thread-button2 masterTooltip" title="Répondre au sujet"></div></a>
 <!-- END switch_user_authreply -->
    <!-- BEGIN switch_user_logged_in -->
 <!-- BEGIN watchtopic -->
 <div class="thread-button3 masterTooltip" title="Surveiller ce sujet">{S_WATCH_TOPIC}</div>
 <!-- END watchtopic -->
 <!-- END switch_user_logged_in -->
  </div>
</div>

{POLL_DISPLAY}
<div class="thread">
<!-- BEGIN postrow -->
 <!-- BEGIN hidden -->
 <div class="post {postrow.hidden.ROW_COUNT}">
 <p style="text-align:center">{postrow.hidden.MESSAGE}</p>
 </div>
 <!-- END hidden -->
 <!-- BEGIN displayed -->

  <div class="thread-post"><div class="post-stats"><div class="post-user">{postrow.displayed.POSTER_NAME}</div><div class="post-user-sep"></div><!-- BEGIN profile_field -->
<div class="post-profile">{postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
    </div><!-- END profile_field --></div><div class="post-header" data-info-posteur='{postrow.displayed.POSTER_NAME}'></div>
    <div class="post-desc">{postrow.displayed.POSTER_AVATAR}
      <div class="post-title"><a href="{postrow.displayed.POST_URL}">{TOPIC_TITLE}</a></div>
      <div class="post-date">{postrow.displayed.POST_DATE_NEW}</div>
      <script type="text/javascript">$('.post-date').each(function(){$(this).html($(this).html().replace(/le/g,""));});</script>
      <div class="post-buttons">
        <a href="{postrow.displayed.QUOTE_URL}"><div class="post-button1 masterTooltip" title="Citer"></div></a>
        <a href="{postrow.displayed.EDIT_URL}"><div class="post-button2 masterTooltip" title="Éditer"></div></a>
      <a href="{postrow.displayed.DELETE_URL}"><div class="post-button3 masterTooltip" title="Supprimer"></div></a>
      
      <!-- BEGIN switch_vote_active -->
 <div class="vote">
 <!-- BEGIN switch_vote -->
                            <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}"><img src="http://i22.servimg.com/u/f22/09/02/12/09/001_1810.png" title="Avis positif" alt="Avis positif" /></a></div>
                            <!-- END switch_vote -->

 <!-- BEGIN switch_vote -->
 <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}" class="ion-thumbsdown"></a>
 <!-- END switch_vote -->

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

 <div class="vote-bars">
 <!-- BEGIN switch_vote_plus -->
 <div class="vote-bar-plus" style="width:{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="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
 <!-- END switch_vote_minus -->
 </div>
 </div>
 <!-- END switch_bar -->

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

<!-- BEGIN switch_user_logged_in -->
<div class="thread-quick">{QUICK_REPLY_FORM}</div>
<!-- END switch_user_logged_in -->

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

<script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=forumotion" type="text/javascript"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/github-gist.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/languages/go.min.js"></script>
<script>
$(document).ready(function() {
 $('pre, code').each(function(i, block) {
 hljs.highlightBlock(block);
 });

 $('.post').each(function() {
 if (!$(this).find('.postprofile-avatar').html().length) {
 $(this).find('.postprofile-rank').css('border-bottom', 'none');
 $(this).find('.postprofile > dl > dt').css('min-height', $(this).find('.post-head').innerHeight());
 }
 });
});
</script>


Merci d'avance pour votre aide et bonne journée

[Neptunia]

Bonjour

les boutons de vote initiaux (= le plus et le moins) ne s'affichent pas dans mes messages.

C'est normal et pareil sur tous les fora. On ne peut jamais voter sur ses messages, uniquement sur ceux des autres.

Idem pour le bouton merci si ce n'est qu'en plus de ne fonctionner que sur les messages des autres, on doit être l'auteur du sujet et ne jamais avoir remercié de message sur le sujet.

[foxies]

Bonjour et merci pour cette réponse C'était tout bête finalement.

Si je puis me permettre, vu que cela fait toujours partie du sujet initial, j'ai du mal à mettre en place ce que je souhaite. Notamment, je n'ai pas réussi à supprimer le bouton de vote négatif malgré l'utilisation de ce code :

Code:

/*-- retrait du bouton de vote négatif dans les messages --*/
.vote .vote-button, .vote-no-bar {
  display:none;
}
.vote .vote-button:first-child {
    display:block;
}

[Neptunia]

Là je passe la main, je ne connais pas assez ModernBB pour répondre.

[foxies]

Merci quand même

J'ai réussi à faire ce que je voulais au niveau de l'apparence du bouton. Avec cette modification au niveau du template :

Code:

<div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}"><div class="post-button4 masterTooltip" title="Liker"></div></a></div>

Et ceci pour cacher le bouton négatif :

Code:

.vote .ion-thumbsdown {
    display: none;
}

Je cherche maintenant à faire en sorte que le background du bouton soit plus foncé une fois que le bouton "like" a été cliqué et qu'il affiche par la même occasion le total de "like" reçus (du coup, supprimer la barre de réputation de message)... Si cela est faisable aussi, remplacer le title du bouton (donc, le texte qui s'affiche en hover) par le pseudo des membres qui ont liké. Là pour le coup, je suis incapable de faire ça toute seule, mes connaissances en JS étant quasi nulles.

[foxies]

Petit UP

[Invité]

Hello pinke,
dans ton template, recherches et supprimes ceci:

Code:

 
<!-- BEGIN switch_vote -->
 <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}" class="ion-thumbsdown"></a>
 <!-- END switch_vote -->


a++

[foxies]

Merci Milouze14, j'ai adopté ta méthode

Je cherche maintenant à faire en sorte que le background du bouton soit plus foncé une fois que le bouton "like" a été cliqué et qu'il affiche par la même occasion le total de "like" reçus (du coup, supprimer la barre de réputation de message)... Si cela est faisable aussi, remplacer le title du bouton (donc, le texte qui s'affiche en hover) par le pseudo des membres qui ont liké. Là pour le coup, je suis incapable de faire ça toute seule, mes connaissances en JS étant quasi nulles.

[Invité]

Hello Pinke,
alors la version Modernbb intègre d'office le système de link mais moins perfectionnée que l'astuce mentionnait ici:
https://forum.forumactif.com/t392578-ameliorer-le-systeme-de-vote-des-messages-sous-forme-de-like#3290110

Ton template modifié me parait étonnant car vu que je n'ai pas la css dans la totalité, son apparence est vraiment pas très chouette.
Bref, je vais te filer le script modifié ainsi que la template ou j'ai supprimé les class de modernbb.

Ton template modifié:

Code:

<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 = {  };
    }
});

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>

<div class="thread-title"><h2>{TOPIC_TITLE}</h2>
  <div class="thread-buttons">
 <!-- BEGIN switch_user_authpost -->
 <a href="{U_POST_NEW_TOPIC}"><div class="thread-button1 masterTooltip" title="Créer un nouveau sujet"></div></a>
 <!-- END switch_user_authpost -->
 <!-- BEGIN switch_user_authreply -->
 <a href="{U_POST_REPLY_TOPIC}"><div class="thread-button2 masterTooltip" title="Répondre au sujet"></div></a>
 <!-- END switch_user_authreply -->
    <!-- BEGIN switch_user_logged_in -->
 <!-- BEGIN watchtopic -->
 <div class="thread-button3 masterTooltip" title="Surveiller ce sujet">{S_WATCH_TOPIC}</div>
 <!-- END watchtopic -->
 <!-- END switch_user_logged_in -->
  </div>
</div>

{POLL_DISPLAY}
<div class="thread">
<!-- BEGIN postrow -->
 <!-- BEGIN hidden -->
 <div class="post {postrow.hidden.ROW_COUNT}">
 <p style="text-align:center">{postrow.hidden.MESSAGE}</p>
 </div>
 <!-- END hidden -->
 <!-- BEGIN displayed -->

  <div class="thread-post"><div class="post-stats"><div class="post-user">{postrow.displayed.POSTER_NAME}</div><div class="post-user-sep"></div><!-- BEGIN profile_field -->
<div class="post-profile">{postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
    </div><!-- END profile_field --></div>
    <div class="post-header" data-info-posteur='{postrow.displayed.POSTER_NAME}'></div>
    <div class="post-desc">{postrow.displayed.POSTER_AVATAR}
      <div class="post-title"><a href="{postrow.displayed.POST_URL}">{TOPIC_TITLE}</a></div>
      <div class="post-date">{postrow.displayed.POST_DATE_NEW}</div>
      <script type="text/javascript">$('.post-date').each(function(){$(this).html($(this).html().replace(/le/g,""));});</script>
      <div class="post-buttons">
        <a href="{postrow.displayed.QUOTE_URL}"><div class="post-button1 masterTooltip" title="Citer"></div></a>
        <a href="{postrow.displayed.EDIT_URL}"><div class="post-button2 masterTooltip" title="Éditer"></div></a>
      <a href="{postrow.displayed.DELETE_URL}"><div class="post-button3 masterTooltip" title="Supprimer"></div></a>
   <!-- BEGIN switch_vote_active -->
 <div class="vote">
 <!-- BEGIN switch_vote -->
 <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}" class="ion-thumbsup"></a>
 <!-- END switch_vote -->

 <!-- BEGIN switch_vote -->
 <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}" class="ion-thumbsdown"></a>
 <!-- END switch_vote -->

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

 <div class="vote-bars">
 <!-- BEGIN switch_vote_plus -->
 <div class="vote-bar-plus" style="width:{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="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
 <!-- END switch_vote_minus -->
 </div>
 </div>
 <!-- END switch_bar -->

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

<!-- BEGIN switch_user_logged_in -->
<div class="thread-quick">{QUICK_REPLY_FORM}</div>
<!-- END switch_user_logged_in -->

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

<script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=forumotion" type="text/javascript"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/github-gist.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/languages/go.min.js"></script>
<script>
$(document).ready(function() {
 $('pre, code').each(function(i, block) {
 hljs.highlightBlock(block);
 });

 $('.post').each(function() {
 if (!$(this).find('.postprofile-avatar').html().length) {
 $(this).find('.postprofile-rank').css('border-bottom', 'none');
 $(this).find('.postprofile > dl > dt').css('min-height', $(this).find('.post-head').innerHeight());
 }
 });
});
</script>

La c.s.s des votes (il faudra supprimer toutes les précédentes):
ici:
https://forum.forumactif.com/t397417-installation-d-un-bouton-de-vote-problematique#3320885
ici:
https://forum.forumactif.com/t397417-installation-d-un-bouton-de-vote-problematique#3320900

Ajoutes le style donné sur l'astuce:

Code:

.fa_vote, .fa_voted, .fa_count {
  font-size:12px;
  font-family:Verdana, Arial, Helvetica, Sans-serif;
  display:inline-block !important;
  width:auto !important;
  float:none !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;
}
 
.fa_reputation a {
   float: none;
}

Puis le script sur toutes les pages:

Code:


$(function() {
  // General Configuration of the plugin
  var config = {
    position_left : true, // true for left || false for right
    mobile_position_left: false, // true for left || false for right
    negative_vote : false, // true for negative votes || false for positive only
    vote_bar : true, // display a small bar under the vote buttons
 
    // button config
    icon_plus : '<img src="http://i18.servimg.com/u/f18/18/21/41/30/plus10.png" alt="+"/>',
    icon_minus : '<img src="http://i18.servimg.com/u/f18/18/21/41/30/minus10.png" alt="-"/>',
 
    // language config
    title_plus : 'J\'aime',
    title_minus : 'Je n\'aime pas',
    error_limit : 'Vous ne pouvez plus voter aujourd\'hui',
 
    title_like_singular : '%{VOTES} personne aime le message de %{USERNAME}',
    title_like_plural : '%{VOTES} personnes aiment le message de %{USERNAME}',
 
    title_dislike_singular : '%{VOTES} personne n\'aime pas le message de %{USERNAME}',
    title_dislike_plural : '%{VOTES} personnes n\'aiment pas le message de %{USERNAME}',
 
    title_vote_bar : '%{VOTES} personne(s) aime(nt) le message de %{USERNAME} %{PERCENT}'
  },
  
  // function bound to the onclick handler of the vote buttons
  submit_vote = function() {
    var next = this.nextSibling, // the counter next to the vote button that was clicked
        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;

    // submit the vote asynchronously
    $.get(this.href, function(res) {
      if( res.search("Vous ne pouvez plus") == -1 ) {
        next.innerHTML = +next.innerHTML + 1; // add to the vote count
        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 + ')');
        }
      } else {
        alert( config.error_limit );
      }
    });

    // revoke voting capabilities on the post once the vote is cast
    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('phpbb') ? 1 :
    $('.pun')[0] ? 2 :
    document.getElementById('ipbwrapper') ? 3 :
    document.getElementById('modernbb') ? 4 :
    document.getElementById('mpage-body-modern') ? 5 :
    'badapple', // version check

  // version data so we don't have to redefine these arrays during the loop
  vdata = {
    tag : ['SPAN', 'LI', 'SPAN', 'LI', 'LI', 'LI'][version],
    name : ['.name', '.postprofile dt > strong', '.username', '.popmenubutton', '.post-user', '.poster_name'][version],
    actions : ['.post-options', '.profile-icons', '.post-options', '.posting-icons', '.post-buttons', '.post-buttons'][version]
  },

  post, plus, minus, n_pos, n_neg, title_pos, title_neg, li, ul, bar, button, total, percent, span, pseudo, vote_bar; // startup variables for later use in the loop

  // prevent execution if the version cannot be determined
  if (version == 'badapple') {
    if (window.console) console.warn('This plugin is not optimized for your forum version. Please contact the support for further assistance.');
    return;
  }
 
  for (; i < j; i++) {
    post = $(vote[i]).closest('[class="thread-post"]')[0];
    bar = $('.vote-bar', vote[i])[0]; // vote bar
    button = $('a[href*="p_vote"]', vote[i]); // plus and minus buttons
    pseudo = $(vdata.name, post).text() || 'MISSING_STRING'; // username of the poster
    ul = $(vdata.actions, post)[0]; // post actions
    li = document.createElement(vdata.tag); // vote system container
    li.className = 'fa_reputation';

    if (li.tagName == 'SPAN') li.style.display = 'inline-block';

    // calculate votes
    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;
    }

    // set up negative and positive titles with the correct grammar, votes, and usernames
    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);

    // define the vote counts
    li.innerHTML = '<span class="fa_count fa_positive" title="' + title_pos + '">' + n_pos + '</span>' + (config.negative_vote ? '&nbsp;<span class="fa_count fa_negative" title="' + title_neg + '">' + n_neg + '</span>' : '');
    span = li.getElementsByTagName('SPAN'); // get the vote count containers for use as insertion points

    // create positive vote button
    plus = document.createElement('A');
    plus.href = button[0] ? button[0].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]);

    // create negative vote button
    if (config.negative_vote) {
      minus = document.createElement('A');
      minus.href = button[1] ? button[1].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]);
    }

    // create vote bar
    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);
    }
 
    // finally insert the vote system and remove the default one
    if(version != 4)
      config.position_left ? ul.insertBefore(li, ul.firstChild) : ul.appendChild(li);
    else
      config.mobile_position_left ? ul.insertBefore(li, ul.firstChild) : ul.appendChild(li);
 
    vote[i].parentNode.removeChild(vote[i]);
  }
});




Tu ne voulais pas de vote négatif j'ai donc déposé false ici:

Code:

negative_vote : false,

Si tu désires faire marche arrière il faudra renseigner true  .


Et voilou .

a++

[foxies]

Bonjour Milouze14 et merci pour ton aide Je vais installer tout ça dans la journée, je donnerai des nouvelles de ce que ça donne ensuite.

Edit : J'ai donc mis en place ce que tu m'as conseillé mais rien n'a changé par rapport à ce que j'avais avant... (mis à part le fait que les boutons de vote ne sont plus sous forme d'images mais d'icônes FA).

[Invité]

Hello Pinke,

aurais tu compte test de dispo afin que je puisse voir ce qui cloche sur ton fofo ?

a++

[foxies]

Bien sûr, c’est toujours le même (je t’avais envoyé les identifiants par Mp pour un autre problème) ! Merci

[Invité]

Hello Pinke,

ah vi c'est vrai,j'avais oublié....
Hum,ton template n'a pas été modifié ,
je vois toujours les class des boutons.
Je l'ai souligné ici:

https://forum.forumactif.com/t397417-installation-d-un-bouton-de-vote-problematique#3320977

Bref, je vais te filer le script modifié ainsi que la template ou j'ai supprimé les class de modernbb.

a++

[foxies]

Bonjour Milouze14, vraiment désolée pour le dérangement. J'ai pourtant bien inséré le template que tu m'as donné ainsi qu'ajouté le script JS. Les seules modifications que j'ai fait entre-temps - car je continue de travailler sur l'apparence de mes sujets : la mise en forme du bouton "surveiller le sujet", l'ajout du rang ainsi que les éléments de profil personnalisé. Rien qui ne puisse pourtant affecter le bouton de vote (au risque de me faire taper sur les doigts ) ?

[Invité]

Re pinke,
oups désolé, je me suis planté lors de l'insertion du template, voici le bon:

Code:

<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 = {  };
    }
});

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>

<div class="thread-title"><h2>{TOPIC_TITLE}</h2>
  <div class="thread-buttons">
 <!-- BEGIN switch_user_authpost -->
 <a href="{U_POST_NEW_TOPIC}"><div class="thread-button1 masterTooltip" title="Créer un nouveau sujet"></div></a>
 <!-- END switch_user_authpost -->
 <!-- BEGIN switch_user_authreply -->
 <a href="{U_POST_REPLY_TOPIC}"><div class="thread-button2 masterTooltip" title="Répondre au sujet"></div></a>
 <!-- END switch_user_authreply -->
    <!-- BEGIN switch_user_logged_in -->
 <!-- BEGIN watchtopic -->
 <div class="thread-button3 masterTooltip" title="Surveiller ce sujet">{S_WATCH_TOPIC}</div>
 <!-- END watchtopic -->
 <!-- END switch_user_logged_in -->
  </div>
</div>

{POLL_DISPLAY}
<div class="thread">
<!-- BEGIN postrow -->
 <!-- BEGIN hidden -->
 <div class="post {postrow.hidden.ROW_COUNT}">
 <p style="text-align:center">{postrow.hidden.MESSAGE}</p>
 </div>
 <!-- END hidden -->
 <!-- BEGIN displayed -->

  <div class="thread-post"><div class="post-stats"><div class="post-user">{postrow.displayed.POSTER_NAME}</div><div class="post-user-sep"></div><!-- BEGIN profile_field -->
<div class="post-profile">{postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
    </div><!-- END profile_field --></div>
    <div class="post-header" data-info-posteur='{postrow.displayed.POSTER_NAME}'></div>
    <div class="post-desc">{postrow.displayed.POSTER_AVATAR}
      <div class="post-title"><a href="{postrow.displayed.POST_URL}">{TOPIC_TITLE}</a></div>
      <div class="post-date">{postrow.displayed.POST_DATE_NEW}</div>
      <script type="text/javascript">$('.post-date').each(function(){$(this).html($(this).html().replace(/le/g,""));});</script>
      <div class="post-buttons">
        <a href="{postrow.displayed.QUOTE_URL}"><div class="post-button1 masterTooltip" title="Citer"></div></a>
        <a href="{postrow.displayed.EDIT_URL}"><div class="post-button2 masterTooltip" title="Éditer"></div></a>
      <a href="{postrow.displayed.DELETE_URL}"><div class="post-button3 masterTooltip" title="Supprimer"></div></a>
   <!-- BEGIN switch_vote_active -->
               <div class="vote">
                  <!-- BEGIN switch_vote -->
                     <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}"></a>
                  <!-- END switch_vote -->

                  <!-- BEGIN switch_vote -->
                     <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}"></a>
                  <!-- END switch_vote -->

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

                     <div class="vote-bars">
                        <!-- BEGIN switch_vote_plus -->
                           <div class="vote-bar-plus" style="width:{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="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
                        <!-- END switch_vote_minus -->
                     </div>
                  </div>
                  <!-- END switch_bar -->

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

<!-- BEGIN switch_user_logged_in -->
<div class="thread-quick">{QUICK_REPLY_FORM}</div>
<!-- END switch_user_logged_in -->

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

<script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=forumotion" type="text/javascript"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/github-gist.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/languages/go.min.js"></script>
<script>
$(document).ready(function() {
 $('pre, code').each(function(i, block) {
 hljs.highlightBlock(block);
 });

 $('.post').each(function() {
 if (!$(this).find('.postprofile-avatar').html().length) {
 $(this).find('.postprofile-rank').css('border-bottom', 'none');
 $(this).find('.postprofile > dl > dt').css('min-height', $(this).find('.post-head').innerHeight());
 }
 });
});
</script>

Penses à enregistrer puis à valider en cliquant respectivement sur   puis

a++

[foxies]

Re, j'ai fait comme tu m'as dit et les deux boutons ont disparu maintenant :S

[Invité]

Re,
tu peux regarder tes MPS .

a++

[foxies]

Sujet résolu, merci <3