Hello!
Could you please help me change font colour of the first menu item ‘Glow & Glam Sale’ in red in the sidebar menu?
Topic summary
Goal: change the first sidebar menu item (“Glow & Glam Sale”) font color to red.
Proposed solution (Shopify Online Store 2.0 themes):
- Navigate: Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS.
- Add Custom CSS targeting mobile view (≤768px) to style the first collapsible menu item:
- Selector uses nth-child(1) on the primary SidebarMenu and sets color: red !important.
- Screenshots were provided to show where to add CSS and the resulting red text.
Access details: a responder asked for the store URL (and password if protected) to verify. The store URL was later shared (www.gemopticians.com), no password provided.
Notes/Considerations:
- The provided CSS applies only on mobile (max-width: 768px). If desktop styling is needed, remove/adjust the media query.
- CSS relies on theme-specific classes (SidebarMenu__Nav, Collapsible__Button); may require adjustment if the theme differs.
Status: solution steps provided, pending confirmation from the requester. No final resolution reported yet.
Hello @Trivin , can you please share your store url and If the store is password-protected, kindly provide the password as well to facilitate access.
Hi @Trivin
To complete your requests, please follow these steps:
- Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
- Paste the code provided into the Custom CSS section.
@media screen and (max-width: 768px){
nav.SidebarMenu__Nav.SidebarMenu__Nav--primary > div:nth-child(1) > button.Collapsible__Button {
color: red !important;
}
}
Here is the result: https://prnt.sc/iIxQ3HCVpbrR
I hope this helps
Best,
Daisy
Hello! Its www.gemopticians.com