How can I change the font color for the Mega Menu using Dawn 2.0 theme?

Solved

How can I change the font color for the Mega Menu using Dawn 2.0 theme?

Robtuc
Visitor
3 0 2

Hey, 

 

I've been trying to change the text colour of just the header items on my shop, I have managed through several forum posts to change the main colour.

 

However, I have not been able to locate a fix for the text found embedded within the menu and also the circle showing the number of items in the basket I would like to change too. 

 

I am currently using the Dawn 2.0 theme. 

 

Any assistance is massively appreciated.

 

Thanks in advance.

 

Website is: 

www.luresedge.com 

luresedge font colour.PNG

Accepted Solution (1)

GemPages
Shopify Partner
5625 1261 1240

This is an accepted solution.

Hello @Robtuc 

 

You can follow these steps: 
1. Go to Online Store->Theme->Edit code

GemPages_0-1670296349898.png

2. Open your theme.liquid file, paste the below code before </body>

GemPages_1-1670296377645.png

<style>
a.mega-menu__link.mega-menu__link--level-2.link {
    color: #fff;
}
.cart-count-bubble {
    background: #fff;
}
</style>

I hope the above is useful to you.


Kind & Best regards, 
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center

View solution in original post

Replies 2 (2)

mt686
Shopify Partner
52 9 18

Hi, nice page!

Below is a code snipped that'll work. I've set the padding to 0 on each. If you want more space, just add a higher number before 'px' on each. Here you go: 

 

{% style %}
/* THIS IS THE HEADER ITEMS CODE */
a.mega-menu__link.mega-menu__link--level-2.link {
    color: #fff;
}

/* THIS IS THE SHOPPING CART # OF ITEMS ICON CODE */
.cart-count-bubble {
    background: #fff;
}
{% endstyle %}

 


Insert that into your theme.liquid file (online store > themes > click '...' on the theme you want, then 'edit code'). Insert it at the bottom of the file, right before the '</body>' tag. 

You can insert a hex code, (like '#fff'), into the code to change it to whatever color you'd like.

Alternatively, you can also use the app Easy Edits to make the edit yourself without touching any code, just click on the text and cart icon and change the text and background color accordingly. You can make edits and delete the app without paying for anything. 

Fair disclaimer, Easy Edits is an app I've worked on. If you need any help inserting the code or using the app, just let me know!

GemPages
Shopify Partner
5625 1261 1240

This is an accepted solution.

Hello @Robtuc 

 

You can follow these steps: 
1. Go to Online Store->Theme->Edit code

GemPages_0-1670296349898.png

2. Open your theme.liquid file, paste the below code before </body>

GemPages_1-1670296377645.png

<style>
a.mega-menu__link.mega-menu__link--level-2.link {
    color: #fff;
}
.cart-count-bubble {
    background: #fff;
}
</style>

I hope the above is useful to you.


Kind & Best regards, 
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center