I understand the CSS code varies from theme to theme. I can’t apply the color to the " New Arrivals!" menu item. Can someone please help me?
Topic summary
Goal: change the text color of a single main menu item (“New Arrivals!”) in the Craft theme.
Key steps and solution:
- Store preview URL and desired color (#716A56) were shared.
- Desktop: Adding custom CSS in Online Store > Themes > Customize > Theme settings > Custom CSS solved it:
• Selector used: #HeaderMenu-new-arrivals span { color: #716A56; } - Mobile: To affect the drawer menu, an updated rule was advised:
• Selectors: #HeaderDrawer-new-arrivals , #HeaderMenu-new-arrivals span
• Color shown in the example: rosybrown (note: differs from the requested #716A56 and can be replaced with the desired hex).
Artifacts: a screenshot was provided to illustrate where to add CSS but isn’t essential to apply the fix.
Outcome: The desktop change worked immediately; the mobile guidance was provided and acknowledged. Issue resolved; no remaining open questions.
1 Like
Hi @Element4
Would you mind to share your store URL? Thanks!
Yes, here it is: https://zie4ii0gl880aize-70551339223.shopifypreview.com
Color code is: #716A56
Thank you!
Hi @Element4
Please add this code to Online Store > Themes > Customize > Theme settings > Custom CSS
#HeaderMenu-new-arrivals span { color: #716A56; }
Great, it worked! And for mobile version?
Please update the code
#HeaderDrawer-new-arrivals,
#HeaderMenu-new-arrivals span { color: rosybrown; }
Thank you!!!