Making subheadings bold on Sahara Theme

Store Design
,
1

Hello,

I want to make my subheadings on my shopify menu bold, but am struggling to find the right code, have searched several articles with no luck. I want these bold on desktop and mobile.

My theme is Sahara.

Screenshot of the areas I want to make bold, I have highlighted them in yellow.

Appreciate it if someone has the solution!

Capture.PNG
Capture.PNG1773Ă—339 8.14 KB

2

Hey @ABNBSKN

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

3

Hello There,

Please share your store URL and password.
So that I will check and let you know the exact solution here.

4

https://d49d41-40.myshopify.com/?preview_theme_id=

Password: stewly

5

Hi @ABNBSKN

Go to Online Store > Themes > Edit code > open theme.liquid file, after paste this code
6

This has worked on desktop but not mobile. Anyway to get it working on mobile view?

Thank you

7

Hello @ABNBSKN

Go to online store ---------> themes --------------> actions ------> edit code-------> assets-----> section-header.CSS
and add this code at the very end of your file.

.header__nav-links-item>.header__nav-dropdown-link {
    font-weight: 500;
    font-size: medium;
}

and the result will be

2.png
2.png1341Ă—688 195 KB

If this was helpful, hit the like button and mark the job as completed.
Thanks

8

Hi @ABNBSKN

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > base.css and paste this at the bottom of the file:
.footer__menu-title {
font-weight: bold;
}

ZestardTech_0-1719388626687.png
ZestardTech_0-1719388626687.png1739Ă—709 64.4 KB

9

Thank you for this, I just wanted it bolder so i adjusted the font size to small and the weight to 700. This again, worked for desktop but no change on mobile which i would like.

Thanks

10

Go to online store ---------> themes --------------> actions ------> edit code-------> assets-----> component.drawer.CSS
and add this code at the very end of your file.

.drawer_submenu-btn {
font-weight: bold;
font-size: 14px;
}

3.png
3.png400Ă—832 124 KB

If this was helpful, hit the like button and mark the job as completed.
Thanks

11

Hello @ABNBSKN
due to its a drawer, you need to add another CSS for the drawer. use this css for mobile

Go to online store ---------> themes --------------> actions ------> edit code-------> assets-----> “component-drawer.css” file

button.drawer__submenu-btn {
    font-weight: 700;
}

add this CSS at the very bottom for file
Thanks

12

Could you share your store URL to check?