featured images not displayed in correct size

[Marcus Zurhorst]

Hello!

I try to figure out why post-thumbnails (or featured images) are not displayed in the correct size.
The WP codex says, that the default size is 150x150px, and I have not identified that the functions.php is overwriting the WP default.
Still, the images are larger, even when I try to enforce the default size again in the functions.php.

What is wrong here?

The issue is visible at: http://www.die-zurhorsts.de/blog/
The two images should both be smaller and have a standardized size to achieve a consistent and clean view.

Many thanks in advance!
Regards,
Marcus

[Sushil Adhikari]

You may want to see this tutorial:
https://www.styledthemes.com/encounters-setup/113-before-you-start-uploading-images-set-your-media-sizes

Basically you want to upload the thumbnails you want in the size you want which gives you more control over the thumbnails you want to use by cropping the image where you want and the size you want.

To have an automatic thumbnail generated for the blog posts so that it’s consistent in size, this has to be coded into the theme because the media settings for featured images don’t really give you a flexible option for that select usage. This is why I prefer to recommend to people to create your image thumbnails before uploading.

Also be aware that this is a responsive theme so images will also resize automatically based on the container they are in.

You could code in your own thumbnail sizing for the blog if you wish, but you will need to do some code modifications like this Codex shows:
http://codex.wordpress.org/Function_Reference/add_image_size

This would then create thumbnails for the blog automatically when you upload them in raw form.

[Sushil Adhikari]

Actually… the media video tutorial is not very good. Check out the one for Circumference and it will give you a better tutorial which applies to any theme.
https://www.styledthemes.com/circumference-setup/196-media-settings-for-image-uploads

Again, it’s generally better to create your thumbnails as you need them to the size you want.

[Marcus Zurhorst]

Thanks for the link. But this only explains how you bypass WP to control everything fully manually. And partially, I understand your arguments.
At the end of the page, in the very last paragraph, you than state that it is indeed possible, but I still don’t see how this is achieved.

What is the purpose of add_theme_support( ‘post-thumbnails’ ); file when you recommend to do it manually. Is it out of function at the moment?

According to feedback in the german WP forum, my theme would be is calling “the_excerpt”, and misses the call to “the_post_thumbnail” before that.
Not sure whether it would be so simple. My issue is now that I even cannot identify the php file(s) that are finally responsible for this part of the theme.

Can you please explain which file(s) I would have to modify? — I would like to try this in a child theme and see how far I get try to get some help.
At the end, it should look similar to your encounters demo page in the “last posts” widget (in footer and sidebar).

Thanks,
Marcus

[Marcus Zurhorst]

Btw, I did the “add_image_size” thing already. But this is only responsible to generate the images when uploading.
They are still not used somewhere yet.

(I do this because I symlink the image folder into another software which uses the same images in different sizes. Pure convenience)

[Sushil Adhikari]

WordPress handles images very strangely, but the add_theme_support function is to enable the “Featured Image” functionality in the theme. The media settings is more for “inserting” images into a post or page but there is no way to choose the thumbnail size for the featured image unless the theme is specifically coded for a specific size. So what featured image you upload is the one you will get in your post.

You can customize the thumbnail code in the theme file(s) if you want, so definitely use a child theme for that (more on this in a moment).

How I did the demo website for the blog is that I simply created the thumbnails that I wanted in the size I wanted then uploaded them. So for a blog post, if I want my featured images to all be 200×100 px, then I make my featured images that size and upload it as I need one per post.

The file that puts the featured image in the post is the content.php file:

The code begins around line 52 and starts with:

<?php if ( has_post_thumbnail()) :

For adding a custom featured image size, you would definitely need to add a new function for the sizing. Here is a tutorial from one of the WP coders:
http://markjaquith.wordpress.com/2009/12/23/new-in-wordpress-2-9-post-thumbnail-images/

The function for this this them is found in the functions.php file around line 63

add_theme_support( 'post-thumbnails' );

To do this in a child theme, you will need to create a new functions.php file in the child theme and then add your new custom thumbnail code there. Also, I hope for this project of yours, you plan to do this on a test site location first. Please note that switching to a child theme means your theme option settings will have to be redone.

[Marcus Zurhorst]

Hi Andre,

thanks for the help, it works great.
Actually, it was absolutely simple and straight-forward at the end.

1. In your case blockthe_post_thumbnail(”, array(‘class’ => ‘alignleft’)); without the specific image size. I only had to add thumbnailthe_post_thumbnail(‘thumbnail’, array(‘class’ => ‘alignleft’));
2. But now, I was not too happy because this resulted in uneven image sizes, depending on the orientation of the image.
   Therefore, I added my own custom image size in the functions.phpadd_theme_support(‘post-thumbnails’);
   add_image_size( ‘dzdethumbnail’, 150, 9999 ); and

   post_thumbnail('dzdethumbnail', array('class' => 'alignleft'));   

The result is exactly what I was looking for. Very nice.
All I’m wondering is, why you have the case in your theme, but are not calling for the WP default image sizes like “thumbnail” or “large”. As is, the case seems pointless as it always yields the original image size. Or am I overlooking something?

Best regards,
Marcus

[Marcus Zurhorst]

Oh, and while at it, I added a filter to the functions.php, which links the thumbnail to the article. 😛
Works great. As one can see here, the images have same width and variable heights: http://www.die-zurhorsts.de/ahnenforschung/familiengeschichten/

Cheers!

[Sushil Adhikari]

Well I should hire you to make my job easier….lol B)

To answer your question previously, I did not do as you demonstrated because in the past, I’ve had many complain they did not like the sizing, hence why I moved to say, “OK, create your own sizes!”

[Author]

Posts