Strange effect when hovering over footer / main nav - How to remove it? Thanks

Store Design
, , , ,
1

Hello everyone,

When I hover over items in the nav menu, as well as Resource items in the footer menu, I’m getting a strange effect that changes the shade of the text, and removes the bold.

Could someone help me figure out how to remove?

Thanks!

2 Likes
2

Link: https://www.cardboardhouse.store/
Store pw: CBH25

3

Hi there, I hope you’re doing well.

It sounds like a theme’s feature.

What’s your theme name?

Did you buy it, select it from the theme store?

Also, if you can share your Shopify URL to take a look at it would be great,

4

Hello Julio,

Thanks for the reply.

It’s the Enterprise theme, it’s paid for so I can edit the code.

https://www.cardboardhouse.store/
CBH25

Thanks!

5

Thanks for the reply! I had a look and couldn’t find the option you’re speaking of :disappointed_face:

If you wanted to have a look, my storefront details are:
cardboardhouse.store
CBH25

Thanks

1 Like
6

cardboardhouse.store
CBH25

Thanks!

7

Yep, indeed it sounds like a theme feature included in the theme’s code instead of a setting within your admin.

Go to Shopify Admin > Online Store > Themes > Actions > Edit Code. Navigate to Assets > base.css, theme.css, or style ccs (depending on your theme). Look for hover-related styles, such as:

css

.header__menu-item:hover {
  font-weight: bold !important;
  color: inherit !important;
}
.footer__content-top a:hover {
  font-weight: bold !important;
  color: inherit !important;
}

If you find any rules that change the font-weight or color, modify them to preserve bold styling.

2. Override Hover Effects with Custom CSS

Add this code at the bottom of your CSS file to ensure bold text remains:

css

.nav-menu-item:hover, .footer-menu-item:hover {
  font-weight: bold !important;
  color: inherit !important;
}

Please, create a copy of your theme to give it a shot.

Don’t modify your current and published theme: Create a copy.

Also, just in case it’s helpful, there’s a similar case here: https://community.shopify.com/c/technical-q-a/change-hover-effect-of-all-texts-to-bold-instead-of-underscore/m-p/2110248

best,

Julio

Shopify Support.

8

Hey Julio,

Thanks for the reply, however it didn’t work :disappointed_face: - I’ll reach out to the support for the theme.

Thanks for trying

1 Like
9

Sorry to hear that it did not work.

We’d need to double check the theme’s code.

Reaching out to your theme developer is a good idea as well.

All the best.