[Resolved] Padding for pages and posts

[Radu]

Hi Tom,

I am trying to achieve the following:
Build a website with landing pages (wordpress pages) and blog section (wordpress posts). I would like to get rid of the sidebar on pages (keep sidebar on articles and blog section only) and use full content. However, the text/paragraphs are too long for easy reading, so I use “content padding” option to increase text margins on the body of pages. However, the “content padding” option affects both pages and posts.

What’s your recommendation for best achieving this? Should I use custom css on each page for increasing text margins?

Do you think it would be a good idea to add to GP Customizer the option of editing text margin separately for pages and posts?

I could use Elementor for editing each page, but I am trying to keep things as simple as possible.

Thanks,
Radu

[Leo]

Hi there,

So what are the problems you are running into?

Just the content padding?

Can you link me to what you have so far?

You can edit the original topic and use the private URL field.

Let me know 🙂

[Radu]

Hi LEO,

I want different values for text padding in pages and posts.
x padding in pages and y padding in posts and blog page.
In customizer, editing text padding affects everything (posts, pages etc.)

Thanks,
Radu

[Leo]

We don’t actually have text padding option in the customizer.

Are you referring to line height?

Let me know 🙂

[Radu]

Personalize – Arangement – Container – Content padding

[Tom]

Set the content padding to what you want in the blog and posts within the Customizer.

Then add this CSS:

.page.separate-containers .inside-article,
.page.one-container .site-content {
    padding: 30px;
}

[Radu]

Thanks Tom. That is what I was looking for.
And for setting the padding on mobile devices?

Thank you!
Radu

[Leo]

It would be something like this:

@media (max-width: 768px) {
    .page.separate-containers .inside-article,
    .page.one-container .site-content {
        padding: 30px;
    }
}

More info here if you are interested: https://docs.generatepress.com/article/responsive-display/

[Radu]

Perfect! Thanks!!

[Leo]

No problem!

[Edwin]

Hi

I need it the other way around. Padding only for Post pages.

Thanks

Edwin

[Leo]

Try this:

@media (max-width: 768px) {
    .blog.separate-containers .inside-article {
        padding: 30px;
    }
}

If this doesn’t work, please open a new topic and link us to the site in question.

Thanks!

[Igor]

Hi Leo, sorry for re-opening, but I would like to have different padding ONLY on latest posts page.

If I use this:

.page.separate-containers .inside-article,
.page.one-container .site-content {
  padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 40px
}

This solves the pages, but comments and single articles/posts are still with the Customizer/Container setting (10, 10, 0, 10).

Thanks!

[David]

Hi there,

can you share a link to your site? ( Resolved topic automatically remove any private information )

[Igor]

Hi David, here you go.

Thanks

[Author]

Posts