How do I decrease the font size of the website title in the header for smaller mobile devices

[lukafernada]

I have seen that the title header of my website does not format well on mobile, how can I make it so it decreases the font size of this once screen width is below a certain thresh-hold?

Thank you

[Moeed]

Hey @lukafernada

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[PageFly-Richard]

Hi @lukafernada

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

[Dan-From-Ryviu]

Please add this code to Custom CSS in Online Store > Themes > Customize > Theme settings

@media (max-width: 340px) {
.header__heading-link .h2 { font-size: 24px !important; }
}

[ZestardTech]

Hello @lukafernada

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:

@media(max-width: 767px) {
.header__heading-link .h2 {
font-size: 24px;
}
}