[Support request] Featured Image size

Home Forums Support [Support request] Featured Image size

Home Forums Support Featured Image size

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #2046406
    aaron

    How do I make all featured image size to a certain size?

    #2046707
    David
    Staff
    Customer Support

    Hi there,

    ideally you want to ensure that all images you upload are the same size. However in Customuizer > Layout > Blog –> Featured Images you can ‘force’ the images to a specific size using the Width and Height fields:

    https://docs.generatepress.com/article/adjusting-the-featured-images/

    #2046769
    aaron

    The featured image size on my category page is correctly adjusted. But my home page does not change, please advise

    #2046946
    Elvin
    Staff
    Customer Support

    Hi Aaron,

    Your home page is using WPSP so the adjustment for it should be done with the WPSP settings of the WPSP list you’ve added on it.

    I’d consider installing WPSP’s beta version – https://wpshowposts.com/wp-show-posts-1-2-0/ – to use its image sizing feature.

    #2047455
    aaron

    I download the beta version just now. It says “In 1.2.0, we simply allow you to choose from the existing sizes generated by WordPress. Of course, you can add your own sizes using the add_image_size() function.”

    Under “Images”‘s Image size section, it says
    Available image sizes: thumbnail, medium, medium_large, large, full

    If this what you’re referring to? If so, I’m looking for dimension adjustment instead of big/small sizes

    #2047941
    David
    Staff
    Customer Support

    Unless you have the Pro version ( which is no longer available ) you will need to add some CSS:

    .wp-show-posts-single .wp-show-posts-image img {
        width: 100%;
        max-height: 250px;
        object-fit: cover !important;
    }
    #2048657
    aaron

    I add it on Customizing>Additional CSS, but it didn’t change
    Is it because my homepage is a page instead of a post? If so how do I change it?

    #2048683
    David
    Staff
    Customer Support

    Where did you add the CSS? I can’t see it on the site ?

    #2049314
    aaron

    Hi I removed it because it didn’t seem to work.

    I’ve added the code back, can you check

    #2049373
    Elvin
    Staff
    Customer Support

    I’ve tested David’s CSS to be sure and it works as shown in this testing –
    https://share.getcloudapp.com/xQuzPAEk

    I’ve checked how you’ve added it and it seems to be included in a @media rule.

    Can you try moving it out of the @media rule?

    #2049846
    aaron

    It worked, but this code looks like it’s making the higher height shorter (to balance the height of all thumbnail)
    Instead, how do I make the width cropped in? (to balance the width)

    Also, for some reason the top header bar is showing blank now. can you help me?

    #2049866
    David
    Staff
    Customer Support

    You would use this CSS:

    .wp-show-posts-single .wp-show-posts-image img {
        width: 100%;
        height: 500px;
        object-fit: cover !important;
    }

    BUT this will make ALL WPSPS Images 500px tall.
    So now you got to select the Container Block that list is in, and give it an Advanced > Additional CSS Class eg. your-custom class ( name it what you like ) and use that in your CSS:

    .your-custom class .wp-show-posts-single .wp-show-posts-image img {
        width: 100%;
        height: 500px;
        object-fit: cover !important;
    }

    Personally i would crop that one image to the same aspect ratio as the other images…. it will save you a lot of headaches 🙂

Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.