Archived topic
Using Section to create a masonry grid front page
3 replies · Started by Søren on November 7, 2018
I would like to use Sections to create a front page where each section/container looks like the masonry grid. Is that possible like using the blog as front page:
When creating a section on a static front page I can choose Container or Full width, but when choosing Container I don't get the grey spacer inbetween - how could I make that?
Hi there,
Sections weren't designed to work like that, and would require some serious custom CSS like was used on this Site:
Making them a masonry effect would require custom development.
What content are you looking to add to the masonry grid?
Thanks Dave - I just think the reading becomes much more natural when there's a seperation between the different content.
Basically I was thinking front page content - sidebar, where sidebar has newsletter, last blog posts, most popular products etc. Then in the content I would have a description of our design, recommendations etc.
So what you're saying is I need some special CSS for a section/container and maybe also one for the grid/column-plugin Tom has made?
Thats correct, Tom's Lightweight Grid Columns with some CSS could achieve rows and columns ( but not the staggered masonry effect ).
If you want to use Sections and Sidebars you need to add this filter, as by default Sections won't support sidebars as they are designed to be full width:
https://docs.generatepress.com/article/allow-sidebars-sections/
