Megamenu Hover Colors - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!

Megamenu Hover Colors

P

Pascal

Template 3 years ago

Hi I tried to change the hover color of the shaper wayne template:

.sp-megamenu-parent > li > a:hover, .sp-megamenu-parent > li > span:hover { color: #a67c00 !important; } Adding this to custom.css in templates/shaper_wayne/css/ .sp-megamenu-parent > li > a:hover, .sp-megamenu-parent > li > span:hover { color: #75bee9 !important; }

But no matter what I do it doesn't change?

How can this be changed. Regards, Pas

0
13 Answers
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #48026

Hi

Could you please give me your site URL so that I can check?

-Regards

0
P
Pascal
Accepted Answer
3 years ago #48029

Hi, just added url to hidden content.

Thanks

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #48099

Hi

Where is your megamenu?

https://prnt.sc/23k2f4j

0
P
Pascal
Accepted Answer
3 years ago #48107

There is only 1 menu? This is the css (sp-megamenu-parent) How can I change hover color?

.sp-megamenu-parent > li > a:hover, .sp-megamenu-parent > li > span:hover { color: #a67c00 !important; }

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #48328

Yes you can change the hover color by using this css but I dont see any megamenu on your site. If I find our then I should give you the correct code by inspecting that menu

0
P
Pascal
Accepted Answer
3 years ago #48354

Hi, you should see the top menu? The css I tried to change is: .sp-megamenu-parent > li > a:hover, .sp-megamenu-parent > li > span:hover

When changing this in /templates/shaper_wayne_corp/css/custom.css nothing happens

But when I change this in template settings custom code it can be changed.

This is not ideal because my css are now in different files?

How can this be done in custom.css ?

Regards

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #48358

For inserting css follow this please

Custom css

Note: Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

0
P
Pascal
Accepted Answer
3 years ago #48360

Hi,

Normally I use Extensions>Templates>Templates>("shaper_wayne_corp") /css/custom.css

This is where all css

Since I have 3 template styles it's a bit messy to add css to each template style.

That's why I asked if this css can be done in 1 place/files ?

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #48473

Hi

Its better to use this css under template css

0
P
Pascal
Accepted Answer
3 years ago #48492

Hi, As mentioned before....

When changing this in /templates/shaper_wayne_corp/css/custom.css nothing happens

Also noticed this for portfolio and blog css

I would like to have all custom css in 1 place.

thanks, Pas

0
Ofi Khan
Ofi Khan
Accepted Answer
Support Agent 3 years ago #48747

Hello Pascal

You can try a trick here. Use custom.css for one template. On the other template, add link to another file (for example: mycss.css) here: Template Options -> Custom Code -> Before Head <link href="/templates/shaper_wayne_corp/mycss.css" rel="stylesheet" />

Then on mycss.css file, use different CSS specifically for the duplicated template. I hope you understand the workaround.

Best regards

0
P
Pascal
Accepted Answer
3 years ago #48942

Thanks, This helps keeping things organized ;) Did not try yet, but could I put all css in /templates/shaper_wayne_corp/css/

This way I could add css for portfolio and blog style in 1 place.

Thanks, Pas

0
Ofi Khan
Ofi Khan
Accepted Answer
Support Agent 3 years ago #49055

Yes, you can write every CSS in one place and it will apply to the template. You are welcome.

0