featured image on post page is huge

  • Author
    Posts
  • #124093

    curlygeek04
    Member
    Original poster

    When I open my post, the featured image is way too large. I want to keep the featured image thumbnail on the home page, but is there anything I can do about this? Thanks.

    The blog I need help with is: thebookstop.wordpress.com

    #124191

    scottrrollo
    Theme Author

    Hey! Sure thing.

    I can see the problem, but just before I offer some code to help I wanted to ask: What would you like to see? Would you like the image hidden? Or just smaller?

    Let us know 😀

    #124194

    curlygeek04
    Member
    Original poster

    Thanks for the response. I would like to see the image smaller. It shows up on my screen as about 5×7 inches, I guess I’d like it to be about 3-4x smaller (or about 1×2 inches).

    The other possibility would be to suppress the featured image and just have an image embedded in the text. But I do want the featured image on the home page and in the Reader Feed.

    #124195

    scottrrollo
    Theme Author

    Hey again!

    To try to reduce the size of those images in the Single post view, try adding the following code snippet:

    .single .feature img {
       width: 30%;
    }
    
    @media screen and (min-width: 900px) {
       figure.feature {
            max-width: 492px;
            margin-bottom: 22px;
       }
    }

    Let us know how this works!

    #124215

    curlygeek04
    Member
    Original poster

    Thanks, that worked really well! Now another question: most of my images are book covers and ideally their dimensions are about 1:1.5. How would I adjust that?

    Also, it’s a bit off center – can I make the image centered? Or is it a problem with the text margins?

    #124260

    scottrrollo
    Theme Author

    Glad to see we’re making progress!

    To center your images better, try this code snippet:

    figure.feature {
        margin-left: auto;
        margin-right: auto;
        text-algin: center;
    }
    
    figure.feature img {
        float: none;
        margin: 0 auto;
    }

    I’m not quite sure I understand your question about 1:1.5 image ratios. Are you trying to make the image larger? Would you please help me by explaining a bit more about what you’re after.

    Thanks!

    #124275

    curlygeek04
    Member
    Original poster

    I may not be putting it correctly. What I mean is the width to height ratio — the images I post are book covers, so they need to be rectangles that are taller than wide. If they get turned into squares, the top and bottom of the image gets lost.

    Appreciate the help!

    #124298

    scottrrollo
    Theme Author

    Ah, okay! So you’re talking about the thumbnails on this page? And not on single post pages?

    If that’s the case, unfortunately, those thumbnails cannot be adjusted. Sorry about that!

    #124300

    curlygeek04
    Member
    Original poster

    No, I do mean single post pages. See, for example: https://thebookstop.wordpress.com/2018/01/20/review-of-future-home-of-a-living-god-by-louise-erdrich/ The top and bottom are cut off, though not by a lot.

    #124360

    scottrrollo
    Theme Author

    Hey again! Got it now.

    As it happens, there’s not a huge amount of control over that. what I suggest is you follow this guide and attempt to resize the Thumbnail image.

    Fingers crossed that helps 😀

The topic ‘featured image on post page is huge’ is closed to new replies.