Hey there.
Looking at your site it appears like the image is sized like that so that it fits perfectly in the head of the article. The CSS is:
.featured-image {
left: -20%;
width: 140%;
}
So you could look at taking the width down if you wish to, that’s done by changing the percentage “width: 140%;”. You could then add the CSS back either in a child theme:
http://codex.ww.wp.xz.cn/Child_Themes
Or through a simple plugin like:
http://ww.wp.xz.cn/plugins/simple-custom-css/screenshots/
Let me know how that goes for you.
Take care.
Thread Starter
aecoso
(@aecoso)
Thanks! That definitely helped in reducing the size of the featured image frame.
I like how images are stretch full width but I would like to reduce the height of the post header image. I don’t want to shrink, just to crop it about half the height. Is that possible?
Thanks
Yes, this is easily done by changing the padding-bottom value of .featured-image.
I know that’s a bit unintuitive, but if you change the padding-bottom value to half of what it is now, the image will be half as tall.
Works great, thank you. 🙂
Is it possible to change the proportion of the featured image size to be 16:9?
Thanks
Sure, by altering the height of the featured image with padding-bottom you can make the image any ratio you’d like.
For 16:9, the padding-bottom value should be set to 75%.
There is now a Custom CSS section in the customizer of Ignite, so I would recommend adding your CSS there if you have not already created a child theme.
Dekisugi,
Ben’s one of those awesome developers that supports his own themes, not everyone does.This is a pretty nice looking theme.
If you have a few moments free you might like to consider leaving him a cool review, I’m sure he’d like that 🙂
https://ww.wp.xz.cn/support/view/theme-reviews/ignite
Have a great weekend!
Hi Ben,
I am having a problem with my feature image. People can only see it if using a computer. All but one stopped appearing if using an iphone, ipad, ipod, etc.
I have to say that I do not have knowledge of css. Please help me.
Have you used any of the above CSS? If not, it may be a plugin-related issue.
You can quickly bulk deactivate/reactivate your plugins using the Bulk Actions dropdown in the Plugins menu. If this fixes the problem, reactivate the plugins one-by-one until you find the one causing the issue.
Oh woops, I was commenting while you linked to your site.
I see what’s happening now. It looks like there is a plugin or something serving a different theme on mobile, but then if I click the “View full site” link at the bottom it takes me to the Ignite version.
The reason the images aren’t loading on mobile is because there is just too much for the device to download. There are quite a few images and they are all very large. If you resize your images and install the EWWW Image Optimizer plugin, this will solve your problem.
