Joomla Templates Club 406,261 posts

[jersonjunior Friend jersonjuniorJoin date: November 2010Posts: 79Downloads:2Uploads:8 Thanks: 15 Thanked: 2 times in 1 posts]

#172468

I would like know how change color to different item

The same image above:

---

Attachments:

1. 

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#432734

Hi,
Could you give me username + password of backend and a link to your website?

[we2solutions Friend we2solutionsJoin date: September 2014Posts: 526Downloads:0Uploads:21 Thanks: 136 Thanked: 100 times in 1 posts]

#432741

Hi jersonjunior ,

When editing a menu item, you will see a field named “additional class”, just fill a class name like “_red”.
Then add a code like below to template.css:

._red{
background: red;
}

Try and let me know about the result 🙂

[jersonjunior Friend jersonjuniorJoin date: November 2010Posts: 79Downloads:2Uploads:8 Thanks: 15 Thanked: 2 times in 1 posts]

#432784

The result is http://www.soupinheirense.com.br but i would like change de color of text!

[pixelzombie Friend pixelzombieJoin date: August 2010Posts: 339Downloads:2Uploads:49 Thanks: 32 Thanked: 168 times in 107 posts]

#432791

Hi jersonjunior,

Just change the css code WE2Solutions provided to


._red{
color: red;
}


Cheers

Frank

[jersonjunior Friend jersonjuniorJoin date: November 2010Posts: 79Downloads:2Uploads:8 Thanks: 15 Thanked: 2 times in 1 posts]

#432842

I put this in templante.css and nothing!

[jersonjunior Friend jersonjuniorJoin date: November 2010Posts: 79Downloads:2Uploads:8 Thanks: 15 Thanked: 2 times in 1 posts]

#432854

ja-megamenu ul.level0 li.mega a.mega => Home= Text Blue
.ja-megamenu ul.level0 li.mega a.mega=> Other item Text=yellow
.ja-megamenu ul.level0 li.mega a.mega=>Other item Text=Withe
….

I think that is possible but need add code in mega.css

[jersonjunior Friend jersonjuniorJoin date: November 2010Posts: 79Downloads:2Uploads:8 Thanks: 15 Thanked: 2 times in 1 posts]

#432860

#nav ul.menu li.level1.item1:hover a {
color: #F18939;
}
#nav ul.menu li.level1.item2:hover a {
color: #C4CD28;
}
#nav ul.menu li.level1.item3:hover a {
color: #00B200;
}
#nav ul.menu li.level1.item4:hover a {
color: #EC008C;
}
#nav ul.menu li.level1.item5:hover a {
color: #8F3079;
}
#nav ul.menu li.level1 a {
color: #5E5249;
}
#nav ul.menu li.level1.item1.active a {
color: #F18939;
}
#nav ul.menu li.level1.item2.active a {
color: #C4CD28;
}
#nav ul.menu li.level1.item3.active a {
color: #00B200;
}
#nav ul.menu li.level1.item4.active a {
color: #EC008C;
}
#nav ul.menu li.level1.item5.active a {
color: #8F3079;
}
#nav .level1.item1 ul.level2 {
background-color: #F18939;
display: none;
left: 12px;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 121px;
}
#nav .level1.item2 ul.level2 {
background-color: #C4CD28;
display: none;
left: 12px;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 120px;
}
.en #nav .level1.item1 ul.level2 {
background-color: #F18939;
display: none;
left: 12px;
margin: 8px 0 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 121px;
}
.en #nav .level1.item2 ul.level2 {
background-color: #C4CD28;
display: none;
left: 12px;
margin: 8px 0 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 120px;
}
#nav .level1.item3 ul.level2 {
background-color: #00B200;
display: none;
left: 10px;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 135px;
}
#nav .level1.item4 ul.level2 {
background-color: #EC008C;
display: none;
left: 12px;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 109px;
}
.en #nav .level1.item4 ul.level2 {
background-color: #EC008C;
display: none;
left: 0;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 109px;
}
#nav .level1.item5 ul.level2 {
background-color: #8F3079;
display: none;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 100px;
}
#nav .level1.item1 ul.level2 li {
background: none repeat scroll 0 0 transparent;
border-bottom: 1px solid #E2853E;
}
#nav .level1.item2 ul.level2 li {
background: none repeat scroll 0 0 transparent;
border-bottom: 1px solid #BAC22F;
}
#nav .level1.item3 ul.level2 li {
background: none repeat scroll 0 0 transparent;
border-bottom: 1px solid #0BAA0B;
}
#nav .level1.item4 ul.level2 li {
background: none repeat scroll 0 0 transparent;
border-bottom: 1px solid #DD0B88;
}
#nav .level1.item5 ul.level2 li {
background: none repeat scroll 0 0 transparent;
border-bottom: 1px solid #671D56;
}
#nav ul.level2 {
z-index: 250;
}
#nav ul.menu li.level1.item1 ul.lvl2 {
background-color: #F18939;
display: none;
left: 12px;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 121px;
}
#nav ul.menu li.level1.item2 ul.lvl2 {
background-color: #C4CD28;
display: none;
left: 12px;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 120px;
}
#nav ul.menu li.level1.item3 ul.lvl2 {
background-color: #00B200;
display: none;
left: 10px;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 135px;
}
#nav ul.menu li.level1.item4 ul.lvl2 {
background-color: #EC008C;
display: none;
left: 12px;
margin: 0;
padding: 5px 5px 10px;
position: absolute;
top: 45px;
width: 109px;
}
#nav ul.menu li.level1.item1 ul.lvl2 li {
border-bottom: 1px solid #E2853E;
}
#nav ul.menu li.level1.item2 ul.lvl2 li {
border-bottom: 1px solid #BAC22F;
}
#nav ul.menu li.level1.item3 ul.lvl2 li {
border-bottom: 1px solid #0BAA0B;
}
#nav ul.menu li.level1.item4 ul.lvl2 li {
border-bottom: 1px solid #DD0B88;

[Author]

Posts