Franque Posted August 26, 2014 Share Posted August 26, 2014 (edited) Bonjour, Je dispose d'un menu sur mon prestashop (1.6.0.6) et je souhaiterai que l'un des onglets de ce menu ai une couleur de background différente de celle des autres onglets. Comment dois-je modifier le fichier css ? Merci d'avance Edited May 7, 2015 by Franque (see edit history) Link to comment Share on other sites More sharing options...
Szed Posted August 27, 2014 Share Posted August 27, 2014 Avec le module de menu de base, je crains qu'il n'y ai pas de solution, car rien ne vous permet de cibler précisément votre onglet (hormis la nouvelle propriété CSS :nth-child(), mais peu compatible avec les anciens navigateurs). Pour plus de contrôle sur votre menu, il vous faudrait passer à un module de menu avancé. Link to comment Share on other sites More sharing options...
Franque Posted August 27, 2014 Author Share Posted August 27, 2014 (edited) Avec le module de menu de base, je crains qu'il n'y ai pas de solution, car rien ne vous permet de cibler précisément votre onglet (hormis la nouvelle propriété CSS :nth-child(), mais peu compatible avec les anciens navigateurs). Pour plus de contrôle sur votre menu, il vous faudrait passer à un module de menu avancé. C'est pas le menu de base que je dispose. Le menu que j'ai ( et dont le code est au dessus ), fait partie d'un thème que j'ai acheté.. Edited August 27, 2014 by Franque (see edit history) Link to comment Share on other sites More sharing options...
Szed Posted August 27, 2014 Share Posted August 27, 2014 ( et dont le code est au dessus ) ? Si c'est un menu custom, voyez si vous avez moyen de spécifier une classe CSS pour un onglet. Cela vous permettrait de la cibler en CSS. Sinon, donnez le lien du site, que l'on puisse voir si la structure HTML ne permet pas de cibler un onglet en particulier. Link to comment Share on other sites More sharing options...
Franque Posted August 27, 2014 Author Share Posted August 27, 2014 (edited) ? Si c'est un menu custom, voyez si vous avez moyen de spécifier une classe CSS pour un onglet. Cela vous permettrait de la cibler en CSS. Sinon, donnez le lien du site, que l'on puisse voir si la structure HTML ne permet pas de cibler un onglet en particulier. Le code du css du menu n'a pas était enregistré, le voici : .spanOption,.spanOptionList,.spanColumn{ position: absolute; position: relative\9; /* For IE9 */ position: relative \9; /* For IE8*/ } #menu {clear:both;padding:0;background:#141414;width:100%;float:left;margin:0} #menu ul.ul_mega_menu{text-align:left;width:100%;} #menu ul li.menu_item{width:auto;float:left;display:inline-block;position:relative;margin:0;padding:0;background: url(../img/bkg_li_item.jpg) repeat-y right top;} #menu ul li.menu_item a.title_menu_parent{padding:10px 20px;color:#fff;font-size:16px;text-transform:uppercase;font-family:"Oswald",Helvetica,Arial, Verdana, sans-serif;display:block} #menu ul li.menu_item a:hover{color:#ff7800} #menu > ul > li:last-child{padding-right:0} #menu > ul > li ul > li{padding:5px 20px;display:block;width:auto;position:relative;z-index:20;} #menu > ul > li ul > li.category_item{padding:0;margin:5px 20px 10px;} #menu > ul > li ul > li.parent a.cat_child{background: url(../img/bkg_arrow.png) no-repeat right 6px;padding-right:10px;} #menu ul li.menu_item.parent:hover > a.title_menu_parent{background: url(../img/arrow.png) no-repeat bottom center;transition: none 0s ease 0s;} #menu > ul li > div.options_list, #menu > ul li > div.sub_menu, #cs_megamenu_more .more-menu{top:auto; margin:0;background:#fff; position: absolute; z-index:100; padding:25px 0 0;text-align:left; transition:opacity 0.8s ease 0s; /*opacity:0; filter:alpha(opacity=0);*/ box-shadow:0 2px 5px #aeaeae; display:none; } #menu > ul li:hover > div.options_list, #menu > ul li:hover > div.sub_menu, #cs_megamenu_more:hover .more-menu{opacity:1;filter:alpha(opacity=100)} #menu > ul li > div.sub_menu{width:auto!important} #menu > ul > li > div { display: none;} #menu > ul > li:hover > div {display: block;} /*#menu ul ul > li.parent div.sub_menu{opacity:0;filter:alpha(opacity=0)}*/ #menu ul li.parent:hover,#menu > ul > li ul > li.parent:hover{z-index:100} #menu ul ul > li.parent:hover div.sub_menu{left:95%;top:-25px;z-index:100;padding-top:20px;/*opacity:1;filter:alpha(opacity=100)*/} #menu ul li.parent:hover div.sub_menu{z-index:100} #menu > ul li.menu_item > div a{ color:#969696; display:block; padding:0;height:auto; margin:0;z-index:20;position:relative;} #menu > ul li.menu_item > div a:hover{transition: all 0.5s ease 0s;color:#141414;text-decoration:none;} #menu > ul > li > div > ul { display: table-cell; } #menu ul li#cs_megamenu_more div ul{display:block} #menu > ul > li .options_list ul{float:left;padding-bottom:25px;} #menu > ul > li .options_list ul.manufacture{padding-bottom:0;} #menu > ul > li div a.cat_parent{padding:0 22px;display:block;} #menu > ul > li div a.cat_parent img{display:block;margin-bottom:10px;max-width:100%} #menu > ul > li div a:hover,#menu > ul li.menu_item > div a:hover,#menu ul li .product_item a:hover { color:#141414;text-decoration:none;transition: all 0.5s ease 0s; } /*#menu .option ul li {position: relative;} #menu ul li ul li{position:relative}*/ #menu ul li ul li:hover > div.sub_menu{display:block;z-index:100} #menu ul li .div_static{margin:0;padding:0 20px;} #menu ul li .div_static > div{margin-bottom:18px;} #menu ul li .div_static .static_menu_6{margin-bottom:10px;} #menu ul li .div_static a{text-align:center;display:block;padding-bottom:10px} #menu ul li .div_static a img{max-width:100%} #menu ul li .div_static h3{padding-bottom:13px;font-size:14px;text-transform:uppercase} #menu ul li .div_static h3.title_2{margin-top:10px;border-top:1px dotted #c8c8c8;} #menu .column.product li.product_item p{color:#fff;padding-left:12px;} #menu ul li div.out_cat_parent{display:block;padding:0 20px;text-align:left} #menu ul li div.out_cat_parent a, #menu ul li .div_static h5{color:#1e1e1e;padding-bottom:10px;text-transform:uppercase;font-size:14px;} .option > .name_cat_parent{padding:0 20px 5px;color:#141414;text-transform:uppercase;font-size:14px;} .div_static h4.title_block{color:#141414;text-transform:uppercase;font-size:14px;font-weight:400} #menu .option > .name_cat_parent a{color:#141414;} #menu .option > .name_cat_parent a:hover{color:#ff7800} #menu > ul > li .out_cat_parent a{padding:0;display:block;text-align:left} #menu ul li.cs_m_manufacter div.options_list{padding:20px 20px 0 0} #menu ul li .manufacture .product_item{width:auto;float:left;padding:0 25px 25px;} #menu ul li .manufacture .product_item a{display:block;text-align:center;} #menu ul li .manufacture .product_item a img{max-width:100%;vertical-align:top} #menu ul li .ajax_block_product{padding:0 20px!important;overflow:hidden} #menu ul li .ajax_block_product + .ajax_block_product{margin-top:20px;} #menu ul li .ajax_block_product,#menu ul li .ajax_block_product a {} #menu ul li .ajax_block_product .product_image_menu{display:block;padding:1px;border:1px solid #dcdcdc;margin-bottom:10px;text-align:center} #menu ul li .ajax_block_product .product_image_menu img{max-width:99%} #menu ul li .ajax_block_product h3 a{color:#646464;font-size:14px;display:inline;} #menu #cs_megamenu_more li .name_product{clear:both;display:block} #menu ul li a.product_image{text-align:center} #menu ul li .ajax_block_product a:hover{text-decoration:none} #menu ul li .ajax_block_product p{margin:0 0 5px} #menu ul li .ajax_block_product p.price_container{margin:10px 0 15px} #menu ul li .ajax_block_product .exclusive{width:auto;padding:0 10px;display:inline-block;height:32px;line-height:32px;color:#fff;} #menu ul li .ajax_block_product .exclusive:hover{text-decoration:none} .cs_hide_p .name_product,.cs_hide_p .price{display:none} #menu ul li.cs_hide_p .ajax_block_product .image{float:none;padding:0;margin-bottom:10px;} #menu ul li .ajax_block_product .exclusive:hover{color:#fff;} .cs_st_img {text-align:center;margin-bottom:10px;} .cs_st_img img{max-width:100%} /* Responsive Menu */ #megamenu-responsive{ width:100%;position:relative;z-index:98;clear:both; line-height:17px;display:none;text-align:left } .menu-toggle > p{ background: url("../img/menu.png") no-repeat scroll 50% center transparent; display: block; float: left; height: 30px; left: 5px; margin: 0; position: absolute; top: 3px; width: 30px; } #megamenu-responsive-root li.menu-toggle{ padding:10px 10px 10px 40px; background:#141414; color:#fff; font-size:16px; cursor:pointer;position:relative;margin-bottom:5px; } #megamenu-responsive-root{text-align:left} #megamenu-responsive-root li.root{padding:0} #megamenu-responsive-root > li{padding:10px 0;display:block;font-family:"Oswald",Helvetica,Arial, Verdana, sans-serif;text-transform:uppercase;color:#fff} #megamenu-responsive-root > li a{padding:10px;display:block;background:#141414;color:#fff;text-align:left; font-family:"Oswald",Helvetica,Arial, Verdana, sans-serif;text-transform:uppercase;margin-bottom:5px; } #megamenu-responsive-root ul li li li a{text-transform:none} #megamenu-responsive-root li.root > ul{ display:none; } #megamenu-responsive-root li.root.open > ul{ display:block; } #megamenu-responsive-root li.parent > ul{ display:none; } #megamenu-responsive li.parent {clear:both } #megamenu-responsive .root li{padding:0;} #megamenu-responsive .root li a:hover{ color:#ff7800;text-decoration:none } #megamenu-responsive li.parent ul{clear:both;} #megamenu-responsive .root li ul{padding:0;overflow:hidden} #megamenu-responsive .root li li ul{padding:0 5px;} #megamenu-responsive ul span{} #megamenu-responsive a{ display:block; } #megamenu-responsive li.parent > a span{ display:block; } #megamenu-responsive li.parent > p{ display:block; float:right; padding:0 10px; width:10px;min-height:18px;line-height:1.35; text-align:center; cursor:default; font-weight:700; font-size:24px; color:#fff; margin:0; } #cs_megamenu_more .more-menu{right:0;width:180px!important;padding:10px 0;} #menu #cs_megamenu_more ul li.menu_item {padding:5px 20px;width:140px;background:none} #cs_megamenu_more .more-menu div.options_list{top:0} /* Media Queries */ @media only screen and (min-width:1024px) and (max-width: 1279px) { #menu > ul > li div a.cat_parent img{width:100%} } @media only screen and (max-width: 1023px) { #menu ul li.menu_item a{min-width:auto;padding:0 10px} #menu > ul > li div a.cat_parent img{width:100%} #menu > ul > li .options_list ul{margin-bottom:15px} } @media only screen and (max-width: 767px) { #menu{display:none!important;} #megamenu-responsive{display:block;margin-bottom:10px} #menu > ul > li .options_list ul{width:100%!important;} } /* ipad */ #cs_megamenu_more .more-menu li:hover div.options_list{display:block;left:auto;right:100%;} #cs_megamenu_more .more-menu li:hover div ul li div.options_list{display:none;} #cs_megamenu_more .more-menu li:hover div ul li:hover div.options_list{display:block;} #menu #cs_megamenu_more .more-menu li a.title_menu_parent{padding:0;color:#969696} #menu #cs_megamenu_more .more-menu li a.title_menu_parent:hover{color:#141414} /*.spanOption,.spanColumn{display:none}*/ /* ipad hover */ /*@media only screen and (min-width:768px) and (max-width:1199px){ #menu ul li.level-1.parent{padding-right:3px;padding-left:7px;} }*/ .spanColumn,.spanOption{display:none} Edited May 7, 2015 by Franque (see edit history) Link to comment Share on other sites More sharing options...
Szed Posted August 27, 2014 Share Posted August 27, 2014 Rien dans l'html du menu ne nous permet de cibler un onglet présicement. Votre seul option est donc la propriété :nth-child en css .ul_mega_menu li:nth-child(2) { background: #ff0000; } Devrait cibler le 2eme onglet. Par contre, c'est du CSS3, peu compatible avec les vieux navigateurs. Link to comment Share on other sites More sharing options...
Franque Posted August 27, 2014 Author Share Posted August 27, 2014 Rien dans l'html du menu ne nous permet de cibler un onglet présicement. Votre seul option est donc la propriété :nth-child en css .ul_mega_menu li:nth-child(2) { background: #ff0000; } Devrait cibler le 2eme onglet. Par contre, c'est du CSS3, peu compatible avec les vieux navigateurs. Merci pour votre réponse rapide. Donc en rajoutant seulement ça à la suite, dans le code css gérant le menu, cela fonctionnera ? Link to comment Share on other sites More sharing options...
Szed Posted August 27, 2014 Share Posted August 27, 2014 Oui et non, il faut lire ! Ça fonctionnera sur les navigateur le supportant Et mon code n'est qu'un exemple. Je vous montre juste la propriété CSS nth-child(n) Vous en faite ce que vous voulez ensuite. Link to comment Share on other sites More sharing options...
myselfidem Posted August 27, 2014 Share Posted August 27, 2014 (edited) Vous pouvez utiliser Firebug avec Firefox afin de cibler les modifications souhaitées : https://addons.mozilla.org/fr/firefox/addon/firebug/ http://fr.openclassrooms.com/informatique/cours/firebug-une-merveille-de-plus-pour-firefox Edited August 27, 2014 by myselfidem (see edit history) Link to comment Share on other sites More sharing options...
Franque Posted August 27, 2014 Author Share Posted August 27, 2014 Oui et non, il faut lire ! Ça fonctionnera sur les navigateur le supportant Et mon code n'est qu'un exemple. Je vous montre juste la propriété CSS nth-child(n) Vous en faite ce que vous voulez ensuite. Oui j'ai bien compris pour les anciens navigateurs Je vais essayer voir ci cela fonctionne Merci Link to comment Share on other sites More sharing options...
Franque Posted August 27, 2014 Author Share Posted August 27, 2014 Après avoir essayé de mettre le code suivant dans le fichier css, c'est les deuxièmes onglets des sous menu qui est passé (en l'occurrence) orange .. mais pas l'onglet principal.. Avez vous des idées de comment dois je faire ? .ul_mega_menu li:nth-child(3) { background: #FF7F50; } Merci Link to comment Share on other sites More sharing options...
Szed Posted August 28, 2014 Share Posted August 28, 2014 Probablement une mauvaise utilisation de nth-child de ma part : http://www.w3schools.com/cssref/sel_nth-child.asp Link to comment Share on other sites More sharing options...
Franque Posted August 28, 2014 Author Share Posted August 28, 2014 (edited) Probablement une mauvaise utilisation de nth-child de ma part : http://www.w3schools.com/cssref/sel_nth-child.asp Pourtant votre code semble correct, car en l'occurrence, pour les onglets du menu c'est bien "li" qu'il faut mettre, mais le css semble "zaper" les premiers pour directement passer au sous-menu Cela ne fonctionne donc pas pour les onglets principaux Edited August 28, 2014 by Franque (see edit history) Link to comment Share on other sites More sharing options...
Franque Posted September 9, 2014 Author Share Posted September 9, 2014 Personne n'a d'autres idées ? :/ Link to comment Share on other sites More sharing options...
bapa Posted March 17, 2015 Share Posted March 17, 2015 Bonjour, jespere toujours vous aidez en repondant a votre preocupation. Voici le code a inserer: .sf-menu li:nth-child(7) { background: #ff0000; } au lieu de .ul_mega_menu li:nth-child(3) { background: #FF7F50; } EXPLICATIONS: .sf-menu : nom du menu (pour moi) li:nth-child(7) : selectionne de 7e onglet Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted March 17, 2015 Share Posted March 17, 2015 Il est aussi possible de cibler directement le lien. a[href*=contenue dans le lien]{background: #000000;} par exemple vous pouvez le cibler avec le nom de la categorie Link to comment Share on other sites More sharing options...
bapa Posted March 18, 2015 Share Posted March 18, 2015 J'ai essayé votre code mais ça ne donne rien. Le code est-il bon? Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted March 18, 2015 Share Posted March 18, 2015 Vous pouvez copier votre code, je regarde, normalement ça marche. Avec ce système j'ai créer ça. C'est pour créer des onglets de couleur différent. Link to comment Share on other sites More sharing options...
bapa Posted March 18, 2015 Share Posted March 18, 2015 /*yves modif*/ .sf-menu a [href*=MARQUES]{ background: #7fb14a; } Voici le code en question. J'ai dabord essayé sans le ".sf-menu" mais rien donc voila. Link to comment Share on other sites More sharing options...
J. Danse Posted March 18, 2015 Share Posted March 18, 2015 Bonjour, Vous avez un espace entre le a et le [href]. Retirez le pour voir ;-) Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted March 18, 2015 Share Posted March 18, 2015 Oui il faut retirer l'espace entre a et [href] Link to comment Share on other sites More sharing options...
bapa Posted March 18, 2015 Share Posted March 18, 2015 J'ai tout essayé . Pourrais-je avoir un aperçu de votre code? pour mieux m'orienter. Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted March 18, 2015 Share Posted March 18, 2015 Dans le fichier css superfish-modified.css (c'est le css du module block top menu) a[href*=jouet-en-bois]{ background: #fd0202; } Si vous voulez, donnez moi l'adresse de votre site et je vous donnerai le bon selecteur Bonne journée Link to comment Share on other sites More sharing options...
bapa Posted March 18, 2015 Share Posted March 18, 2015 streetwear237.com dans le menu selectionnons l'onglet "HOMMES" Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted March 18, 2015 Share Posted March 18, 2015 .sf-menu a[href*=13]{background: #votrecouleur;} je ne cible pas avec hommes sinon vous aller avoir d'autres catégories qui comportent hommes qui vont être ciblée. En ciblant avec le numero ca devait etre bon Juste pour info votre site est extrêmement lent à charger. N'oubliez pas de vider le cache pour voir le changement. Link to comment Share on other sites More sharing options...
bapa Posted March 19, 2015 Share Posted March 19, 2015 OK, merci pour la remark. je lai fai. Jai compris le principe de ton CSS et xa fonctionne desormais. merci. Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted March 19, 2015 Share Posted March 19, 2015 Jai compris le principe de ton CSS et xa fonctionne desormais. merci. Super : Link to comment Share on other sites More sharing options...
nazdupresta Posted May 7, 2015 Share Posted May 7, 2015 (edited) .sf-menu a[href*=13]{background: #votrecouleur;} je ne cible pas avec hommes sinon vous aller avoir d'autres catégories qui comportent hommes qui vont être ciblée. En ciblant avec le numero ca devait etre bon Juste pour info votre site est extrêmement lent à charger. N'oubliez pas de vider le cache pour voir le changement. Génial ! ca fait 15 j que le chercher une solution , ca fonctionne presque parfaitement jusqu'au 1.6.0.14 le seul soucis c'est que la categorie n'est pas stricte je m'explique : si on met 13 dans le href , tout ce qui termine par 13 se retrouve coloré (113,213) comment peut on donner une valeur stricte ? auriez vous par contre dans le meme temps une idée pour changer le hover dans le meme style ? Merci Edited May 7, 2015 by organizetmoi (see edit history) Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted May 7, 2015 Share Posted May 7, 2015 C'est la même chose si c'est pour le background .sf-menu a[href*=13]:hover {background: #votrecouleur;} Link to comment Share on other sites More sharing options...
nazdupresta Posted May 7, 2015 Share Posted May 7, 2015 (edited) C'est la même chose si c'est pour le background .sf-menu a[href*=13]:hover {background: #votrecouleur;} Bonjour et merci ce n'est pas du background dont je parlais pardon , mais du background hover (a:hoverforce) , ce qui est plus embettant c'est l'histoire de "categorie stricte" , auriez vous une idée ? j'ai laisser en prod un exemple sur le site http://mafete.fr pour vous eclairer Bonne journée Edited May 7, 2015 by organizetmoi (see edit history) Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted May 7, 2015 Share Posted May 7, 2015 background hover (a:hoverforce) J'ai rien compris c'est plutôt a:hover {background:----;} categorie stricte Non plus Vous voulez dire que ca touche plusieurs catégories ? Dans ces cas la il faut essayer de cibler au maximum la catégorie avec des mots qui n’appartienne qu'à elle. Link to comment Share on other sites More sharing options...
nazdupresta Posted May 7, 2015 Share Posted May 7, 2015 background hover (a:hoverforce) J'ai rien compris c'est plutôt a:hover {background:----;} categorie stricte Non plus Vous voulez dire que ca touche plusieurs catégories ? Dans ces cas la il faut essayer de cibler au maximum la catégorie avec des mots qui n’appartienne qu'à elle. Mdrrr je 'ai jamais été doué dans mes explications lol par categorie stricte : lorsque j'utilise ce code :.sf-menu a[href*=13]:hover {background: #votrecouleur;} cela fonctionne , sauf que j'ai mes categories : 113 - 213 - 313 qui prennent donc la couleur aussi , lorque j'utilise les mots clés le code ne fonctionne pas du tout chez moi. pour le bakground : en utilisant votre code , cela me colore bien les differentes categorie , mais comment changer la couleur par "onglet categorie" au survol de la souris ? j'espere avoir été un peu plus comprehensible (et c'est pas gagné ) j'ai laissé un exemple en ligne si ca peut vous aider Cdt Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted May 7, 2015 Share Posted May 7, 2015 Donc il faut remplacer 13 par 213 ou 313 etc .... pour cibler au mieux. Le code que j'ai donné signifit un lien qui contient 13, remplacez par un lien qui contient 213 ou 313 etc .... 13 c'était pour l'exemple. du coup pour le changement par onglet catégorie c'est pareil, cibler mieux. Je ne voit pas l'adresse de votre site. Link to comment Share on other sites More sharing options...
nazdupresta Posted May 7, 2015 Share Posted May 7, 2015 (edited) Donc il faut remplacer 13 par 213 ou 313 etc .... pour cibler au mieux. Le code que j'ai donné signifit un lien qui contient 13, remplacez par un lien qui contient 213 ou 313 etc .... 13 c'était pour l'exemple. du coup pour le changement par onglet catégorie c'est pareil, cibler mieux. Je ne voit pas l'adresse de votre site. http://mafete.fr j'ai toujours pas été clair je crois je veut utiliser : 13 je ne veut pas de 113, 213,313 justement Edited May 7, 2015 by organizetmoi (see edit history) Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted May 7, 2015 Share Posted May 7, 2015 La il y a un hover bleu foncé sur tout les lien, il faut le supprimer puis cibler chaque lien indépendamment. Pour le premier vous mettez .sf-menu a[href*=18-deguisement] Link to comment Share on other sites More sharing options...
nazdupresta Posted May 7, 2015 Share Posted May 7, 2015 La il y a un hover bleu foncé sur tout les lien, il faut le supprimer puis cibler chaque lien indépendamment. Pour le premier vous mettez .sf-menu a[href*=18-deguisement] Génial ! ca fonctionne il ne me reste plus que le survol mais pas urgent tout ca merci beaucoup pour votre aide (et dsl pour l'incompréhension de mes messages ) bonne journée !! Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted May 7, 2015 Share Posted May 7, 2015 Pour le survol c'est pareil. Dans li.sfHover > a, .sf-menu > li > a:hover,.sf-menu > li.sfHoverForce > a Supprimer la ligne background: #0131B4; c'est la couleur bleu foncé du hover et créer un nouveau selecteur .sf-menu a[href*=18-deguisement]:hover{background: #votrecouleur;} 1 Link to comment Share on other sites More sharing options...
nazdupresta Posted May 7, 2015 Share Posted May 7, 2015 Pour le survol c'est pareil. Dans li.sfHover > a, .sf-menu > li > a:hover,.sf-menu > li.sfHoverForce > a Supprimer la ligne background: #0131B4; c'est la couleur bleu foncé du hover et créer un nouveau selecteur .sf-menu a[href*=18-deguisement]:hover{background: #votrecouleur;} Une tuerie merci beaucoup ! (je n'oublierais pas quand j'aurais un budget pour refaire le design ) Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted May 7, 2015 Share Posted May 7, 2015 Une tuerie merci beaucoup ! (je n'oublierais pas quand j'aurais un budget pour refaire le design ) N’hésitez pas notre graphiste est très talentueuse et on est pas cher Link to comment Share on other sites More sharing options...
nazdupresta Posted May 7, 2015 Share Posted May 7, 2015 N’hésitez pas notre graphiste est très talentueuse et on est pas cher oula , j'ai un gros soucis ! lorsque mes clients arrivent sur la page de commande , le menu se deplie totalement empechant de voir les articles dans le panier pour voir l'exemple il faut mettre un article dans le panier et aller jusqu'au processus de commande : http://mafete.fr/commande-rapide un idée pour m'aider ?? Link to comment Share on other sites More sharing options...
nazdupresta Posted May 7, 2015 Share Posted May 7, 2015 oula , j'ai un gros soucis ! lorsque mes clients arrivent sur la page de commande , le menu se deplie totalement empechant de voir les articles dans le panier pour voir l'exemple il faut mettre un article dans le panier et aller jusqu'au processus de commande : http://mafete.fr/commande-rapide un idée pour m'aider ?? resolu j'avais un bout de code qui embetait le monde Link to comment Share on other sites More sharing options...
grunjo Posted May 25, 2015 Share Posted May 25, 2015 Bonjour, Merci pour ce code car je cherchais justement à attribué un backgound différent pour un item de mon menu prestashop. Seulement, j'ai un souci : Le code : .jetmenu a[href*="http://www.lesdoigtsfleuris.com/jardin/"]{background: #EB8561;} Ce code ne devrait modifier que la couleur du background de "BLOG ALTERNATIF JARDIN". Or, l'item "AMENAGEMENT & CREATION JARDIN" subit aussi cette modification (sans doute car la racine du lien hypertexte est la même). Voici le lien pour mieux comprendre : http://www.lesdoigtsfleuris.com Avez-vous une brillante idée ? Merci beaucoup !!! Grunjo Link to comment Share on other sites More sharing options...
Vinum Posted May 26, 2015 Share Posted May 26, 2015 (edited) Bonjour,enlevez * après le href pour avoir : .jetmenu a[href="http://www.lesdoigtsfleuris.com/jardin/"]{background: #EB8561;} Edited May 26, 2015 by Vinum (see edit history) Link to comment Share on other sites More sharing options...
grunjo Posted May 26, 2015 Share Posted May 26, 2015 Super ça marche merci ! [RESOLU] Link to comment Share on other sites More sharing options...
unmonde-montagnes Posted March 8, 2016 Share Posted March 8, 2016 Donc il faut remplacer 13 par 213 ou 313 etc .... pour cibler au mieux. Le code que j'ai donné signifit un lien qui contient 13, remplacez par un lien qui contient 213 ou 313 etc .... 13 c'était pour l'exemple. du coup pour le changement par onglet catégorie c'est pareil, cibler mieux. Bonjour et désolée pour le déterrage... J'essaye désespérément d'appliquer une couleur à un onglet mais en appliquant le code : .sf-menu a[href*=ID_catégorie]{background: #macouleur;} les sous-catégories sont surlignées de la couleur appliquée à l'onglet menu Comment faire pour que la couleur s'applique uniquement à l'onglet catégorie et pas au texte des sous-catégories ? Merci Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted March 10, 2016 Share Posted March 10, 2016 Bonjour remplacer par .sf-menu > li a[href*="ID_catégorie"]{background: #macouleur;} Ca devrait marcher. Cela lui indique de ne sélectionner que les li directement enfant du sf-menu Bonne journée Link to comment Share on other sites More sharing options...
Ariane Web et Plus Posted May 23, 2016 Share Posted May 23, 2016 J'ai fait un tuto pour apprendre à modifier le fond ou la couleur d'un lien spécifique du menu : http://www.webetplus.fr/tutoriels/modifier-couleur-dun-onglet-uniquement-personnaliser-onglets/ Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now