,l'astuce n'est pas de moi , mais je trouvais que ce tutoriel était vraiment très utile
pour vous en faire part
.La source
En fait , le tutoriel donne une icône ou une couleur ou même les deux si besoin ,
pour afficher soit que le membre fait parti du groupe bla ou simplement dire que ce membre
a reçu un avertissement
, à vous de faire la part des choseset de vous laisser aller à votre imagination
.On part du principe que le membre "milouze" a fait une grosse bêtise et que je l'ai sanctionné ,
on verra alors sur tout le forum quelque soit l'emplacement ceci:
L'aperçu imagé sur l'index:
![[PHPBB2] Mettez une icône ou une couleur à un membre choisi 119](https://servimg.com/r/3811262137/119.png)
Il aura une couleur rouge et une icône signalant un problème
Pour groupe "Photoshop" par exemple , on pourra avoir cette apparence:
L'aperçu imagé sur l'index:
![[PHPBB2] Mettez une icône ou une couleur à un membre choisi 214](https://servimg.com/r/3811262137/214.png)
Il y aura une couleur blanche avec l'icône Photoshop .
On va commencer par créer un javascript :
Modules/HTML JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur toutes les pages.
Collez ceci
Code:
jQuery(document).ready(function(){
jQuery("a:contains('Le Pseudo du membre')").wrapInner(jQuery('<span class="Membre1"></span>'));
});
Remplacez "Le Pseudo du membre" par le pseudo désiré .
Le Javacript contient seulement un membre
,pour en rajouter un autre et ainsi de suite,
il suffira d'ajouter ceci:
Code:
jQuery("a:contains('Le Pseudo du membre')").wrapInner(jQuery('<span class="Membre2"></span>')); Ce qui donnera:
Code:
jQuery(document).ready(function(){
jQuery("a:contains('Le Pseudo du membre')").wrapInner(jQuery('<span class="Membre1"></span>'));
jQuery("a:contains('Le Pseudo du membre')").wrapInner(jQuery('<span class="Membre2"></span>'));
});
Pour cinq membres , le Javscript sera comme ceci:
Code:
jQuery(document).ready(function(){
jQuery("a:contains('Le Pseudo du membre')").wrapInner(jQuery('<span class="Membre1"></span>'));
jQuery("a:contains('Le Pseudo du membre')").wrapInner(jQuery('<span class="Membre2"></span>'));
jQuery("a:contains('Le Pseudo du membre')").wrapInner(jQuery('<span class="Membre3"></span>'));
jQuery("a:contains('Le Pseudo du membre')").wrapInner(jQuery('<span class="Membre4"></span>'));
jQuery("a:contains('Le Pseudo du membre')").wrapInner(jQuery('<span class="Membre5"></span>'));
});
Pensez a cliquer sur le bouton
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
collez ceci :
Code:
.Membre1
{
color: #ED1254; /*La couleur de police*/
padding-right: 21px; /*ne pas toucher*/
background: transparent url('LIEN DE L IMAGE') no-repeat center right;
}
.Membre2
{
color:#ffffff; /*La couleur de police*/
padding-right: 21px; /*ne pas toucher*/
background: transparent url('LIEN DE L IMAGE') no-repeat center right;
}
Pour avoir un effet sympa , l'icône ne devra pas dépasser la taille de 16px
Pensez à valider les modifications en cliquant sur le bouton
Dernière édition par Milouze14 le Lun 29 Nov 2021 - 7:30, édité 5 fois
![[PHPBB2] Mettez une icône ou une couleur à un membre choisi Ane10](https://i.servimg.com/u/f33/09/00/16/63/ane10.gif)
![[PHPBB2] Mettez une icône ou une couleur à un membre choisi Eno-et10](https://i.servimg.com/u/f34/12/09/44/47/eno-et10.gif)
