Issue: In a Shopify store using the Refresh theme, the menu’s active state (underline/highlight) appears on some pages but not others, as shown in screenshots.
Findings: Collection pages are not receiving an “active” class. One menu item (“Padel Rackets”) links to a URL with filters (/collections/…/Brands+Shape+Playing-style+Balance) but resolves to the base collection URL, so the menu link doesn’t match the final page URL, preventing the active state.
Recommendations: Ensure all menu URLs exactly match the destination URLs users land on. Implement or fix logic to mark collection pages with an active class (may require developer adjustments similar to the home menu behavior).
Bold styling request: Two approaches were provided—(1) add CSS to theme files to make menu items bold, and (2) preferred: add Custom CSS in Theme Settings (e.g., nav a { font-weight: bold; }) to avoid blocking theme updates. The bold styling change was confirmed to work.
Status: Bold menu styling resolved. Active/underline inconsistency remains; action items are to correct menu URLs and possibly add code for active classes. Screenshots were used to illustrate the issue.
Hi,
I have an error in my shop. Depending on the landing page the menu is highlighter and aunderlined or not.
IN this example you cn see that the menu underlines the page I am landed
However, in some other pages thaat is not happening. Exmple
This is the URL of my shop: https://abaf7d-8.myshopify.com/
I aam using Refresh theme.
thank you in advance!
Hi,
I had a look over your store and unfortunately I couldn’t find a quick solution for this matter. Your collection pages are not getting marked by an active class. For this, you may consider hiring a developer.
Cheers!
Hi,
appreciate the quick response.
Taking the chance, I wouls like to have menu items bold (similar to the one below). Do you know how that could be done?
thanks!
Your “Padel Rackets” link points to “/collections/padel-rackets-1/Brands+Shape+Playing-style+Balance” but when followed you end up at “/collections/padel-rackets-1”
Why the links in your menu are like this? Ensure your menu links match the address where your visitors will actually go…
Hi @Nachorc21
You need a developer to change some codes same like in the home menu.
For the bold check this one.
From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
Find the theme that you want to edit and click on “Actions” and then “Edit code”.
In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
.header__menu-item span {
font-weight: 900;
}
And Save.
Result:
Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!
As for making menu items bold – do not edit theme code, this will prevent your theme from updating.
Use “Custom CSS” under Theme Settings. The code can be like below or
nav a {
font-weight: bold;
}
thank you very much!. It worked