New Shopify Certification now available: Liquid Storefronts for Theme Developers

Removing underline from homepage menu Header in Dawn 12.0.0

Solved
Dibiesse
Tourist
9 0 0

Hello everyone,

I'm encountering a small issue that I can't seem to resolve. I recently updated my Dawn theme to version 12.0.0, and a problem has surfaced. On the homepage, the header menu items are underlined by default, which I do not want.

Dibiesse_0-1698917736448.png

 

This underlining does not occur when I navigate to any submenus or other pages.

 

Dibiesse_1-1698917870338.png

 

How can I remove the default underlining from the menu items on the homepage?

Thank you in advance for your help!

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
5679 1047 1073

This is an accepted solution.

Hi @Dibiesse 

Go to your Online store > Navigation > Main menu, add a link to all parent menus, and then check again.

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now

View solution in original post

Replies 16 (16)
Dan-From-Ryviu
Shopify Partner
5679 1047 1073

Hi @Dibiesse Could you drop your store link here to check?

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now

Dibiesse
Tourist
9 0 0

Hi @Dan-From-Ryviu, 

Thank you for offering to help! My store isn't active yet.

https://anais-nail-design.myshopify.com/
Password: chatso

I appreciate your time and assistance with this issue.

 

Moeed
Shopify Partner
3051 761 925

Hey @Dibiesse 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.header__active-menu-item {
    text-decoration: unset !important;
}
</style>

RESULT:

Moeed_0-1698920784822.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
Dibiesse
Tourist
9 0 0

The previous fix worked, but now the menu items do not underline on hover. Could you please advise on how to restore the hover underline effect?

Moeed
Shopify Partner
3051 761 925

Hey @Dibiesse 

 

Remove the previous code and add this new code above </body> in theme.liquid file with the same steps.

<style>
.header__active-menu-item {
    text-decoration: unset;
}
.header__active-menu-item:hover {
    text-decoration: underline !important;
}
</style>

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
Dibiesse
Tourist
9 0 0

Hey Moeed, thanks!

The fix worked, but another issue has arisen: when I'm in a menu, it no longer stays underlined to indicate that it's the active one.

Dibiesse
Tourist
9 0 0

Additionally, when I'm in a menu, it no longer remains underlined to indicate that it is the active one.

VanIslandWhale
Tourist
15 0 3

Is there an equivalent code for the Debut theme? I don't want underlines in my header at all

Dan-From-Ryviu
Shopify Partner
5679 1047 1073

This is an accepted solution.

Hi @Dibiesse 

Go to your Online store > Navigation > Main menu, add a link to all parent menus, and then check again.

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now

Dibiesse
Tourist
9 0 0

Hi @Dan-From-Ryviu 

Here? They are all linked to home page (besides contact).

Dibiesse_0-1698925085318.png

 

Dan-From-Ryviu
Shopify Partner
5679 1047 1073

That causes the issue of why you get your menu text underlined when you are on the homepage. If it does not have a link, you can add # in links

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now

Dibiesse
Tourist
9 0 0

Thank you for your reply. That makes sense! However, after adding # to all the links, the problem still persists.

Dibiesse_0-1698925698275.png

 

Dan-From-Ryviu
Shopify Partner
5679 1047 1073

Did you Save the menu after adding it? 

Screenshot_6.jpg

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now

Dibiesse
Tourist
9 0 0

Yes I did.

Dibiesse
Tourist
9 0 0

I've figured out the issue: the submenus were also linked to the homepage.

Thank you so much for your help!

 

Dibiesse_0-1698926441406.png

 

Dan-From-Ryviu
Shopify Partner
5679 1047 1073

You are very welcome

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now