Le Deal du moment : -40%
Sosh : forfait mobile 80 Go sans engagement à ...
Voir le deal
14.99 €

Aller en bas
Pêpêche
Pêpêche
Mascotte
Messages : 4860

Ajouter un second rang en fonction du nombre de messages Empty Ajouter un second rang en fonction du nombre de messages

le Jeu 17 Oct 2019 - 9:57

Toutes versions

Ajouter un second rang en fonction du nombre de messages

Coucou les loulous Smile

ForumActif nous donne la possibilité d'attribuer des rangs spéciaux à nos membres. Cela dit, parfois, on aimerait pouvoir attribuer un rang spécial + un rang en fonction du nombre de messages.

Eh bien c'est possible, et c'est ce que nous allons faire ici Smile

Voici un exemple de rendu : clic .

Ajouter un second rang en fonction du nombre de messages Codage11

Ici, dans mon exemple, j'ai défini uniquement 5 nouveaux rangs :
• de 0 à 20 messages : "Je suis nouveau",
• de 21 à 50 messages : "Je suis timide",
• de 51 à 100 messages : "Je prends mes marques",
• de 101 à 200 messages : "Je me sens bien",
• plus de 201 messages : "Je suis bien installé".

Mais tu peux en mettre autant que tu le désires, tant qu'un nombre n'est pas dans 2 rangs Smile

Idea Ce tutoriel fonctionne pour toutes les versions de forum.

Le javascript

On va commencer par créer un javascript qu'on ne va appeler nulle part. Pour cela, on va aller dans Panneau d'administration > Modules > HTML & JAVASCRIPT > Gestion des codes Javascript.

Le js contiendra ceci :
Code:
$(function(){

   // Liste des nouveaux rangs
   var listNewRank = [
      {
         msgMin: 0,
         msgMax: 20,
         intitule: "Je suis nouveau"
      },
      {
         msgMin: 21,
         msgMax: 50,
         intitule: "Je suis timide"
      },
      {
         msgMin: 51,
         msgMax: 100,
         intitule: "Je prends mes marques"
      },
      {
         msgMin: 101,
         msgMax: 200,
         intitule: "Je me sens bien"
      },
      {
         msgMin: 201,
         msgMax: 0,
         intitule: "Je suis bien installé"
      },
   ];

   // Sous quel label se trouve le nombre de messages ?
   var intituleNbMessage = "Message";

   // on indique la version du forum
   // attention de bien respecter les écritures ci-dessous
   // invision, phpbb2, phpbb3, punbb, modernbb, awesomebb
   var versionForum = 'modernbb';

   switch (versionForum) {
        case 'phpbb2':
            cible = ".postdetails.poster-profile";
            break;

        case 'punbb':
            cible = ".postbody .user";
            break;

        case 'awesomebb':
            cible = ".post-aside";
            break;
       
        /* modernbb, phpbb3, invision */
        default:
            cible = ".postprofile";
            break;
    }

    // Si on est dans un message
   if( $(cible).length ){
      // On parcourt chaque profil
      $(cible).each( function(){
         var $this = $(this),
            nbMessage = 0,
            findNbMsg = false ;
      
         // Dans chaque profil,
         // on parcourt chaque label
         $this.find('.infos-posteur .label').each( function(){
            var $thisLabel = $(this);
            // si le label parcouru est celui des messages
            if( $thisLabel.text().indexOf(intituleNbMessage) > -1){
               // On récupére le nombre de message et on sort de la boucle
               nbMessage = $thisLabel.parent().find('.label + span ').text()*1;
               findNbMsg = true;
            }

            if(findNbMsg){
               return;
            }
         });

         // On parcourt le tableau des nouveaux rangs
         for( var i = 0 ; i < listNewRank.length ; i ++){
            // Si le nombre de messages est supérieur ou également au nombre de messages minimum
            // Et s'il est plus petit ou égale au nombre de messages maximum (ou si ceux-ci sont "l'infini")
            if(nbMessage >= listNewRank[i].msgMin && (nbMessage <= listNewRank[i].msgMax || listNewRank[i].msgMax == 0)){
               // On va remplir le nouveau rang
               $this.find('.new-rank').text(listNewRank[i].intitule);
               break;
            }   
         }

      });
   }

});

Idea Le code est commenté pour que tu puisse le comprendre.

Ce que tu dois modifier

• La liste de tes rangs
Code:
// Liste des nouveaux rangs
   var listNewRank = [
      {
         msgMin: 0,
         msgMax: 20,
         intitule: "Je suis nouveau"
      },
      {
         msgMin: 21,
         msgMax: 50,
         intitule: "Je suis timide"
      },
      {
         msgMin: 51,
         msgMax: 100,
         intitule: "Je prends mes marques"
      },
      {
         msgMin: 101,
         msgMax: 200,
         intitule: "Je me sens bien"
      },
      {
         msgMin: 201,
         msgMax: 0,
         intitule: "Je suis bien installé"
      },
   ];
> msgMin = le nombre de messages minimum pour avoir le rang
> msgMax = le nombre de messages maximum pour avoir le rang
Idea Quand msgMax = 0, cela signifie que le nombre max' de messages n'est pas définie Smile (en gros, ça veut dire plus de msgMin messages)

