Change the size of the text in the header

Solved

Change the size of the text in the header

Aleksandra23
Excursionist
27 0 6

Hello Team!

Tell me, please, how do I change the size of the text in the header? I'm using the Dawn theme. I don't have the theme.css file in my code. I also want to change the pages with Privacy policy, Refund policy, Shipping policy, Terms of service so that the text is stretched to the whole page, as in FAQs. Please tell me how to do this.

Here is the link to the website https://sofascraper.com /

Thank you very much!

Accepted Solution (1)

diego_ezfy
Shopify Partner
2971 571 922

This is an accepted solution.

@Aleksandra23,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:

<style>.header__menu-item{
    font-size: 20px !important;
}

@media (max-width: 749px){
    .menu-drawer__menu-item{
        font-size: 14px !important;
    }
}</style>

 

You can change the values as per your wish:

 

20px = font size for desktop
14px = mobile



Kind regards,
Diego

 

View solution in original post

Replies 8 (8)

Zworthkey
Shopify Partner
5581 641 1581

Hi,
@Aleksandra23 
Welcome to Shopify Community.
We are always happy to help you.

Which you mean 'header menu text size' you want to change.

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:

 

.header__menu-item {
    padding: 1.2rem;
    text-decoration: none;
    color: rgba(var(--color-foreground),.75);
    font-size: 22px !important;
}

 

Add this code in the base.css

thank you.

Aleksandra23
Excursionist
27 0 6

Thank you very much!I tried, but unfortunately, this code didn't work for me. Please tell me another solution or I'm doing something wrong.

Screenshot_3.pngScreenshot_5.png

ZestardTech
Shopify Partner
6060 1083 1452

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.min.css and paste this at the bottom of the file:

main#MainContent {padding-top: 106px !important;}
.header__content-wrapper .header__icons,
.header__content-wrapper .header__heading { margin: 10px 0;}
.header__content-wrapper li.menu-navigation__list-item {padding:10px 0}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
Aleksandra23
Excursionist
27 0 6

Thank you very much for the answer! Only I can't find this file.

Please help me figure it outScreenshot_1.png

Savior
Shopify Partner
537 108 161

@Aleksandra23 

1. Go to your store Assets > base.css and paste the lines at the bottom of the file

 

.header__menu-item span {
font-size: 18px;
}

 


If helpful then please Like and Accept Solution. Want to modify or custom changes on store Hire me. Feel free to contact me on shopify.dev.34@gmail.com | Shopify Design Changes | Custom Modifications In to Shopify Theme

 

banned

diego_ezfy
Shopify Partner
2971 571 922

This is an accepted solution.

@Aleksandra23,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:

<style>.header__menu-item{
    font-size: 20px !important;
}

@media (max-width: 749px){
    .menu-drawer__menu-item{
        font-size: 14px !important;
    }
}</style>

 

You can change the values as per your wish:

 

20px = font size for desktop
14px = mobile



Kind regards,
Diego

 

Aleksandra23
Excursionist
27 0 6

Thank you very much!

This code works

Andrey13
Visitor
2 0 0

It worked, thank you !