How can I enlarge the font size of my Header Tagline text?

Store Design
1

Anybody know how I can increase/enlarge the font size of my Header Tagline text: "buttonless short sleeved shirts & framed artwork for everybody"?

URL: https://www.wathart.com/

Thanks in advance!

2 Likes
2

@WathArt

Please add the following code at the bottom of your assets/theme.scss.liquid file.

.site-header .rte.tagline {
    font-size: 1.3em;
}

Hope this works.

Thanks!

3

@WathArt

Thanks for post

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.rte.tagline {
    font-size: 21px; /* change font size as you like */
}
1 Like
4

Thank you so much! That works!

Also, what I forgot to ask about in my initial inquiry, how can I change the font style for this tagline text?

Thank you again for your kind and competent assistance. Much appreciated.

1 Like
5

@WathArt

For font style you can add code like the below.

.rte.tagline {
    font-size: 30px;
    font-style: italic;
}

You can remove the old code and add this new one. Hope this helps.

Thanks!

6

Thanks again! Very much appreciate it.

Is it possible for me to import a font style into the CSS? For example if I found a font on a website

like www.dafont.com. Is it possible to apply one of these font styles to the tagline?

7

Thank you for your kind attention to my inquiry and for your suggestion. Much appreciated.

8

@WathArt

Yes is possible to add a custom font please flow below step

  1. Go to Online Store->Theme->Edit code
    2.Asset->/theme.scss.liquid->upload your custom font all font tyep = TTF, OTF, WOFF, WOFF2, SVG
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@font-face {
font-family: 'Montserrat-Regular';
src: url('{{ 'Montserrat-Regular.eot?' | asset_url }}');
src: url('{{ 'Montserrat-Regular.eot??#iefix' | asset_url }}') format('embedded-opentype'),
url('{{ 'Montserrat-Regular.woff' | asset_url }}') format('woff'),
url('{{ 'Montserrat-Regular.ttf' | asset_url }}') format('truetype'),
url('{{ 'Montserrat-Regular.svg#Montserrat-Regular' | asset_url }}') format('svg');
font-weight: normal;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: antialiased;
}

can you please just change the font name, for example, Montserrat-Regular to your custom font name

1 Like
9

Thank you once again for your kind assistance. Very much appreciated!

Cheers!

1 Like
10

@WathArt

it’s my pleasure to help us

1 Like
11

I would like to know how to adjust the color of the tagline in simple theme to a certain hexcode#

1 Like
12

@AimHighShop

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

13

Hi Ketan,

I am not able to see the Tagline i added, what should be the problem?

Thanks,

Amar

1 Like
14

@wmt1

oh sorry for that issue can you please store url