Couleur différente pour chaque en-tête catégories
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Couleur différente pour chaque en-tête catégories
Détails techniques
Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://hbetaville.forumactif.org
Description du problème
Bonjour/bonsoir,Je me permets de faire suite au sujet que j'ai lu: https://forum.forumactif.com/t384743-couleur-de-fond-titre-des-categorie-phbb3?highlight=couleur+cat%E9gorie
Voilà je suis également embêter à propos du même sujet, j'ai essayé les codes mais pas moyen. Je suis un php2 moi et non php3 et j'aurais voulu la même chose que ci-dessous.
Soit j'ai fais une bêtise, sois je n'ai rien compris. Du coup j'ai tous enlever et j'attends donc les instructions. Je n'ai modifié aucune template et voici mon CSS:
- Code:
/* Vérification disponibilité speudo a l'inscription */
#username_reg {
color: #a90c0c;
}
#username_reg.okusername {
color: #2f9122;
}
/* Couleurs de fond des catégories */
ul.linklist:not(.navlinks):nth-of-type(1) + div .header {
background-color: red !important;
}
ul.linklist:nth-of-type(1) + div + div .header {
background-color: blue !important;
}
ul.linklist:nth-of-type(1) + div + div + div .header {
background-color: orange !important;
}
/* Affichage avatar du membre */
.fa_avatar {
width: 25px;
height: 25px;
position: relative;
top: -3px;
margin-right: 5px;
border-radius: 3px;
margin-bottom: -10px;
}
/* Affichage image cadre de réponse */
.sceditor-container iframe, .sceditor-container textarea {
background:url(http://2img.net/i/fa/empty.gif)!important;}
/* Raccourci affichage des liens */
.postbody a {
display: inline-block;
max-width: 300px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
vertical-align: bottom;
}
/* Toolbar */
div#fa_search {display:none!important;} /*suppression bare de recherche */
/* Modification image share toolbar */
a#fa_fb {
background:url('adresse_de_votre_image')no-repeat!important;
}
a#fa_twitter {
background:url('adresse_de_votre_image')no-repeat!important;
}
a#fa_gp {
background:url('adresse_de_votre_image')no-repeat!important;
}
a#fa_mail {
background:url('adresse_de_votre_image')no-repeat!important;
}
a#fa_rss {
background:url('adresse_de_votre_image')no-repeat!important;
}
/* Modification forme toolbar */
div#fa_toolbar {
background-color: #282828; /* Couleur de fond */
border-radius: 0 0 50px 50px; /* Arrondis les bords de la toolbar */
box-shadow: 0 0 5px #000000; /* Affiche une ombre */
margin: auto; /* Centre la toolbar */
width: 98%; /* Modifie la longueur de la toolbar */
}
div#fa_toolbar div, div#fa_toolbar span {
margin: 0 15px; /* Repositionne correctement le contenu de la toolbar */
}
/* Barre de navigation */
/* sticky nav main */
#fa_sticky_nav {
font-size:0; /* hide whitespace */
text-align:center;
background:#333;
border-bottom:1px solid #222 !important;
height:30px;
position:fixed;
right:0;
z-index:999;
overflow:hidden;
transition:top 200ms linear, width 600ms ease-in-out;
}
#fa_sticky_nav li { display:inline } /* navlist adjustment */
/* sticky menu links */
#fa_sticky_nav a.mainmenu {
color:#CCC;
font-size:12px;
font-weight:bold;
font-family:"Trebuchet MS", Arial, Verdana, Sans-serif;
background:url('http://i21.servimg.com/u/f21/18/21/41/30/row10.gif') repeat-x 0px 30px;
display:inline-block;
padding:0 10px;
height:30px;
line-height:30px;
transition:200ms;
}
#fa_sticky_nav a.mainmenu:hover, #fa_sticky_nav a.mainmenu.fa_navactif {
color:#FFF;
background-position:0 25px;
}
/* sticky nav toggler */
#fa_sticky_toggle {
background:url('http://i21.servimg.com/u/f21/18/21/41/30/omnida11.png') no-repeat 0 0 #333;
border:1px solid #222;
border-right:none;
display:inline-block;
height:29px;
width:30px;
position:fixed;
right:0;
z-index:999;
transition:top 200ms linear;
}
#fa_sticky_toggle:hover { background-position:-30px 0 }
/* make hidden toolbar similar to toggler */
#fa_toolbar_hidden {
border-radius:0 !important;
border:1px solid #222;
border-right:0;
border-top:0;
}
/* post offset fix */
.post div[style*="-30px;"] {
top:-60px !important;
}
/*----()Bouton avertissement rapide ----*/
.mod_mess, .adm_mess {
margin: 5px auto;
width: 90%;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.mod_mess a.postlink, .adm_mess a.postlink {
color: #FFF !important;
text-decoration: underline !important;
}
/* administrateur bb-Code - bloc de message d'enregistrement */
.adm_mess {
background: #e54858;
background: -moz-linear-gradient(left, #e54858 0%, #f5b57a 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #e54858), color-stop(100%, #f5b57a));
background: -webkit-linear-gradient(left, #e54858 0%, #f5b57a 100%);
background: -o-linear-gradient(left, #e54858 0%, #f5b57a 100%);
background: -ms-linear-gradient(left, #e54858 0%, #f5b57a 100%);
background: linear-gradient(left, #e54858 0%, #f5b57a 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e54858", endColorstr="#f5b57a", GradientType=1);
-webkit-box-shadow: 4px 4px 0px 0px #352727;
-moz-box-shadow: 4px 4px 0px 0px #352727;
box-shadow: 4px 4px 0px 0px #352727;
}
/* Administrateur bb-Code - mise en page */
.adm_mess .titl {
font-size: 15px;
font-weight: bold;
padding: 5px;
border-bottom: 1px dashed #B60505;
}
/* Administrateur BB-Code - présentation du texte */
.adm_mess .titl + div {
display: block;
margin-left: 10px;
padding: 25px 5px 25px 80px;
background: transparent url(http://i33.servimg.com/u/f33/17/37/83/89/gnome-10.png) no-repeat left center;
}
/* Messages BB-Code - bloc de message d'enregistrement */
.mod_mess {
background: #5c93f5;
background: -moz-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #5c93f5), color-stop(100%, #afcfda));
background: -webkit-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
background: -o-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
background: -ms-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
background: linear-gradient(left, #5c93f5 0%, #afcfda 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5c93f5", endColorstr="#afcfda", GradientType=1);
-webkit-box-shadow: 4px 4px 0px 0px #352727;
-moz-box-shadow: 4px 4px 0px 0px #352727;
box-shadow: 4px 4px 0px 0px #352727;
}
/* Messages BB-Code - Un titre */
.mod_mess .titl {
font-size: 15px;
font-weight: bold;
padding: 5px;
border-bottom: 1px dashed #0D4DD3;
}
/* modernité BB-Code - présentation du texte */
.mod_mess .titl + div {
display: block;
margin-left: 10px;
padding: 25px 5px 25px 80px;
background: transparent url(http://i33.servimg.com/u/f33/17/37/83/89/gnome610.png) no-repeat left center;
}
/* coin forum arrondi */
.bodyline {
-moz-border-radius:15px;
-webkit-border-radius:15px;
border-radius:15px;
}
@Miettes
Je vous remercie par avance de votre aide et désolé de vous avoir déranger
Dernière édition par remybf le Dim 17 Avr 2016 - 21:27, édité 1 fois
Re: Couleur différente pour chaque en-tête catégories
Salut
Déjà, je tiens à le préciser, j'apprécie moyennement de recevoir un MP toutes les demi-journées pour demander de l'aide....
Ceci étant dit, j'aimerai comprendre pourquoi tu as mis la CSS dans une feuille javascript
Déjà, je tiens à le préciser, j'apprécie moyennement de recevoir un MP toutes les demi-journées pour demander de l'aide....
Ceci étant dit, j'aimerai comprendre pourquoi tu as mis la CSS dans une feuille javascript
Re: Couleur différente pour chaque en-tête catégories
Miettes a écrit:Salut
Déjà, je tiens à le préciser, j'apprécie moyennement de recevoir un MP toutes les demi-journées pour demander de l'aide....
Ceci étant dit, j'aimerai comprendre pourquoi tu as mis la CSS dans une feuille javascript
Bonjour,
Escusez moi je ne pensais pas l'avoir envoyé plusieurs fois car le message est toujours dans ma boite d'envoie et non dans les messages envoyés. Si j'avais su qu'il y avait un problème a ce niveau, je ne l'aurais pas envoyé plusieurs fois
Pour ce qui est du code je m'y connais très peu alors il est fortement possible qu'il y ai des bêtises.
Re: Couleur différente pour chaque en-tête catégories
Bonjour,
Déjà on peut supprimer cette partie dans votre css:
Bye
Déjà on peut supprimer cette partie dans votre css:
- Code:
/* Couleurs de fond des catégories */
ul.linklist:not(.navlinks):nth-of-type(1) + div .header {
background-color: red !important;
}
ul.linklist:nth-of-type(1) + div + div .header {
background-color: blue !important;
}
ul.linklist:nth-of-type(1) + div + div + div .header {
background-color: orange !important;
}
Bye
Invité- Invité
Re: Couleur différente pour chaque en-tête catégories
d'accord merci
Re: Couleur différente pour chaque en-tête catégories
De rien
Donc dans votre panneau d'administration à :
- Forum
- Catégories et forums
- Cliquer sur l'icône de chaque catégorie " "
- Nom de la catégorie > Mettez ce code juste AVANT le titre de la catégorie :
Ensuite dans la gestion des codes javascript sur toutes les pages mettez ce code:
La couleur est rouge = red dans le code modifiez cela pour choisir votre couleur.
Ne pas hésiter si besoin d'aide.
Donc dans votre panneau d'administration à :
- Forum
- Catégories et forums
- Cliquer sur l'icône de chaque catégorie " "
- Nom de la catégorie > Mettez ce code juste AVANT le titre de la catégorie :
- Code:
<span class="cat1">
- Code:
<span class="cat2">
Ensuite dans la gestion des codes javascript sur toutes les pages mettez ce code:
- Code:
$(function(){
$(".cat1").parent().parent().parent().attr('id','cat1');
});
- Code:
$(function(){
$(".cat1").parent().parent().parent().attr('id','cat1');
$(".cat2").parent().parent().parent().attr('id','cat2');
});
- Code:
.secondarytitle, .secondarytitle ~ th {
background: none !important;
}
/* catégorie 1 */
tr#cat1 {
background-color: red;
}
La couleur est rouge = red dans le code modifiez cela pour choisir votre couleur.
Ne pas hésiter si besoin d'aide.
Invité- Invité
Re: Couleur différente pour chaque en-tête catégories
c'est nickel vraiment un grand merci
Sujets similaires
» Mettre une image différente à chaque en-tête de catégorie
» Couleur de fond différente à chaque message
» Image différente pour chaque catégorie
» une image différente pour chaque forum ?
» Une page différente pour chaque catégorie
» Couleur de fond différente à chaque message
» Image différente pour chaque catégorie
» une image différente pour chaque forum ?
» Une page différente pour chaque catégorie
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum