Featured Image for Pages.
-
Hello,
I have been sent here by WordPress Support.
I am trying to get my images to fit as ‘featured images’ for my pages but they are not getting my entire body in. I have been told that CSS exists to fix this problem, can you please help me with this?
JamieBettsPT.com
Thanks.
The blog I need help with is: (visible only to logged in users)
-
Hi Jamie,
Can you give me an example of where the images aren’t getting your entire body in? The images look similar to the ones you’ve uploaded. Is there an example you can give me where you found an image had been cropped?
The Sela theme specifies using images that are 820 pixels x 312 pixels for Featured Images on Posts. For Featured Images on Pages, it recommends images that are 1180 pixels wide minimum. Many of your images are 3425 pixels x 2283 pixels. Using the correct image size and ratio helps ensure they’ll display on your site correctly. There are several online image editors you can find if you don’t have something on your computer.
The Sela theme docs have all the Featured Image information and more. If you don’t have them handy, here’s the link:
https://wordpress.com/themes/sela/
Here’s the link for more info on working with Featured Images:
Cheers!
-
Hi Linda,
Thank you for coming back to me.
Sure, take a look at the homepage now and you will see what I mean with regards to the featured image.
Even when the images are resized the same problem arises. I was told there is code that can stop this problem, so I thought it would be an idea to try this and see what it does exactly.
Thank you.
Jamie.
-
Hey Jamie,
I do see what you mean. :-)
The Featured Image you’ve used for your Front Page is 1500px by 662px which means that the ratio of image width to height won’t work to keep the image in perspective as it changes size. Can you try re-sizing that image to 820px x 312px please? The image should then work without chopping your head off which I agree, isn’t best-case scenario. ;-)
While there are things we can do with CSS to change the design and layout, it’s best to work within what the theme asks for in terms of image sizes for things like Featured Images. It’s better to edit your images as per the theme documentation than edit the CSS.
Cheers!
-
Thank you for your response.
Ok I have edited the picture to the size that you have suggested, Take a look. It looks terrible!
Can nothing be done about this problem?
Thanks.
-
Hi Jamie,
Maybe it’ll help if we break this down a bit. I’m sorry if I wasn’t clear before.
– The Sela theme expects Featured Images for Pages to be 1180 x 435 pixels.
– The Sela theme expects Featured Images for Posts to be 820 x 312 pixels.With your current images, you’ll likely have to crop them to avoid distortion and avoid having them cropped automatically (which is what happened when you lost your head :-) ).
The problem here is in not using the correct image sizes as per the theme specifications.
Cheers!
-
Ok I have re sized again, looks awful.
I have done this already when I was speaking with wordpress support, it is frustrating to have to do this again! As you can see it still looks awful and the picture is distorted.
I have been told code exists to fix this issue?
Jamie.
-
Hi Jamie,
I can see you’re getting frustrated and I’ll do my best to explain things so you can start moving forward on your site.
The Sela theme takes a Featured Image and crops it to the exact dimensions laid out in the theme documentation. This is done in a part of the code that we can’t override using CSS. The information you received earlier indicating there may be a CSS solution unfortunately doesn’t apply to the Sela theme featured images.
I see you’ve re-sized your image again and it’s distorted because the image needs to be cropped rather than re-sized.
To get an idea of what you need to do, here’s a screenshot of what that image would look like cropped to the correct dimensions:
You can see how much height would have to be cropped from that image to use it as a Featured Image with the Sela theme.
I hope this clarifies the issue of using Featured images with the Sela theme and allows you to decide your best course of action. :-)
Cheers!
-
That is ashame, I really like the theme.
Can you recommend another theme that will not crop my images? And will look good across all devices including mobiles and tablets please.
Thanks.
Jamie.
-
Hi Jamie,
I’ve narrowed some theme choices for you based on the Sela theme you liked. The Edin theme may work for your images, although you will want to demo and preview to make sure it’s a good fit for you. Here’s the link to the Theme Showcase with the custom search options I’ve done for you:
Please demo and then Preview on your site, the themes that look appealing to you. Learn how to Preview Themes by scrolling down to that section in his link:
You can view the theme documentation by clicking on the theme’s image in the showcase. You can find information on image sizes for featured images, headers etc. by scrolling to the bottom of the page.
Happy theme hunting and let us know if you need a hand.
Cheers!
-
Hi Linda,
Ok, I have decided on the Edin theme. The homepage is exactly what I was looking for, very happy with this thank you for the recommendation.
I have the same issue within the other pages and have again been told that some coding exists to fix this issue?
Do you have any ideas for how I could use my images as ‘featured images’ without them being cropped?
Thank you.
Jamie.
-
Hey Jamie!
It looks like we can use a little trick to display the full-size image. We’re going to add some padding to the page title area that will expand the hero section. Can you give this CSS a try?
h1.page-title { padding: 100px 0; }You’ll want to place that under CSS here:
https://wordpress.com/customize/jamiebettspt.com
Please note, this is specific to the Edin theme. Let me know if this achieves the desired effect!
- The topic ‘Featured Image for Pages.’ is closed to new replies.
WordPress.com Forums 