Header

[Hyo]

Hello everbody,

I have one simple question. As you can see below the title of the mobile version is too big.

Can you please explain me, how to decrease the font size of the title?

Thank you, 

Hyo

[Gabe · Accepted solution]

Hey @Hyo 

Thanks for the screenshot and you have reached the German community here but we can chat in English too, that's no problem! 😉

The easy way

So the issue here is that your shop name is being used as the logo and as the shop name is seoul.berlin it is a bit long and doesn't fit into the limited pixel width of your header bar on mobile w/o a line break. So in this case, what you can do is go into your theme editor and change the following settings and it should show w/o a line break:

You could also make an image showing your shop name the same way as in your screenshot above, but the logo Image needs to have a transparent background, which you can easily create with a free online tool like Adobe Express. Then upload your logo as an Image to the header in your theme editor. That way you have more control over the size or your branding logo.

Do it DIY?

If all that is not to your satisfaction, you will need to change the title size in the liquid and css, but this can get messy and it's not garanteed it will work depending on how your theme code is structured.

Also the fact that code changes can exclude your theme from future theme updates. But see a thread on this topic here where you may be able to use the CSS Editor within the theme editor:

Simply add the code to the CSS editor and see if it works. Hope that helps! 😉

[Hyo]

Hello Gabe,

thank for the quick answer. It helped. I could finally decrease the font size of the header.

Thank you!! 

Hyo

[Gabe]