How do I change the jetpack related post column which is fixed to 3 to 2?

To do that, just add this filter: https://jetpack.com/support/related-posts/customize-related-posts/#number

using a functionality plugin: https://jetpack.com/support/adding-code-snippets/

Hi,

Thank you for the quick reply.

I already used that code https://imgur.com/a/f9xqEwb

This is the problem I face when I try to increase the size of the box to 50%.
https://imgur.com/a/Pt1OXDy

If possible what I want is First column 2 box Second 2 box third column 2 box.

Kind Regards,

Hm, then that code doesn’t appear to be working properly. If used as presented, only 2 posts would be visible, not 6.

Do you want only 2 posts to appear, or do you want 6 posts to appear but split across only 2 columns?

Yes, I want 6 posts to appear but split across only 2 columns.

Thank you.

Hi,

The first line is ok, but the second line has only one post…one of the posts from the third line has to fill up the gap to the second line. The last one post should fill up the third line gap. see image…https://imgur.com/a/YT0VvXF

Its look like the module is not responsive!!

Kind Regards,

@suanlian If you’ll make it live on your site we can try to see what’s wrong.

Hello,

It’s live now as requested. Here is the link: https://www.shoppersgossip.com/best-honey-brands-in-india/

Kind Regards,

Thanks. Try adding this via Customize > Additional CSS:

#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post:nth-child(2n+3), #jp-relatedposts .jp-relatedposts-items-visual .jp-relatedposts-post:nth-child(2n+3) {
    clear: both;
}

It may need some extra enforcement, so let me know if that works for you.

Hi,

Still not working, sorry!

Is there any way to fix this?…the first row and the last row is correct.

Hello,

Your given css line + (3n+4) line with Clear: none; is working fine now.

#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post:nth-child(2n+3), #jp-relatedposts .jp-relatedposts-items-visual .jp-relatedposts-post:nth-child(2n+3) {
    clear: both !important;
}

#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post:nth-child(3n+4), #jp-relatedposts .jp-relatedposts-items-visual .jp-relatedposts-post:nth-child(3n+4) {

    clear: none !important;
}

Thank you!

Kind Regards,
Suan

Ah, that makes sense. Sorry I forgot about clearing that one. Cheers ??