[Resolved] Blog page using element

[orlaith]

Hi, I created an element for my blog page following this tutorial here. I edited it to change it to a grid so I could have 2 posts display per line on desktop. I’m having trouble as each blog is now showing up twice and not formatting correctly.

[David]

Hi there,

remove the grid, so it only shows the posts in a single column and without duplicates.
then in Customizer > Layout > Blog, enable the Columns option and set it to 2.

[orlaith]

Thanks David that has worked nicely but I’m still facing issues with the sizing being different for each blog post. I’ve added the page for you to inspect. I removed the right sidebar widget and set the blog posts to show 3.

[Fernando]

Hi Orlaith,

For now, you would need custom CSS to align all posts height-wise. Try adding this through Appearance > Customize > Additional CSS:

:is(.blog, .archive) div#content .generate-columns-container article {
    padding-bottom: 0;
}

:is(.blog, .archive) div#content .generate-columns-container article > .gb-container {
    height: 100%;
}

[orlaith]

That doesn’t seem to work Fernando 🙂

[Fernando]

There’s a syntax error in your previous code.

Add a } before your /*unify featured image size on blog*/ comment.

[orlaith]

Woops, thanks a million 🙂

[Author]

Posts