Personnaliser son forum en fonction des groupes

par **Luzz** Lun 15 Nov 2021 - 9:58

Personnaliser son forum en fonction des groupes

Cette astuce a pour but de vous présenter une option vous permettant de personnaliser l'affichage de votre forum en fonction de votre appartenance à un groupe.

Création du script

Panneau d'administration  Modules  HTML & JAVASCRIPT - Gestion des codes Javascript

Assurez-vous que la gestion des codes Javascript soit activée, puis créez un nouveau javascript ayant pour titre "Personnalisation de l'affichage (groupe)" et pour placement "Sur toutes les pages" (plus d'informations sur la gestion des scripts).

Pour la version PhpBB2

Code:: jQuery(window).load(function() { $('body').append('<div id="groups-perms" style="display:none;"></div>'); $('#groups-perms').load('/groups' + ' .gen', function() { var a = document.getElementById('groups-perms').innerHTML; if (/nom_groupe/i.test(a)) { exécutions }; }); });

N'oubliez pas de cliquer sur le bouton Valider afin de sauvegarder les modifications.

Pour les autres versions

Code:: jQuery(window).load(function() { $('body').append('<div id="groups-perms" style="display:none;"></div>'); $('#groups-perms').load('/groups' + ' .noList', function() { var a = document.getElementById('groups-perms').innerHTML; if (/nom_groupe/i.test(a)) { exécutions }; }); });

N'oubliez pas de cliquer sur le bouton Valider afin de sauvegarder les modifications.

Paramétrage du script

Explication de son fonctionnement

Ce script permet de parcourir la page /groups de votre forum et de vérifier si le membre appartient ou non au groupe désigné par le script. Si ce dernier appartient à un groupe désigné par ledit script alors les exécutions s'appliqueront.

Désignation du groupe

Dans le script donné dans le point 1 de ce tutoriel (en fonction de la version de votre forum), il convient d'indiquer le nom du groupe dans la variable /nom_groupe/. Par exemple, si j'ai un groupe "Membres", je vais donc devoir écrire /Membres/ (en concernant les / de part et d'autre). Pour un forum en PhpBB3, cela donnerait donc :

Code:: jQuery(window).load(function() { $('body').append('<div id="groups-perms" style="display:none;"></div>'); $('#groups-perms').load('/groups' + ' .noList', function() { var a = document.getElementById('groups-perms').innerHTML; if (/Membres/i.test(a)) { exécutions }; }); });

Désignation des exécutions

Il convient maintenant de renseigner les exécutions en fonction de l'appartenance au groupe Membres. Afin d'illustrer les nombreuses possibilités qui s'offrent à vous, nous vous proposons les illustrations ci-dessous.

Afficher un lien dans le menu de la ToolBar

Prenons le contexte suivant : un utilisateur s'est inscrit et sa présentation a été validée par l'administration du forum. Je l'ajoute au groupe "Membres" du forum. Maintenant qu'il est dans ce groupe, je souhaite l'autoriser à accéder au Discord de mon forum. Le lien Discord apparaîtra dans le menu de la ToolBar. Pour un forum en PhpBB 3, le script sera :

Code:: jQuery(window).load(function() { $('body').append('<div id="groups-perms" style="display:none;"></div>'); $('#groups-perms').load('/groups' + ' .noList', function() { var a = document.getElementById('groups-perms').innerHTML; if (/Membres/i.test(a)) { $('#fa_menulist .fa_separator:eq(1)').after('<li><a href="https://lien_de_votre_discord">Accéder à Discord</a></li>'); }; }); });

Remplacez https://lien_de_votre_discord par le lien de votre Discord.

Spoiler:

De cette manière, dès que vous ajoutez un utilisateur dans le groupe "Membres", le lien de votre Discord apparaît dans le menu.

Personnaliser l'affichage d'un élément de votre forum

Prenons le contexte suivant : je souhaite colorer la ToolBar en fonction de la couleur du groupe "Membres". Sur un forum en PhpBB3, le script sera :

Code:: jQuery(window).load(function() { $('body').append('<div id="groups-perms" style="display:none;"></div>'); $('#groups-perms').load('/groups' + ' .noList', function() { var a = document.getElementById('groups-perms').innerHTML; if (/Membres/i.test(a)) { $('#fa_toolbar').css('background-color','Code_hexadécimal'); }; }); });

Remplacez Code_hexadécimal par le code couleur souhaité (par exemple #EF3333).

Voir illustration :