Format blog post feature image

[lancesalyers]

I’m currently working on a site locally, so I don’t have a URL to share. Hopefully, that won’t preclude me getting some help here. I’m using square images for the featured image of posts. Under the current default settings, that means the image becomes way too large as it stretches to fill the width of the page.

How can I set the featured image parameters to either be a set number of pixels square or at least a %?

Thanks for any help you can give.

[ruenel]

Hello There,

Thanks for writing in!

You may set the featured image parameters to either be a set number of pixels square or at least a % using a custom css. Please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.entry-featured .entry-thumb {
    text-align: center;
    background-color: transparent;
}

.entry-featured .entry-thumb img {
    min-width: 450px;
}

You can increase or decrease the minimum width of 450px or even use 30% or more as the size of the featured image.

Please let us know how it goes.

[lancesalyers]

Hey, sorry for the delay in responding.

It doesn’t appear to be working. Here’s what it looks like after adding that code to the Global CSS:

As you can see, the image is filling up the full width of the column, and because it’s square, it becomes way too tall.

Here’s what the view looks like upon inspecting the code:

I know it’s difficult to solve for when you can’t view a live page. Thanks for the help!

[jade]

Hi there,

Please try adding:

.entry-featured .entry-thumb {
    max-width: 50%;
    margin: 0 auto;
}

Hope this helps.

[lancesalyers]

@Jade

max-width: 50%;
margin: 0 auto;
}

That did it. Thank you!

[jade]

You’re welcome.