Re: change main menu front size

Solved

How can I change the main menu font size on my website?

X-DREAM
Excursionist
29 0 3

I want only change the main menu front size, but i can't find the base.css file under assets folder to adding the code. 

Accepted Solution (1)

Made4uo-Ribe
Shopify Partner
9029 2160 2664

This is an accepted solution.

Hi @X-DREAM 

Check this one. The current size of the font is .9rem

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 "main-nav.css or core.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:

 

nav.\#main-nav a {
    font-size: 20px !important;
}

 

 And Save. 

Result:

Made4uoRibe_0-1704982289503.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Create custom Shopify pages effortlessly with PageFly's drag-and-drop ⚙️.

View solution in original post

Replies 5 (5)

Moeed
Shopify Partner
6292 1711 2056

Hey @X-DREAM 

 

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

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Create high-converting pages - PageFly Page Builder.


X-DREAM
Excursionist
29 0 3

Mike-Consentik
Shopify Partner
193 30 37

Hi @X-DREAM 

This is Mike from Omega

If you could not find the base.css, you can add the code to core.css or main-nav.css.

I check and see these files on your store.

Hope my answer will help you

If you find this helpful, please give it a like or mark it as a solution.
Consentik GDPR Cookie Banner: Effortlessly stay in compliance with EU GDPR and CCPA with Google Consent Mode V2. Free plan available and 24/7 Support
X-DREAM
Excursionist
29 0 3

Thanks Mike, can you please also check the blew code if this is the right code.

 

summary.header__menu-item.list-menu__item.link.focus-inset {
font-size: 20px !important;
}
a.header__menu-item.header__menu-item.list-menu__item.link.link--text.focus-inset {
font-size: 20px !important;
}

Made4uo-Ribe
Shopify Partner
9029 2160 2664

This is an accepted solution.

Hi @X-DREAM 

Check this one. The current size of the font is .9rem

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 "main-nav.css or core.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:

 

nav.\#main-nav a {
    font-size: 20px !important;
}

 

 And Save. 

Result:

Made4uoRibe_0-1704982289503.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Create custom Shopify pages effortlessly with PageFly's drag-and-drop ⚙️.