AwesomeBB : Couleur différentes aux catégorie

[*Splash*]

Hi,

Par défaut la couleur des catégories du forum est de couleur bleu, on peut modifier cette couleur par le PA mais cette couleur se répercute à toutes les catégories
comment faire pour affecter une couleur différente à chaque catégories ?

[Invité]

Hello *Splash*,

tu peux utiliser ce script a condition que toutes les catégories soient visibles pour tout le monde.


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

Mets un titre explicite.
Coches sur l'index.


Déposes ceci:

Code:


$(function(){
$( "div.forum.forum.type-table-forum .forum-header").attr( "id", function(div) {
return "M14_CAT_" +div;})});



Penses à cliquer sur le bouton VALIDER

Le script va générer un identifiant pour chaque class forum-header ( ce que tu souhaites )que tu pourras personnaliser.
Ta première catégorie auras cet Identifiant:

Code:

#M14_CAT_0.forum-header

La deuxième:

Code:

#M14_CAT_1.forum-header

La troisième:

Code:

#M14_CAT_2.forum-header

Etc etc

Ensuite, la css pour la première catégorie afin de mettre une couleur de fond et
mettre la couleur associée au titre de cette dernière et aussi au texte "Derniers Messages" .

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

Ajoutes ceci:

Code:


/*DEBUT PREMIERE CATEGORIE*/
#M14_CAT_0.forum-header
{
background-color:green;
}
#M14_CAT_0.forum-header  span
{
color:orange;
}
/*FIN PREMIERE CATEGORIE*/


Penses à cliquer sur le bouton

A toi de jouer et ne me dis pas que c'est nul .

a++

[Victor-57]

Hey,

Le code fonctionne uniquement si toutes les catégories sont visibles ? Pas moyen de changer ça ?

Merci d'avance !

[Invité]

Hello Victor-57,

il serait plus judicieux de poster un nouveau sujet afin de retrouver facilement un sujet lors d'une recherche .


Le script suivant est plus sûr pour avoir l'apparence suivant la catégorie:

Code:



$(function(){
//PREMIERE CATEGORIE 5 (changes le texte TITRE DE LA CATEGORIE 1 )
$('h2.category-title span:contains("TITRE DE LA CATEGORIE 1")').closest('div').attr('id','M14_CAT_0');
//DEUXIEME CATEGORIE (changes le texte TITRE DE LA CATEGORIE 2 )
$('h2.category-title span:contains("TITRE DE LA CATEGORIE 2")').closest('div').attr('id','M14_CAT_1');
//TROISIEME CATEGORIE (changes le texte TITRE DE LA CATEGORIE 3 )
$('h2.category-title span:contains("TITRE DE LA CATEGORIE 3")').closest('div').attr('id','M14_CAT_2');
//QUATRIEME CATEGORIE (changes le texte TITRE DE LA CATEGORIE 4 )
$('h2.category-title span:contains("TITRE DE LA CATEGORIE 4")').closest('div').attr('id','M14_CAT_3');
});


Je t'ai donné 4 lignes (donc 4 catégories) .

Chaque ligne interprétée ainsi:

Exemple avec la première catégorie:

Code:


//PREMIERE CATEGORIE 5 (changes le texte TITRE DE LA CATEGORIE 1 )
$('h2.category-title span:contains("TITRE DE LA CATEGORIE 1")').closest('div').attr('id','M14_CAT_0');


La première ligne est un commentaire tu pourras les supprimer, ce qui t’intéresse c'est ceci:

Code:

("TITRE DE LA CATEGORIE 1")'

Il faudra remplacer "TITRE DE LA CATEGORIE 1" par le texte de ta catégorie    ,
la css ne change pas    .

a++

[*Splash*]

Merci Milouze, c'est OK