Debut : changing the font size of h2 tag only on the blog page

Store Design
1

I am using the theme “Debut”.

h2 tag is smaller than h3 tag. I want to change the css of h2 tag only for the blog.

What should I do?

If possible, I would like to apply my own CSS only to the blog CSS, not just the h2 tag.

スクリーンショット 2021-07-03 9.12.29.png
スクリーンショット 2021-07-03 9.12.29.png516×354 4.44 KB

1 Like
2

@yunonon

Please share your store blog URL.

3

@dmwwebartisan

Here is my blog URL.

Thank you

1 Like
4

@yunonon

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

body.template-article h2 {
    font-size: 22px !important;
}

This works for blog page h2 only. The above code I have given 22px font size you can change it as per your need.

Thanks!

5

@dmwwebartisan

I tried to underline it using that code, but h2 was also applied to the shop logo, and the appearance changed.

Is it possible to apply the code only to the text of the blog?

6

Please follow the steps:

  • Step 1: Go to Online store > Themes > Actions > Edit code.
  • Step 2: Go to Asset > theme.scss.liquid and paste this at the bottom of the file:
    .template-article article h2{
    font-size: 20px !important;
    }