Gérer une couleur de fond par catégorie
Résolu lynayanami Messages postés 34 Date d'inscription Statut Membre Dernière intervention -
elgazar Messages postés 5841 Date d'inscription Statut Membre Dernière intervention - 26 mai 2014 à 18:22
elgazar Messages postés 5841 Date d'inscription Statut Membre Dernière intervention - 26 mai 2014 à 18:22
A voir également:
- Dans le code de cette page web modifiez la couleur de fond de la classe
- Code ascii - Guide
- Impossible de supprimer une page word - Guide
- Code de déverrouillage oublié - Guide
- Fond de page word - Guide
- Suivi de modification word - Guide
12 réponses
tu tes compliques la vie, il faut utiliser les marqueurs conditionnels de wordpress et afficher la couleur de fond selon la catégorie affiché.
Copie ce code avant la balise <body> dans le fichier header.php du thème que tu utilises
maintenant ouvre le fichier css et ajoute ces lignes
Petites explications, le premier code dit que si c'est la catégorie 10 qui est affichée, la balise body aura l'id rouge (elle recherchera donc #rouge dans ton css), si c'est la catégorie 20, l'id de la balise body deviendra noir et pour toutes les autres catégories l'id est blanc.
Pour avoir autant de couleurs que de catégories, il suffit d'ajouter un
Pour trouver l'iddes catégories, il suffit d'aller articles=>catégories et de er le curseur sur le nom d'une catégorie, l'id apparaitra en bas de la page
Copie ce code avant la balise <body> dans le fichier header.php du thème que tu utilises
<?php if(is_category('10') ):
$bg=rouge;
elseif (is_category('20') ):
$bg=noir;
else :
$bg=blanc;
endif; " <?php body_class(); ?>>
maintenant ouvre le fichier css et ajoute ces lignes
et c'est tout!!!
#rouge { background: #ff0000; }
#bleu{ background: #000; }
#blanc { background: #fff ; }
Petites explications, le premier code dit que si c'est la catégorie 10 qui est affichée, la balise body aura l'id rouge (elle recherchera donc #rouge dans ton css), si c'est la catégorie 20, l'id de la balise body deviendra noir et pour toutes les autres catégories l'id est blanc.
Pour avoir autant de couleurs que de catégories, il suffit d'ajouter un
elseif (is_category('lacategoriedetonchoix') ):puis d'ajouter l'entrée correspondante dans le fichier css
$bg=la couleurdetonchoix;
Pour trouver l'iddes catégories, il suffit d'aller articles=>catégories et de er le curseur sur le nom d'une catégorie, l'id apparaitra en bas de la page
Bonjour elzagar,
Merci beaucoup pour ta réponse mais je me trouve avec le même problème que précédemment : le fond est changé mais pas de manière aussi propre que quand je le fais directement dans Wordpress : je n'ai plus de marge entre ma page centrale et mon fond, et il reste un bandeau blanc en haut.
Voir ici : http://www.cuisiner-simple.fr/category/les-entrees-ou-aperitifs-sales
Donc ce que je voudrais c'est apprendre à gérer ces marges dans les styles, car là c'est pas joli joli :)
Merci beaucoup pour ta réponse mais je me trouve avec le même problème que précédemment : le fond est changé mais pas de manière aussi propre que quand je le fais directement dans Wordpress : je n'ai plus de marge entre ma page centrale et mon fond, et il reste un bandeau blanc en haut.
Voir ici : http://www.cuisiner-simple.fr/category/les-entrees-ou-aperitifs-sales
Donc ce que je voudrais c'est apprendre à gérer ces marges dans les styles, car là c'est pas joli joli :)
tu n'a pas de marge sur ton contenu, tu as juste l'impression qu'il y en a une quand tu as un fond blanc donc tu dois la mettre dans la div qui contient tout ton contenu, même chose pour le haut normalement le header est collé en haut donc soit tu as une div vide (mais qui a toujours une hauteur minimum) soit tu as un margin-top (ou un padding-top pour la div header) qui provoque ce décalage et l'apparition du fond blanc central
En fait je viens de regarder rapidement et je ne sais pas ce que tu as fait mais tu as surement mal bidouillé les codes css car sur mon wordpress de test, j'ai bien une marge interne et pas d'espace en haut.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question Non je n'ai rien bidouillé d'autre, je débute et c'est une des premières choses que j'ai commencé à "bidouiller" :)
J'utilise un thème enfant histoire de ne pas casser le thème principal, peut-être y a t-il d'autres éléments à reprendre ?
J'utilise un thème enfant histoire de ne pas casser le thème principal, peut-être y a t-il d'autres éléments à reprendre ?
je suis arrivé a reproduire ce que tu veux sans faire de thème enfant , sans toucher aux css existantes et en seulement quelques secondes de bidouille.
Utilise simplement le thème twentytwelve et suis le tuto
étape 1 : on va faire er le menu horizontal sous ton image, ouvre le fichier index.php, , copie depuis < nav> jusqu'à </nav>, et mets les juste avant la balise </header> puis efface les anciennes lignes au dessus de l'image qui ne servent plus à rien
Maintenant tu as logiquement le nom de ton site et sa description puis l'image et enfin le menu horizontal
etape 2 : tu mets le code pour les couleurs par catégories
étape 3 : si tu utilises les mises a jour automatiques je te conseille de renommer le dossier twentytwelve puis de renommer le theme name qui apparait dans le fichier style.css puis d'activer a nouveau le thème cela évitera ainsi les mises a jour automatique qui te ferais perdre toutes les modifications
etape 4 tu as plus qu'a irer ton site
Utilise simplement le thème twentytwelve et suis le tuto
étape 1 : on va faire er le menu horizontal sous ton image, ouvre le fichier index.php, , copie depuis < nav> jusqu'à </nav>, et mets les juste avant la balise </header> puis efface les anciennes lignes au dessus de l'image qui ne servent plus à rien
Maintenant tu as logiquement le nom de ton site et sa description puis l'image et enfin le menu horizontal
etape 2 : tu mets le code pour les couleurs par catégories
étape 3 : si tu utilises les mises a jour automatiques je te conseille de renommer le dossier twentytwelve puis de renommer le theme name qui apparait dans le fichier style.css puis d'activer a nouveau le thème cela évitera ainsi les mises a jour automatique qui te ferais perdre toutes les modifications
etape 4 tu as plus qu'a irer ton site
C'est peut-être dans mon thème qu'il y a un problème : je n'ai pas de balise <nav> dans le fichier index.php, seulement ceci :
<?php twentytwelve_content_nav( 'nav-below' ); ?>
<?php twentytwelve_content_nav( 'nav-below' ); ?>
Alors en attendant j'avais trouvé une solution alternative il faut comme tu le dis er par le thème en ligne et là j'ai déclaré un fond. Et grâce au code que tu m'as donné ce fond peut ensuite être remplacé.
Voilà, mille mercis !
Voilà, mille mercis !
après rien ne t'empêche de mettre une image gridée pour encore mieux symboliser les continents au lieu de mettre un simple aplat de couleur, il suffit de mettre les css correspondants dans les div rouge, bleu, etc
exemple d'image gridée : casimages.com/img.php?i=140526050301482235.jpg
le but étant que le motif japonais soit juste a coté de ta div centrale ce qui est quand même mieux pour symboliser l'asie
exemple d'image gridée : casimages.com/img.php?i=140526050301482235.jpg
le but étant que le motif japonais soit juste a coté de ta div centrale ce qui est quand même mieux pour symboliser l'asie