Système de récompenses (Awards)

[Chacha]

Système de récompenses (Awards)

Le système de récompenses (awards) permet de récompenser l'engagement des membres de votre communauté en leur attribuant un (ou plusieurs) badges qui s'afficheront sur leur profil et / ou message (sujets). Vous pouvez ainsi créer jusqu'à 250 badges ! Voir illustration : Paramétrer le système de récompenses Panneau d'administration  Utilisateurs & Groupes - Administration des récompenses Voir illustration : Afficher les récompenses des membres dans les sujets : si l'option est cochée sur OUI, les récompenses seront affichées dans le profil des membres lors de la publication d'un message : Voir illustration : Afficher les récompenses non obtenues dans le profil des utilisateurs : si l'option est cochée sur OUI, les récompenses non obtenues seront affichées dans la catégories "récompenses non obtenues", grisées, dans l'onglet Récompenses. Chaque utilisateur pourra ainsi visualiser les récompenses qu'il lui reste à obtenir.A noter que cette option ne fonctionne que si le profil avancé est activé. Voir illustration : N'oubliez pas de cliquer sur le bouton afin de sauvegarder vos modifications. Créer une récompense Panneau d'administration  Utilisateurs & Groupes - Administration des récompenses Afin de créer une récompense, il vous suffit de cliquer sur le bouton "AJOUTER UNE RÉCOMPENSE". Titre de la récompense : permet de donner un titre à votre récompense. Veillez à choisir un titre évocateur eu égard à la récompense car il sera affiché publiquement dans le profil et/ou sur les messages du membre lorsque ce dernier obtiendra ladite récompense. La limite est de 70 caractères. Description de la récompense : permet d'afficher une description afin d'expliquer la raison pour laquelle le membre a reçu la récompense. Si la description est renseignée, elle s'affichera publiquement dans le profil et/ou sur les messages du membre lorsque ce dernier obtiendra ladite récompense. La limite est de 255 caractères. Badge : permet de renseigner le lien de l'image du badge. Un bouton relié à Servimg permet de faciliter et de garantir l'hébergement de votre image. La limite est de 255 caractères. Message de félicitations : permet de personnaliser un message qui s'affichera dans une notification envoyée au membre recevant la récompense. Par défaut, Forumactif vous propose la phrase "Félicitations, vous avez gagné cette récompense !". La limite est de 100 caractères. Voir illustration :  Afin d'éviter le spam intempestif, aucune notification n'est envoyée lors de la création d'une récompense dont l'attribution est automatique. Autrement dit, seuls les membres atteignant la valeur désignée par la récompense après sa mise en place recevront la notification. Pour les autres, la récompense sera assignée sans notification. Classe CSS personnalisée : permet d'attribuer une classe CSS personnalisée pour personnaliser l'affichage de la récompense. Vous pouvez paramétrer la classe à partir de votre feuille de style CSS. La limite est de 45 caractères. Choix de réalisation : Choix de la réalisation (critère) Valeur à atteindre (objectif) Attribution manuelle Action à réaliser par un administrateur Durée d'inscription au forum (en mois) Nombre de mois Durée d'inscription au forum (en année) Nombre d'années Nombre de messages publiés (messages et commentaires) Nombre de messages publiés Nombre de points obtenus Nombre de points Nombre de sujets créés Nombre de sujets créés Nombre de sujets dans lesquels le membre a participé Nombre de sujets participés Nombre d'évènements créés Nombre d'évènements Nombre d'amis (demande acceptée) Nombre d'amis acceptés Nombre de messages aimés par le membre Nombre de messages aimés Nombre de réactions "J'aime" reçus sur les messages du membre Nombre de messages aimés reçus Nombre de groupes rejoints Nombre de groupes rejoints N'oubliez pas de cliquer sur le bouton afin de sauvegarder vos modifications. Gérer les récompenses Visualiser les récompenses Panneau d'administration  Utilisateurs & Groupes - Administration des récompenses L'ensemble des récompenses est affiché sur la page d'administration des récompenses. Les récompenses sont classées par catégorie de réalisation. Voir illustration : En cliquant sur la croix verte ( ) affiliée à une catégorie, vous pouvez directement créer une récompense en lien avec cette dernière ; En cliquant sur le chevron  , vous pouvez afficher les paramètres des différentes réalisations (titre, nombre de personnes ayant obtenu la récompense, la description ainsi que la valeur à atteindre (objectif). De plus, vous avez la possibilité d'éditer la récompense en cliquant sur la roue crantée ( ) ou supprimer la récompense en cliquant sur la croix rouge ( ). Cliquez sur le chevron  pour rétablir l'affichage simplifiée ; En cliquant sur le bouton TRIER, vous avez la possibilité de déplacer les différentes catégories à votre convenance. Veillez à cliquer ensuite sur le bouton enregistrer afin de sauvegarder vos modifications. Editer une récompense Pour éditer une récompense, il vous suffit de cliquer sur l'image de cette dernière : Voir illustration : Dans le cas où vous avez cliqué sur le chevron , il suffit de cliquer sur la roue crantée ( ) correspondant à la récompense. Supprimer une récompense Pour supprimer une récompense, il convient de cliquer sur le chevron  et de cliquer sur la croix rouge ( ) correspond à la récompense. Attention, aucune confirmation n'est demandée, la suppression est immédiatement effective ! Administrer les récompenses Via l'administration des récompenses Panneau d'administration  Utilisateurs & Groupes - Administration des récompenses En cliquant sur la roue crantée ( ) correspondant à une récompense, vous avez la possibilité d'ajouter et retirer manuellement la récompense d'un membre. Voir illustration : A noter que l'ajout d'un membre envoie automatiquement une notification l'informant qu'il a obtenu ladite récompense.

Ce tutoriel a été rédigé par Bipo, avec l'aide de Dundee33 (novembre 2021). Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.

[Chacha]

Système de récompenses (Awards) - Modifications des templates

 Pour les forums ayant des templates modifiés avant le 9 novembre 2021 Afin que le système de récompenses fonctionne de façon optimale sur le forum, les administrateurs ayant personnalisé l'un des templates profile_add_body, profile_view_body, viewcomments_bodyet viewtopic_body doivent prendre en considération les modifications ci-dessous. Seul le fondateur du forum est habilité à en modifier les templates.  Si vous ne voyez pas de template viewcomments_body dans votre liste de templates, c’est que vous n’utilisez pas le module Blog et ne l’avez pas activé dans votre Panneau d'administration. Dans ce cas, aucun changement n'est nécessaire. Sommaire : Modifications à apporter sur les templates pour les forums en version PhpBB2 ; Modifications à apporter sur les templates pour les forums en version PhpBB3 ; Modifications à apporter sur les templates pour les forums en version PunBB ; Modifications à apporter sur les templates pour les forums en version Invision ; Modifications à apporter sur les templates pour les forums en version ModernBB ; Modifications à apporter sur les templates pour les forums en version AwesomeBB . Modifications à effectuer sur la version PhpBB2 Modification du template profile_add_body Panneau d'administration  Affichage  Templates - Profil - profile_add_body Après : Code: <!-- END switch_profile_fields --> Ajoutez : Code: <!-- BEGIN switch_awards -->  <tr>  <th colspan="2">{switch_informations_menu.switch_awards.L_AWARDS}</th>  </tr>  <tr>  <td id="list_awards" class="catBottom" colspan="2" style="background-image: none; text-align: center">{switch_informations_menu.switch_awards.AWARDS_LIST}</td>  </tr>  <tr>  <td class="catBottom" colspan="2" style="text-align: center">  <input id="awards_order" type="hidden" name="awards_order" value="" />  <input style="cursor: pointer" id="sort_awards" class="liteoption" type="button" name="order" value="{switch_informations_menu.switch_awards.L_SORT}" />  </td>  </tr>  {switch_informations_menu.switch_awards.SCRIPT_SORT_AWARDS}  <!-- END switch_awards --> Modification du template profile_view_body Panneau d'administration  Affichage  Templates - Profil - profile_view_body Avant : Code: <tr>  <td class="catLeft" align="center" height="28"><b><span class="gen">{L_CONTACT} {USERNAME}</span></b></td>  </tr> Ajoutez : Code: <!-- BEGIN switch_awards -->  <tr>  <td class="catLeft" align="center" height="28"><b><span class="gen">{switch_awards.L_AWARDS}</span></b></td>  </tr>  <tr>  <td class="row1 awards_block_simple_wrapper" valign="top">  <table width="100%" border="0" cellspacing="1" cellpadding="0">  <tr>  <td class="awards_block_simple"><span class="gen"><strong>{switch_awards.AWARDS_LIST}</strong></span></td>  </tr>  </table>  </td>  </tr>  <!-- END switch_awards --> Modification du template viewtopic_body Panneau d'administration  Affichage  Templates - Général - viewtopic_body Après : Code: {postrow.displayed.POSTER_RANK}<br />  {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}<br /><br /> Ajoutez : Code: <div {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}">{postrow.displayed.AWARDS}</div>  <div class="award_more"></div>  <br> Modification du template viewcomments_body Panneau d'administration  Affichage  Templates - Général - viewcomments_body Après : Code: {postrow.displayed.POSTER_RANK}<br />  {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}<br /><br /> Ajoutez : Code: <div {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}">{postrow.displayed.AWARDS}</div>  <div class="award_more"></div>  <br> Modifications à effectuer sur la version PhpBB3 Modification du template profile_add_body Panneau d'administration  Affichage  Templates - Profil - profile_add_body Après : Code: <!-- END switch_profile_fields --> Ajoutez : Code: <!-- BEGIN switch_awards -->  <h1 class="page-title">{switch_informations_menu.switch_awards.L_AWARDS}</h1>  <div class="panel">  <div class="inner"><span class="corners-top"><span></span></span></div>  <fieldset>  <dl>  <dt id="list_awards" style="width: 100%; text-align: center">{switch_informations_menu.switch_awards.AWARDS_LIST}</dt>  </dl>  <dl>  <dt style="width: 100%; text-align: center">  <input id="awards_order" type="hidden" name="awards_order" value="" />  <input style="cursor: pointer" id="sort_awards" class="button1" type="button" name="order" value="{switch_informations_menu.switch_awards.L_SORT}" />  </dt>  </dl>  </fieldset>  <div class="inner"><span class="corners-bottom"><span></span></span></div>  </div>                 {switch_informations_menu.switch_awards.SCRIPT_SORT_AWARDS}  <!-- END switch_awards --> Modification du template profile_view_body Panneau d'administration  Affichage  Templates - Profil - profile_view_body Après : Code: <!-- BEGIN switch_auth_user -->  <dl class="left-box details" style="width: 80%;margin-top:10px;margin-bottom:10px">  <dt>{L_ADMINISTRATE_USER}:</dt><dd><strong>{ADMINISTRATE_USER}{BAN_USER}</strong></dd>  </dl>  <!-- END switch_auth_user --> Ajoutez : Code: <!-- BEGIN switch_awards -->  <div class="awards_block_simple_wrapper" style="float: left; width: 100%;">  <div class="h3">{switch_awards.L_AWARDS}</div>  <div class="awards_block_simple">{switch_awards.AWARDS_LIST}</div>  </div>  <!-- END switch_awards --> Modification du template viewtopic_body Panneau d'administration  Affichage  Templates - Général - viewtopic_body Après : Code: <br /><strong style="font-size:1.2em">{postrow.displayed.POSTER_NAME}</strong>  </dt>  <dd>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</dd> Ajoutez : Code: <dd {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}">                         {postrow.displayed.AWARDS}  </dd>  <dd class="award_more"></dd> Modification du template viewcomments_body Panneau d'administration  Affichage  Templates - Général - viewcomments_body Après : Code: <br /><strong style="font-size:1.2em">{postrow.displayed.POSTER_NAME}</strong>  </dt>  <dd>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</dd> Ajoutez : Code: <dd {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}">                         {postrow.displayed.AWARDS}  </dd>  <dd class="award_more"></dd> Modifications à effectuer sur la version PunBB Modification du template profile_add_body Panneau d'administration  Affichage  Templates - Profil - profile_add_body Après : Code:         </fieldset>         <!-- END switch_profile_fields --> Ajoutez : Code:         <!-- BEGIN switch_awards -->         <fieldset>             <div class="main-head"><div class="subtitle">{switch_informations_menu.switch_awards.L_AWARDS}</div></div>             <div class="main-content frm">               <dl>                   <dt id="list_awards" style="width: 100%; text-align: center">{switch_informations_menu.switch_awards.AWARDS_LIST}</dt>               </dl>               <dl>                   <dt style="width: 100%; text-align: center">                     <input id="awards_order" type="hidden" name="awards_order" value="" />                     <input style="cursor: pointer" id="sort_awards" class="button2" type="button" name="order" value="{switch_informations_menu.switch_awards.L_SORT}" />                   </dt>               </dl>             </div>         </fieldset>             {switch_informations_menu.switch_awards.SCRIPT_SORT_AWARDS}         <!-- END switch_awards --> Modification du template profile_view_body Panneau d'administration  Affichage  Templates - Profil - profile_view_body Après : Code:               <br />&nbsp;- <a rel="nofollow" href="/spa/{PUSERNAME}">{L_POSTS}</a><!-- END profil_type_user_posts --></dd>         </dl>         <!-- END profile_field -- Ajoutez : Code:         <!-- BEGIN switch_awards -->         <div class="sub-head"><h2>{switch_awards.L_AWARDS}</h2></div>         <div class="awards_block_simple">{switch_awards.AWARDS_LIST}</div>         <!-- END switch_awards --> Modification du template viewtopic_body Panneau d'administration  Affichage  Templates - Général - viewtopic_body Après : Code:                           {postrow.displayed.POSTER_AVATAR}<br />                           {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}                         </div> Ajoutez : Code:                         <div {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}" >                                     {postrow.displayed.AWARDS}                         </div>                         <div class="award_more"></div><br> Modification du template viewcomments_body Panneau d'administration  Affichage  Templates - Général - viewcomments_body Après : Code:                           {postrow.displayed.POSTER_AVATAR}<br />                           {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE} Ajoutez : Code:                           <div {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}" >                                         {postrow.displayed.AWARDS}                           </div>                           <div class="award_more"></div><br> Modifications à effectuer sur la version Invision Modification du template profile_add_body Panneau d'administration  Affichage  Templates - Profil - profile_add_body Après : Code:         </fieldset>         <!-- END switch_profile_fields --> Ajoutez : Code:         <!-- BEGIN switch_awards -->         <div class="subtitle cleared"><h3>{switch_informations_menu.switch_awards.L_AWARDS}</h3></div>         <div class="panel">             <fieldset>               <dl>                   <dt id="list_awards" style="width: 100%; text-align: center">{switch_informations_menu.switch_awards.AWARDS_LIST}</dt>               </dl>               <dl>                   <dt style="width: 100%; text-align: center">                     <input id="awards_order" type="hidden" name="awards_order" value="" />                     <input style="cursor: pointer" id="sort_awards" class="button" type="button" name="order" value="{switch_informations_menu.switch_awards.L_SORT}" />                   </dt>               </dl>             </fieldset>         </div>             {switch_informations_menu.switch_awards.SCRIPT_SORT_AWARDS}         <!-- END switch_awards --> Modification du template profile_view_body Panneau d'administration  Affichage  Templates - Profil - profile_view_body Après : Code:             {FRIENDSFOES}             <br />             <!-- END switch_allow_friendsfoes --> Ajoutez : Code:             <!-- BEGIN switch_awards -->             <dl class="left-box details" style="margin-top: 10px">               <dt class="subtitle">{switch_awards.L_AWARDS} : </dt><dd class="awards_block_simple">{switch_awards.AWARDS_LIST}</dd>             </dl>             <br>             <!-- END switch_awards --> Modification du template viewtopic_body Panneau d'administration  Affichage  Templates - Général - viewtopic_body Après : Code:                     {postrow.displayed.POSTER_NAME}                   </dt>                   <dd>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</dd> Ajoutez : Code:                   <dd {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}">                             {postrow.displayed.AWARDS}                   </dd>                   <dd class="award_more"></dd><br> Modification du template viewcomments_body Panneau d'administration  Affichage  Templates - Général - viewcomments_body Après : Code:                     {postrow.displayed.POSTER_NAME}                   </dt>                   <dd>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</dd> Ajoutez : Code:                   <dd {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}">                             {postrow.displayed.AWARDS}                   </dd>                   <dd class="award_more"></dd> Modifications à effectuer sur la version ModernBB Modification du template profile_add_body Panneau d'administration  Affichage  Templates - Profil - profile_add_body Après : Code:               <span class="corners-bottom"><span></span></span></div>             </div>             <!-- END switch_profile_fields --> Ajoutez : Code:             <!-- BEGIN switch_awards -->             <h1 class="page-title">{switch_informations_menu.switch_awards.L_AWARDS}</h1>             <div class="panel" style="overflow: visible">               <div class="inner"><span class="corners-top"><span></span></span></div>               <fieldset>                   <dl>                     <dt id="list_awards" style="width: 100%; text-align: center">{switch_informations_menu.switch_awards.AWARDS_LIST}</dt>                   </dl>                   <dl>                     <dt style="width: 100%; text-align: center">                         <input id="awards_order" type="hidden" name="awards_order" value="" />                         <input style="cursor: pointer" id="sort_awards" class="button1" type="button" name="order" value="{switch_informations_menu.switch_awards.L_SORT}" />                     </dt>                   </dl>               </fieldset>               <div class="inner"><span class="corners-bottom"><span></span></span></div>             </div>                 {switch_informations_menu.switch_awards.SCRIPT_SORT_AWARDS}             <!-- END switch_awards --> Modification du template profile_view_body Panneau d'administration  Affichage  Templates - Profil - profile_view_body Après : Code:       <!-- BEGIN switch_auth_user -->       <dl class="left-box details" style="width: 80%;margin-top:10px;margin-bottom:10px">         <dt>{L_ADMINISTRATE_USER}:</dt><dd><strong>{ADMINISTRATE_USER}{BAN_USER}</strong></dd>       </dl>       <!-- END switch_auth_user --> Ajoutez : Code:       <!-- BEGIN switch_awards -->       <div class="awards_block_simple_wrapper">         <div class="h3">{switch_awards.L_AWARDS}</div>         <div class="awards_block simple">{switch_awards.AWARDS_LIST}</div>       </div>       <!-- END switch_awards --> Modification du template viewtopic_body Panneau d'administration  Affichage  Templates - Général - viewtopic_body Après : Code:                   <div class="postprofile-rank">                     {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE} Ajoutez : Code:                     <div {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}">                                 {postrow.displayed.AWARDS}                     </div>                     <div class="award_more"></div> Modification du template viewcomments_body Panneau d'administration  Affichage  Templates - Général - viewcomments_body Après : Code:                   <div class="postprofile-rank">                     {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE} Ajoutez : Code:                     <div {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION}">                                 {postrow.displayed.AWARDS}                     </div>                     <div class="award_more"></div> Modifications à effectuer sur la version AwesomeBB Modification du template profile_add_body Panneau d'administration  Affichage  Templates - Profil - profile_add_body Après : Code:                   <!-- END switch_unsubscribe_allowed -->                 </div>             </div>             <!-- END switch_register_not_display --> Ajoutez : Code: <!-- BEGIN switch_awards -->  <div class="block">  <div class="block-header">{switch_informations_menu.switch_awards.L_AWARDS}</div>  <div class="block-content">  <div id="list_awards" style="text-align: center">{switch_informations_menu.switch_awards.AWARDS_LIST}</div>  <div class="center">  <input id="awards_order" type="hidden" name="awards_order" value="" />  <input style="cursor: pointer" id="sort_awards" class="button1" type="button" name="order" value="{switch_informations_menu.switch_awards.L_SORT}" />  </div>  </div>  </div>             {switch_informations_menu.switch_awards.SCRIPT_SORT_AWARDS}  <!-- END switch_awards --> Modification du template profile_view_body Panneau d'administration  Affichage  Templates - Profil - profile_view_body Après : Code:           <!-- BEGIN switch_allow_friendsfoes -->             {FRIENDSFOES}             <!-- END switch_allow_friendsfoes -->         </div>     </div> Ajoutez : Code:   <!-- BEGIN switch_awards -->     <div class="block awards_module">         <div class="block-header">             {switch_awards.L_AWARDS}         </div>         <div class="block-content" style="text-align: center">             {switch_awards.AWARDS_LIST}         </div>     </div>     <!-- END switch_awards --> Puis, remplacez : Code:   $(document).ready(function() {         var sidebar = $('#sidebar-left'),             top_position_window = $(window).scrollTop(),             top_position_sidebar = sidebar.offset().top;           function stickySidebar() {             top_position_window = $(window).scrollTop();               if ((top_position_window + 86) > top_position_sidebar) {                 sidebar.addClass('sticky');             } else {                 sidebar.removeClass('sticky');             }         }           stickySidebar();           $(window).on('scroll', function() {             stickySidebar();         });     }); Par : Code:   $(document).ready(function() {         var sidebar = $('#sidebar-left'),             footer = $('#page-footer'),             top_position_window = $(window).scrollTop(),             top_position_sidebar = sidebar.offset().top,             height_sidebar = sidebar.height(),             top_position_footer = footer.offset().top;           function stickySidebar() {             top_position_window = $(window).scrollTop();               if ((top_position_window + height_sidebar + 86) > top_position_footer) {                 sidebar.addClass('absolute_bottom');                 sidebar.removeClass('sticky');             }             else if ((top_position_window + 86) > top_position_sidebar) {                 sidebar.addClass('sticky');                 sidebar.removeClass('absolute_bottom');             } else {                 sidebar.removeClass('sticky');                 sidebar.removeClass('absolute_bottom');             }         }           stickySidebar();           $(window).on('scroll', function() {             stickySidebar();         });     }); Modification du template viewtopic_body Panneau d'administration  Affichage  Templates - Général - viewtopic_body Après : Code:                                   <div class="avatar-big">                                         {postrow.displayed.POSTER_AVATAR}                                     </div>                                 </div> Ajoutez : Code: <div {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION} box-body">                                     {postrow.displayed.AWARDS}  </div>  <div class="award_more box-body"></div>  <br>

Ce tutoriel a été rédigé par le Staff du Forum des Forums, Et en particulier par Luzz, en coopération avec Bipo. Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.