How am I able to make this bold?

Store Design
, , ,

Topic summary

A user seeks help making specific menu text bold in their Shopify theme.

The initial response suggests checking theme settings first, then manually adding CSS by locating the menu item’s class name and applying font-weight: bold;.

When asked how to find the class, the responder recommends using browser inspect tools or sharing the website URL for direct assistance.

After the user provides their Shopify preview link, a detailed solution is offered:

  1. Navigate to Online Store > Themes in Admin
  2. Open the CSS file (main.css, base.css, style.css, or theme.css) under Assets
  3. Add this CSS code at the bottom:
.menu-item.has-megamenu > div > ul > li:first-child {
  font-weight: 600;
}
  1. Save the file

The solution targets the first child list item within the megamenu structure. An accompanying screenshot shows the expected result.

Summarized with AI on November 8. AI used: claude-sonnet-4-5-20250929.
1

Hello, how am I able to make the circled text bold?

ricky24_0-1719348646558.png
ricky24_0-1719348646558.png1114×932 49.4 KB

1 Like
2

Hi Ricky, not sure if there’s an option in the theme settings to do this (usually not). Check that first.

If not, you can find the class for those menu items, and add a css rule that will have the following property:

.class-name {
  font-weight: bold;
}
3

Hello

4

How am I able to find the class?

5

You should be able to get it by inspecting the page and finding the menu item. If you post your website address, I can get it for you.

6

https://fhj9l4mmbn1nghyc-12053444.shopifypreview.com

7

Hi @ricky24

Check this one.

  1. From you Admin page, go to Online Store > Themes
  2. Select the theme you want to edit
  3. Under the Asset folder, open the main.css(base.css, style.css or theme.css)
  4. Then place the code below at the very bottom of the file.
.menu-item-has-megamenu > div > ul > li:first-child {
    font-weight: 600;
}