Joomla Templates Club 406,261 posts

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#567800

Do me a favor – temporarily set “Optimize CSS” to “Off” within your Template Manager–General settings

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#732907

Do me a favor – temporarily set “Optimize CSS” to “Off” within your Template Manager–General settings

[willer Friend willerJoin date: February 2015Posts: 275Downloads:21Uploads:52 Thanks: 1 Thanked: 10 times in 1 posts]

#567802

…ok done

[willer Friend willerJoin date: February 2015Posts: 275Downloads:21Uploads:52 Thanks: 1 Thanked: 10 times in 1 posts]

#732909

…ok done

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#567804

Try This . . . .

Within file path –> /templates/ja_teline_v/local/css/megamenu.css
at line 422, you should see the following:


.t3-megamenu .t3-module .module-title, .t3-megamenu .t3-module .module-title:hover {
background: none repeat scroll 0 0 #111;
color: #fff;
font-size: 14px;
font-weight: 400;
letter-spacing: 1px;
margin: 0 0 12px;
padding: 6px 12px;
}

Modify the background color code to whatever color code you wish.

SAVE CHANGES – CLEAR CACHE – REFRESH PAGE

See how that works for you.

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#732911

Try This . . . .

Within file path –> /templates/ja_teline_v/local/css/megamenu.css
at line 422, you should see the following:


.t3-megamenu .t3-module .module-title, .t3-megamenu .t3-module .module-title:hover {
background: none repeat scroll 0 0 #111;
color: #fff;
font-size: 14px;
font-weight: 400;
letter-spacing: 1px;
margin: 0 0 12px;
padding: 6px 12px;
}

Modify the background color code to whatever color code you wish.

SAVE CHANGES – CLEAR CACHE – REFRESH PAGE

See how that works for you.

[willer Friend willerJoin date: February 2015Posts: 275Downloads:21Uploads:52 Thanks: 1 Thanked: 10 times in 1 posts]

#567806

You but I want a different color for each dropdown.
Did you see how the sample site? http://www.joomlart.com/demo/#ja_teline_v

red in world, blue in tecnology, green in sport…

[willer Friend willerJoin date: February 2015Posts: 275Downloads:21Uploads:52 Thanks: 1 Thanked: 10 times in 1 posts]

#732912

You but I want a different color for each dropdown.
Did you see how the sample site? http://www.joomlart.com/demo/#ja_teline_v

red in world, blue in tecnology, green in sport…

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#568189

Hi @willer,

Please navigate to admin >>> Extensions >>> Template Manager >>> choose your template >>> Megamenu >>> choose menu item, for example Guide >>> in Extra Class, type in “cat-blue” (or cat-red, cat-green, etc …) >>> save and recheck.

1 user says Thank You to Adam M for this useful post

1. turtlesoup

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#733285

Hi @willer,

Please navigate to admin >>> Extensions >>> Template Manager >>> choose your template >>> Megamenu >>> choose menu item, for example Guide >>> in Extra Class, type in “cat-blue” (or cat-red, cat-green, etc …) >>> save and recheck.

1 user says Thank You to Adam M for this useful post

1. turtlesoup

[ssinha Friend ssinhaJoin date: July 2014Posts: 183Downloads:57Uploads:11 Thanks: 68 Thanked: 12 times in 1 posts]

#568290

Hi Adam, I tried this and it did not work. Color works fine as long as the menu is category-blog type (and maybe some other type that I have not tried). However, I have one menu called ‘Metro’ which is a ‘Menu Heading’ type. I am unable to change the color of it.

Also, I have a menu based on a third party component (Recipe) where I can’t find a way to change the color.

Any help would be greatly appreciated.

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#568368

Hi @ssinha,

Please provide your site url and temporary admin account via private reply so I can have a look first.

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#733464

Hi @ssinha,

Please provide your site url and temporary admin account via private reply so I can have a look first.

[ssinha Friend ssinhaJoin date: July 2014Posts: 183Downloads:57Uploads:11 Thanks: 68 Thanked: 12 times in 1 posts]

#568472

Adam, I had sent you the backend info through PM a couple of days ago (while trying to resolve the caption problem). You can use the same info to login in the backend. Thanks.

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#568625

Hi @ssinha,

Please open file root_folder/pdtemp/templates/ja_teline_v/css/custom.css and add this code :

.cat-red > .separator:hover,
.cat-red > .separator:focus {
background-color: #cc0000 !important;
}
.cat-red.active > .separator,
.cat-red.open > .separator,
.cat-red.active > .separator:hover,
.cat-red.open > .separator:hover,
.cat-red.active > .separator:focus,
.cat-red.open > .separator:focus {
background-color: #cc0000 !important;
}
.cat-green > .separator:hover,
.cat-green > .separator:focus {
background-color: #669900 !important;
}
.cat-green.active > .separator,
.cat-green.open > .separator,
.cat-green.active > .separator:hover,
.cat-green.open > .separator:hover,
.cat-green.active > .separator:focus,
.cat-green.open > .separator:focus {
background-color: #669900 !important;
}
.cat-blue > .separator:hover,
.cat-blue > .separator:focus {
background-color: #0077bb !important;
}
.cat-blue.active > .separator,
.cat-blue.open > .separator,
.cat-blue.active > .separator:hover,
.cat-blue.open > .separator:hover,
.cat-blue.active > .separator:focus,
.cat-blue.open > .separator:focus {
background-color: #0077bb !important;
}
.cat-cyan > .separator:hover,
.cat-cyan > .separator:focus {
background-color: #0099cc !important;
}
.cat-cyan.active > .separator,
.cat-cyan.open > .separator,
.cat-cyan.active > .separator:hover,
.cat-cyan.open > .separator:hover,
.cat-cyan.active > .separator:focus,
.cat-cyan.open > .separator:focus {
background-color: #0099cc !important;
}
.cat-violet > .separator:hover,
.cat-violet > .separator:focus {
background-color: #bf5fff !important;
}
.cat-violet.active > .separator,
.cat-violet.open > .separator,
.cat-violet.active > .separator:hover,
.cat-violet.open > .separator:hover,
.cat-violet.active > .separator:focus,
.cat-violet.open > .separator:focus {
background-color: #bf5fff !important;
}
.cat-orange > .separator:hover,
.cat-orange > .separator:focus {
background-color: #ff8800 !important;
}
.cat-orange.active > .separator,
.cat-orange.open > .separator,
.cat-orange.active > .separator:hover,
.cat-orange.open > .separator:hover,
.cat-orange.active > .separator:focus,
.cat-orange.open > .separator:focus {
background-color: #ff8800 !important;
}
.cat-purple > .separator:hover,
.cat-purple > .separator:focus {
background-color: #8c5de4 !important;
}
.cat-purple.active > .separator,
.cat-purple.open > .separator,
.cat-purple.active > .separator:hover,
.cat-purple.open > .separator:hover,
.cat-purple.active > .separator:focus,
.cat-purple.open > .separator:focus {
background-color: #8c5de4 !important;
}

1 user says Thank You to Adam M for this useful post

1. ssinha

[Author]

Posts