Font in Section CSS - Capital Theme

Store Design
,
1

Hello guys,

I’m using the Capital Theme and I’m trying to customize a specific rich text section. The section has a headline and a text paragraph. I would like to give the headline another font than configured in the theme options. The section gives me the opportunity to add a custom css.

Changing the color works perfect. But adding another font (Lato is a font which Shopify supports) doesn’t work.

Any idea what I’m doing wrong?

h2 {
  color: red !important;
  font-family: "Lato", sans-serif !important;
}

Best regards
Ramin

2

Hi @Ramin83

Thank you for reaching out to the Shopify community. I’d be glad to assist you. Could you kindly share your store URL and password (if it’s password-protected) so I can review it and provide you with an update?

3

Hey @Ramin83

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

4

URL:

Password:

5

Hi @Ramin83

I see it working with the code here
It’s definitely a Lato font

DaisyVo_0-1738657314486.png
DaisyVo_0-1738657314486.png1788×756 175 KB

6

Hey @Ramin83

If you want to change it to a different font compared to the current one which you’re using right now then feel free to try this code below.

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

RESULT

Moeed_0-1738657457816.png
Moeed_0-1738657457816.png1894×905 146 KB

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

Best Regards,
Moeed

7

No, it is definately not the Lato font. I just changed it to “Open Sans” and it looks the same. It seems, that the theme is ignoring the custom font.

8

I don’t want to change the headline for all rich text sections. Just for the specific one.

9

DaisyVo_0-1738658307240.png
DaisyVo_0-1738658307240.png1835×800 125 KB

DaisyVo_1-1738658318703.png
DaisyVo_1-1738658318703.png1886×688 113 KB

I still see them as different. :sweat_smile:

10 
body #shopify-section-template--18582657958133__rich_text_9tyfwf h2{
  font-family: monospace !important;
}

so try this code
It’s a bit like Moeed’s suggestion but it only works for h2 here

11

This is Lato when you look at Google Fonts https://fonts.google.com/specimen/Lato?preview.text=AESTHETIC%20%26%20MIND

It looks completely different. Look at the “&”

12

Ok, it seems that I have to hire a Shopify Dev :grinning_face_with_smiling_eyes:

But thanks for your help.