How am I able to remove these text or unbold them from our Header/Navigation bar?
Topic summary
Goal: remove or unbold specific text in the header/navigation (mega menu headings) and adjust alignment/weight of a targeted item.
Key steps and inputs:
- Store preview URL was shared to inspect the header/navigation.
- A CSS solution was provided to hide the mega‑menu column headings, with instructions to paste the style into theme.liquid before the closing .
Further styling requests:
- The poster asked how to move the menu content left and bold a specific (circled) item. Another reply advised adding code above the closing in theme.liquid, but no actual code snippet was included in the message.
Mobile considerations:
- The latest question asks whether the solution can be applied to the mobile header navigation. No answer has been posted yet.
Notes:
- theme.liquid is Shopify’s main theme layout file; CSS controls visual styling; a mega menu is an expanded navigation with grouped headings/columns.
- Images are central to identify which text to hide and which item to bold.
Status: ongoing. One CSS approach to hide headings was provided, but alignment/bolding and mobile-specific changes remain unresolved, with conflicting guidance on CSS placement ( vs ).
Hello @ricky24
Can you share store URL?
You can add code by following these steps
-
Go to Online Store → Theme → Edit code.
-
Open your theme.liquid file
-
Paste the below code before on theme.liquid
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.
Hi @ricky24
This is Richard from PageFly - Shopify Page Builder App
Please add this code to your theme.liquid above the to get this solved
Step 1: Online Stores > Themes > More Actions > Edit code
Step 2: click on theme.liquid and paste the code above the
Hope this can help you solve the issue
Best regards,
Richard | PageFly
Hello! Am I able to apply this to mobile header navigation?