Archived topic
Setting up images for WP showposts and featured images
5 replies · Started by David on August 11, 2022
This may have been answered before, but I couldn't find it.
I use WP Showposts on my home page to display my latest blogs. I want to show Square images with the post title above the image. Then I want my blog posts to pull in a rectangular image as the featured image. Think Instagram post size for the home page and YouTube thumbnail size for the featured images. It's probably a simple fix, but at this stage, it is beyond me, and I have been struggling with it for the last few days. Any help will be most appreciated
Hi there,
can you share a link to the site ?
Hi David,
You can use a GenerateBlocks Query Loop Block for the Latest Blogs. Through this, you’ll be able to control the layout as you want. Reference: https://docs.generateblocks.com/article/query-loop-overview/
With regards to the featured image, are you referring to single post page’s featured image?
Hi Fernando,
Thank you for getting back to me. Yes, I want the latest Blogs images to be one size, and then I want each blogs featured image to be uniformly sized.
So the latest blog images, I want to be squared, and each blog post, I want to be more landscape size.
You can try creating the Latest Posts through a GB Query Loop Block, alternatively, you can try this CSS:
section#wpsp-472 .wp-show-posts-image img {
height: 286px;
width: 100%;
object-fit: cover;
}
section#wpsp-472 .wp-show-posts-image {
margin-top: auto;
}
section#wpsp-472 .wp-show-posts-inner {
display: flex;
flex-direction: column;
}
For the single post images, you can use a Block Element - Page Hero, otherwise, you can try this CSS:
.single img.dynamic-featured-image {
height: 150px;
object-fit: cover;
}