Boutons de remerciement de sujet

Hi,
Voici une astuce pour placer un bouton de remerciement afin de dire merci à un membre pour son message posté. Pour le posteur ce bouton n'est pas visible

Cette astuce est une réalisation de Milouze14 suite à une demande de ma part:

https://www.milouze14.com/t32420-edge-remercier-l-auteur-du-sujet#617017

Le rendu en image :

Le bouton de remerciement :

Une fois qu'un membre à remercié un posteur le bouton est coché avec un message vous indiquant que votre merci est déjà effectué

Après avoir remercié :

En fin de message du posteur s'inscrit tous les membres qui ont dit merci

Après un remerciement :

Un message automatique est posté en réponse

La réponse automatique :

Ce message est posté en réponse




Direction le javascript

Panneau d'administration / Modules / HTML & JAVASCRIPT / Gestion des codes javascript


Mettre ce script sur les sujets :

Code:

$(function(){
if (_userdata["user_id"] >= (0)){
var M14_author=_userdata["username"];
$('.post:eq(0)').addClass('M14_No_Thank').each(function(){
$(this).find('.content div:first').after('<div class="M14_Thank_Cont"><div><span class="M14_Texte_liste">Ce membre te dit merci</span><span class="M14_ThankUser"></span> pour ce topic : <a target="_blank" href="" class="M14_Thank_link"></a><br /></div><div class="M14_Thank_list"><div></div></div></div>');
var M14_Thank_text=$(this).find('.topic-title').text();
var M14_Thank_link=$(this).find('.topic-title').attr('href');
var M14_UserPost=$(this).find('.postprofile .username').html();
var a=$(this).find('.postprofile .username').text();
//var M14_UserPostColor=$(this).find('.postprofile .username span').css('color');
$('.M14_Length').closest('.post').addClass('M14_Ok_Thank');
if(M14_author!=a)
{
$(this).find('ul.profile-icons li:first').before('<li><a id="M14_Thank"class="color-primary"title="Remercier l\'auteur(e) du topic"></a></li>');
}
if($('.M14_Ok_Thank').length)
{
$('.post:eq(0)').find('.M14_Thank_Cont').show();
};
$('.M14_ThankUser').html(''+M14_UserPost+'');
$('a.M14_Thank_link').attr('href',M14_Thank_link).text(''+M14_Thank_text+'');
});
}
});
$(function() {
$('.M14_Ok_Thank').each(function(){
var M14_User_thank=$(this).find('.postprofile .username').html();
//var M14_User_thankColor=$(this).find('.author span').css('color');
var M14_UserNull=$('.M14_Ok_Thank').length <2;
var M14_UserMore=$('.M14_Ok_Thank').length >1;
if(M14_UserNull)
{
$('.M14_Thank_list div').append(''+M14_User_thank+'');
}  
else if(M14_UserMore)
{
$('.M14_Thank_list div').append(''+M14_User_thank+'');
$('.M14_Texte_liste').html('Ces membres te remercient')
}
});
$('.post:not(.M14_No_Thank)').each(function(){
var M14_author=_userdata["username"];
$('.M14_Thank_list div').each(function(){
var $this=$(this).find('span strong').text();
if($this==M14_author)
{
$('#M14_Thank').replaceWith('<a id="M14_ThankThank"class="color-primary"title="Tu as déjà dit merci pour ce topic"></a>');
}
});});

});
$(function() {
// ON RENSEIGNE LE TEXTE CI DESSOUS
var texte="<div class=M14_Length>Merci beaucoup !</div>";
var message=texte;
$('#M14_Thank').click(function() {
$editor = $('.sceditor-container');
if ($editor.hasClass('wysiwygMode')) $editor.removeClass('wysiwygMode').addClass('sourceMode') ;
$('#quick_reply textarea ').val(message);
$('input[name="post"]').click();
});
});

Pensez à  

Le script en détail

Pour modifier la phrase "Ce membre te dit merci pour ce topic" c'est ici :

Code:

$(this).find('.content div:first').after('<div class="M14_Thank_Cont"><div><span class="M14_Texte_liste">Ce membre te dit merci</span><span class="M14_ThankUser"></span> pour ce topic : <a target="_blank" href=""

Pour modifier la phrase "Remercier l'auteur du topic" c'est ici :

Code:

$(this).find('ul.profile-icons li:first').before('<li><a id="M14_Thank"class="color-primary"title="Remercier l\'auteur(e) du topic"></a></li>');

L'antislash est important avant l'apostrophe (l\'auteur(e))

Pour modifier "Ces membres te remercient" c'est ici :

Code:

$('.M14_Texte_liste').html('Ces membres te remercient')

Pour modifier "Tu as déjà dit merci pour ce topic" c'est ici :

Code:

$('#M14_Thank').replaceWith('<a id="M14_ThankThank"class="color-primary"title="Tu as déjà dit merci pour ce topic"></a>');

Pour modifier la phrase du post de remerciement "Merci beaucoup !" c'est ici :

Code:

var texte="<div class=M14_Length>Merci beaucoup !</div>";

Direction le template

Panneau d'administration / Affichage /Templates / Général / viewtopic_body


Pour la mise en forme du message inscrit en fin de post, message qui liste les membres qui ont remercié l'auteur(e) du sujet, et des deux boutons de remerciement (avant et après avoir remercié) il faut placer un code CSS dans le template

Dans le template viewtopic_body juste après ceci :

Code:

</div>
 {postrow.displayed.EDITED_MESSAGE}
 <!-- BEGIN switch_signature -->
 <div class="signature_div" id="sig{postrow.displayed.U_POST_ID}">{postrow.displayed.SIGNATURE_NEW}</div>
 <!-- END switch_signature -->

</div>
 </div>

Placez ce code :

Code:

<style>
  /*les deux boutons*/
a#M14_Thank,a#M14_ThankThank
{padding: 4px 6px;cursor:pointer;}
/*Le bouton remercié*/
a#M14_Thank:before
{
content: "\f087";
color:white;
font-family: FontAwesome;
}
/*Le bouton déjà remercié*/
a#M14_ThankThank:before
{
content: "\f046";
color:white;
font-family: FontAwesome;
}
/*Le membre remercié*/
.M14_ThankUser
{
margin: 0px 2px;
font-weight: bold;
}
  /*Les membres ayant remerciés*/
.M14_Thank_list span
{
margin: 0px 2px;

}
  
  /*Le conteneur*/
.M14_Thank_Cont{
  margin-top: 30px;
  position:relative;
    clear:both;
    font-style: italic;
    border: 1px solid #bac4cb;
    background: url(https://i.servimg.com/u/f58/11/26/21/37/merci11.png) no-repeat;
    background-position: 5px 2px;
    background-color:#DCE1E5;
    padding: 5px;
    min-height:50px;
    padding-left: 50px;
    border-radius: 5px;
    display:none;
    }

</style>

Pensez à     et à publier le template en cliquant sur  

Lien de la page Fontawesome si vous voulez changer les boutons de remerciement :
https://fontawesome.com/v4.7.0/icons/

:u1:

À bientôt

---