Site logo

Archived topic

Generate blocks grid and container

12 replies · Started by Lukasz on June 9, 2020

Viewing posts 1–13 of 13

Hi,
How can I implement this view with generate blocks and gp premium?. Should I use container then grid (3 elements). I am glad to hear any tips to implement the view because it looks awesome.
https://ibb.co/JHRxr1v

PS. this is screenshot from site library (demos) as combination generate blocks and generatepress

Hi there,

No need to add a container block. Just add a grid block with 3 columns should work.

The icons are using a headline block with negative top margin.

Let me know if this helps :)

Hi Leo,
thanks for tips, I am learning how to use effective generateblocks. I see a huge potential of that. I am wondering where I can find html icons svg. Is there some official repository?

I am facing with another problem. I defined .entry-content class 775px for blog posts (readability and so on). Moreover I've spotted that the class is above generateblocks elements. In some cases like homepage I would like to have a full control related to generateblocks element. Unfortunately, full width option for container block doesn't work. Can I do something with that?

Hi David,
I've setup the full width for page builder (homepage in my case) and for container but it doesn't work. On my site is .entry-content class, which has 775px width and overwrite the rule I guess.

Can you link us to the site so we can see where that is coming from ?

done

I'm seeing this CSS added in your child theme:

.entry-content,
.entry-summary,
.entry-header,
.page-title,
.taxonomy-description,
#comments {
	max-width: 775px;
	margin-left: auto;
	margin-right: auto;
}

Does that help?

I was trying put in your solution but unfortunately it doesn't work. The problem is .entry-content class overwrite Page Builder Container full width option in the homepage. I could remove the class but I want to have narrow column text for better readability in case of blog posts on the desktop.

What Leo is say is that YOU HAVE this CSS in your child theme:
https://generatepress.com/forums/topic/generate-blocks-grid-and-container/#post-1324302

If you DELETE that CSS your full width pages will work.

Then you could this CSS:

body:not(.full-width-content) .entry-content,
body:not(.full-width-content) .entry-summary,
body:not(.full-width-content) .entry-header,
body:not(.full-width-content) .page-title,
.taxonomy-description,
body:not(.full-width-content) #comments {
	max-width: 775px;
	margin-left: auto;
	margin-right: auto;
}

This will only target pages that are not set to full width.

Hi David,
thanks so much for the solution. It works flawlessly.

Glad to be of help

This archived topic is closed to new replies.