Codage (couleur) groupe au dessus des avatars.

[Goukimaster]

Bonjour/bonsoir

en créant mon forum, j'avais deux codeurs, mais ces derniers ont fait ce qu'ils avaient à faire (et ce qu'ils pouvaient) car après tout, c'est du bénévolat. Malheureusement, la vie active nous appellent tous à un moment donné.

Mon soucis, j'ignore s'il est complexe ou non, c'est simplement pour embellir (et rendre logique) certaines choses sur mon forum. C'est un forum rp, comme beaucoup, avec des groupes différents.

Ces groupes sont représentés par une couleur différentes, et si il n'y a aucun problème dans le qeel par exemple, sur la page d'accueil etc... Au dessus des avatars, il y'a une couleur unique pour tous les membres (rouge actuellement)

Image exemple( 1) :

Spoiler:

J'ai entouré en rouge le truc à changer. De fait, je peux le changer dans le CSS, j'ai trouvé la ligne qui correspond ;

Ligne du CSS correspondant au changement de couleur (2) :

Spoiler:

Mais je suis une brêle en codage, je peux dépanner sur des petits trucs, mais la, je suis perdu. J'ai bien essayé plein de trucs de mon coté, mais impossible de faire une couleur différente pour chaque groupe. Je sais qu'il doit manquer des lignes ou des ajouts, mais sans savoir lesquels, c'est difficile de résoudre ce soucis.

Pour info, je voulais "ces" couleurs pour les différents groupes, et que chaque membre étant donc dans l'un des groupes correspondant, ait la couleur correspondant au groupe au dessus de son avatar :

Texte et image (3) :

Spoiler:

Voila, mais je ne sais pas comment faire, s'il manque je sais pas, du javascript ? Un truc à mettre dans les templates ? Je suis prêt à fournir les screens necessaire pour cette demande.

Merci par avance du temps consacré, de la lecture et de l'aide apportée.

[Invité]

Hello Goukimaster,

alors si tous tes membres ont une couleur attribuée par leur groupe distinct, le script suivant devrait fonctionner.

Pour tes prochaines demandes, merci de fournir le template concerné.

C'est plus simple pour les personnes qui te donnent un coup de main .
Alors comme j'ai vu sur ton fofo que le pseudo était dans une div nommée "as_pseudo":

J'ai donc fait l'identique sur mon fofo de tests.

Le script va donc reprendre la couleur du groupe et mettre le background désiré sur cette div.
Toujours dans ce script, tu auras cette variable nommée "colordefaut" qui sera suivi d'une couleur entre
deux doubles guillemets, tu pourras changer le couleur (vert pâle ajoutée) comme bon te semble en respectant les deux doubles guillemets.
Cette couleur de fond servira en cas ou un de tes membres ne rentre par dans un groupe quelconque .
C'est juste une précaution au cas ou....


Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mettre un titre explicite.
Cocher  Sur les sujets

Déposes ceci:

Code:


$(function(){
  //COULEUR DE FOND PAR DEFAUT ENTRE LES GUILLEMETS
var colordefaut="#40A497";
$('.as_pseudo').each(function(){
var color=$(this).find('a[href^="/u"]').find('span').css('color');
if(color){$(this).css('backgroundColor',color);}
else{$(this).css('backgroundColor',colordefaut);}});});



Penses à cliquer sur le bouton VALIDER



Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style



Remplaces:

Code:

* Pseudo */
.as_pseudo {
       background: #fa2f2f;  
       border-radius: 10px;
       padding: 1%;
       text-transform: uppercase;
       font-size: 14px;
       margin: 2% 0 0;
}

.as_pseudo a span strong {
       font-weight: normal;
       color: #e3e3e3;
}

Par:

Code:


/*PSEUDO*/
.as_pseudo {
        
       border-radius: 10px;
       padding: 1%;
       text-transform: uppercase;
       font-size: 14px;
       margin: 2% 0 0;
}

.as_pseudo a[href^="/u"],
.as_pseudo a[href^="/u"] span strong {
       font-weight: normal;
       color: #e3e3e3!important;
}


Penses à cliquer sur le bouton

Attention à tes commentaires dans ta feuille de style:

Mauvais commentaire

Code:

* Pseudo */

Bon commentaire

Code:

/* Pseudo */

Et voilou .

a++

[Goukimaster]

Salut Milouze, merci de ta réponse et de ton aide.

Désolé de pas avoir fournit le template qu'il te fallait, comme je l'ai dis, je suis une brêle en codage et c'était mes codeurs qui s'en occupaient avant.

J'ai suivis tes instructions (de supers instructions btw) et ça marche au poil ! merci encore !

sujet résolu ! Votez milouze !