Archived topic

Blog page using element

6 replies · Started by orlaith on January 10, 2023

Viewing posts 1–7 of 7

January 10, 2023 at 4:47 am #2489978

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.

January 10, 2023 at 6:52 am #2490126

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.

January 10, 2023 at 6:57 pm #2490818

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.

January 10, 2023 at 8:42 pm #2490859

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%;
}

January 10, 2023 at 8:47 pm #2490860

That doesn't seem to work Fernando :)

January 10, 2023 at 9:57 pm #2490904

There's a syntax error in your previous code.

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

January 10, 2023 at 10:26 pm #2490913

Woops, thanks a million :)

This archived topic is closed to new replies.

Start building better websites today.