How to change CSS of blog posts?

So I can’t seem to figure out how to change the H1-H4 size of the blog posts. So, for my main site, I am fine with the large size of the Headers. However, they’re too big for my blog posts for ease of reading. But I only see how to change my headers on the main site. When I change them in the style guide, it is not affecting my blog. So I am trying to find where I can create new CSS classes specifically targeting the blog headers to change size and line height.

Here is just a random blog post to see the headers I need to change.

Here is my site Read-Only: Webflow - Daniel's Portfolio

@Daniel_Hughes

:small_blue_diamond: Option1: Create a Blog-Specific Wrapper Class

  1. Select your Blog Template page in the Pages panel (e.g., Blog Post template).
  2. Add a wrapper div around your blog content (if not already present).
  3. Give that wrapper a class like:
    blog-post-wrapper
  4. Now use custom CSS rules scoped to this wrapper.

:small_blue_diamond: Option2: Create Custom Header Classes

If you want manual control:

  1. Go into your Blog Post page in Webflow Designer.
  2. Select an H1 inside your blog post.
  3. Add a class, e.g., blog-heading-1 — don’t use All H1 Heading.
  4. Customize font-size, line-height, spacing, etc.
  5. Repeat for H2, H3, etc., as needed.
1 Like

Pixelgeek gives some visuals on this-

1 Like