• Le libellé des messages :
Code:
// Sous quel label se trouve le nombre de messages ?
   var intituleNbMessage = "Message";

• La version de ton forum :
Code:
// on indique la version du forum
   // attention de bien respecter les écritures ci-dessous
   // invision, phpbb2, phpbb3, punbb, modernbb, awesomebb
   var versionForum = 'awesomebb';

C'est tout Smile

Une fois que c'est terminé, on va récupérer l'url du javascript :
Ajouter un second rang en fonction du nombre de messages Codage10
Pour moi, ça sera donc :
Code:
https://miettes.lebonforum.com/38505.js

Une modification de template

Ici ça va être très simple. Quelle que soit la version de ton forum, on va modifier le template "viewtopic_body" (Panneau d'administration > Affichage > Templates > Général).

1) On va remplacer ceci :
Code:
<!-- BEGIN profile_field -->
   {postrow.displayed.profile_field.LABEL}
   {postrow.displayed.profile_field.CONTENT}
   {postrow.displayed.profile_field.SEPARATOR}
<!-- END profile_field -->
par ça :
Code:
<!-- BEGIN profile_field -->
<div class="infos-posteur">
   {postrow.displayed.profile_field.LABEL}
   <span>{postrow.displayed.profile_field.CONTENT}</span>
   {postrow.displayed.profile_field.SEPARATOR}
</div>
<!-- END profile_field -->

Idea Pour awesome
C'est ceci qu'il faut remplacer par la même chose que précédemment :
Code:
<!-- BEGIN profile_field -->
   <dt>{postrow.displayed.profile_field.LABEL}</dt>
    <dd>{postrow.displayed.profile_field.CONTENT}</dd>
<!-- END profile_field -->

2) Ensuite, on va remplacer ça :
Code:
{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
par ça :
Code:
{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
<div class="new-rank"></div>

3) Et pour finir, tout en bas du template, on va ajouter l'appel à notre js :
Code:
<script src="https://miettes.lebonforum.com/38505.js" type="text/javascript"></script>
Idea Evidemment, n'oublie pas de remplacer le lien par le tien Wink

On sauvegarde et on publie.

La CSS

Logiquement, si tu vas sur un message, tu dois avoir ton nouveau rang qui s'affiche. Cela dit, visuellement, ça n'est peut-être pas terrible.

A toi de faire la CSS qui te convient et de la placer dans la feuille de style de ton forum (Panneau d'administration > Affichage > Images et Couleurs > Couleurs >Feuille de style CSS).

Par exemple, voici le style du tutoriel :
Code:

.new-rank{
   color: #444;
   font-size: 11px;
   font-style: italic;
}

.new-rank:before,
.new-rank:after{
   content: "\f005";
    font-family:FontAwesome;
   display: inline-block;
   margin: 0 4px;
}





Si tu rencontres un souci pour personnaliser ou mettre en place ce tutoriel, n'hésite surtout pas à nous demander un coup de pouce Wink



_________________
Fleur'
Fleur'
Informations : J'essaie de passer une fois par semaine
Messages : 450
http://ecofriends.forumactif.com/

Ajouter un second rang en fonction du nombre de messages Empty Re: Ajouter un second rang en fonction du nombre de messages

le Dim 3 Nov 2019 - 13:46
Merci pour le tuto! Bon j'ai quelques soucis depuis donc je vais ouvrir un nouveau sujet lol

Juste par curiosité, est-ce que du coup on pourrait faire un nombre infini de rangs (donc 3 rangs par personne, ou plus)?
Pêpêche
Pêpêche
Mascotte
Messages : 4860

Ajouter un second rang en fonction du nombre de messages Empty Re: Ajouter un second rang en fonction du nombre de messages

le Dim 3 Nov 2019 - 18:54
Coucou Smile

Oh je vais aller voir tes problèmes. Logiquement, oui, même s'il faudrait adapter le js en conséquence (nouveau tableau de rang et nouvelle boucle pour remplir le rang)

_________________
Cerise
Cerise
Informations : Présente en général le matin seulement.
Messages : 689

Ajouter un second rang en fonction du nombre de messages Empty Re: Ajouter un second rang en fonction du nombre de messages

le Lun 4 Nov 2019 - 11:54
Coucou, c'est très intéressant merci pour le tuto. Juste une question, comment on fait si on veut mettre les petites étoiles ou autre comme sur ton exemple?
Pêpêche
Pêpêche
Mascotte
Messages : 4860

Ajouter un second rang en fonction du nombre de messages Empty Re: Ajouter un second rang en fonction du nombre de messages

le Lun 4 Nov 2019 - 13:59

_________________
Cerise
Cerise
Informations : Présente en général le matin seulement.
Messages : 689

Ajouter un second rang en fonction du nombre de messages Empty Re: Ajouter un second rang en fonction du nombre de messages

le Mer 6 Nov 2019 - 14:27
Coucou, ok merci je verrais ça, dans tout les cas merci du partage.
Contenu sponsorisé

Ajouter un second rang en fonction du nombre de messages Empty Re: Ajouter un second rang en fonction du nombre de messages

Revenir en haut
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum



Post-It des Râleuses