▼
Streaming live at 10am (PST)

How we can change the space between element for blog post / article?

Design help General
#1

Hello,

1- On my blog posts I see spaces that are much too big and not suitable.

How I can change the space for all articles ? I tried to change the settings in Style Guide but I didn’t find why I have theses spaces.

2- Also, can you tell me if we can create a custom blogging text design? For example creating a headline or typeface style or directly somethings new that is truly unique and ends up on the article edit page?

Because currently I cannot manually add elements in the “article” block in order to style these elements.

https://preview.webflow.com/preview/wamultipotentiel?utm_medium=preview_link&utm_source=designer&utm_content=wamultipotentiel&preview=04e79208e9a45c1ad6e9b088c8b7ebb5&pageId=5fe1c1edf738812416fad1e9&mode=preview

#2

are you trying to achieve something like this?

Untitled2

#3

No I really talk about the text of the Article

#4

You mean the text size, or just the spacing inbetween text elements, or the overall space of each CMS item?

#5

Yes exactly that. You know how I can change this ?

#6

Hi,

Try changing the highlighted attribute:
Untitled

Cheers

#7

I talk more about this spaces…

téléchargement (2)
téléchargement (2)797×703 64.8 KB

#8

Hi Romain,

That space is usually created by having margin/padding values.
What is the name of the page of that screenshot?

Cheers

#9

This is the link of post. Yes I tried to change the margin/padding in style guide but I don’t see every type of text style like H2, H3 etc… I don’t know how I can change the style of tag no present in style guide

#10

Hi Romain,

Is this what you’re trying to achieve?

Untitled
Untitled839×322 35.2 KB

What you need to do to achieve this:

  • Select your “Article” element, and set “get text from” from “article body” to “none”.
  • After that, your blog post will disappear, but fear not, it’s not gone.
  • Select the H2 element and change its margin value which is set as “56px”. Set a lower value.
  • Now, select your “Article” element again, and set “get text from” from “none” to “article body”.
  • Your blog post will appear again with less margin spacing.
  • Tweak the spacings as you’d like.

Keep in mind that this might affect ALL H2 elements. A good solution would be to define a fixed structure (like setting an H2 element with a fixed space and top/bottom margin) and then write out your blog posts in a reader-friendly, structured way.

Hope this helps
Cheers

#11

Hello :slight_smile:

Thank you very much for this feedback. Indeed the space problem came from the H2. On the other hand I knew this technique and precisely I cannot find how to change or add H3, H5, Citation. How I can add theses elements present in my post editor (when I write it) and change the style of them.

thanks :slight_smile:

#12

Hi Romain,

You can add H’s as you write along in the editor inside the CMS item, but to change margins or paddings you need to repeat the steps i described above.

That’s why i said you should set your H’s to fixed margin and padding values so that you don’t end up with different spacings in different blog posts.

Cheers

#13

Hello Kimmy,

I understand what you say but when I do that I can’t add H5 (for exemple).
I see H2, H4 and paragraph but I can’t add anything else to change it.

Screenshot (4)
Screenshot (4)1426×817 94.4 KB

Thanks