Support » Developing with WordPress » additional image sizes

  • Hi,
    for four days I have been looking for a way to add image sizes to wordpress.
    wordpress comes with thumb, medium, large and full and I need four more to be able to select from, i.e. I need to be able to select from seven options when inserting an image into a page. To make it clear: I am not looking for support for a featured image and I do not want to use a plugin.

    I found the following code on the internet – the folloeing is meant for the
    functions.php of the child theme and I inserted the added images:

    add_action( 'after_setup_theme', 'setup' );
    
    function setup() {
    	// ...
    	
    	add_theme_support( 'post-thumbnails' ); // This feature enables post-thumbnail support for a theme
    	// To enable only for posts:
    	//add_theme_support( 'post-thumbnails', array( 'post' ) );
    	// To enable only for posts and custom post types:
    	//add_theme_support( 'post-thumbnails', array( 'post', 'movie' ) );
    	
    	// Register a new image size.
    	// This means that WordPress will create a copy of the post image with the specified dimensions
    	// when you upload a new image. Register as many as needed.
    	// Adding custom image sizes (name, width, height, crop)
    	add_image_size( 'smallest', 479, 157, true );		
    	add_image_size( 'small', 768, 252, true );	
    	add_image_size( 'small_medium', 981, 322, true );
    	add_image_size( 'normal_medium', 1536, 504, true );	
    	add_image_size( 'better', 1962, 644, true );
    	add_image_size( 'normal_large', 2304, 768, true );
    	
    	// ...
    }
    
    add_filter( 'image_size_names_choose', 'custom_image_sizes_choose' );
    function custom_image_sizes_choose( $sizes ) {
    	$custom_sizes = array(
    	'smallest' => 'Smallest',
    	'small' => 'Small',	
    	'small_medium' => 'Small Medium',
    	'normal_medium' => 'Medium',	
    	'better' => 'Better',
    	'normal_large' => 'Large'
    	);
    	return array_merge( $sizes, $custom_sizes );
    }

    PHP is completely new to me, but the the add_image part coincides with info from the wordpress codex and the add_filter is meant to let you select the image sizes in the wordpress gui.

    But it is not working properly:
    the upload directory contains the right image sizes but if I try to add an image to a page the amount of image sizes and their names are correct but some image sizes appear twice or more.

    As code for the loop i copied the index.php to my child theme folder and added
    following line

    
    <?php
          if ( has_post_thumbnail()):
    	  the_post_thumbnail( 'smallest', array( 'class' => 'smallest' ) );
              the_post_thumbnail( 'small', array( 'class' => 'small' ) );
    	  the_post_thumbnail( 'small_medium', array( 'class' => 'small_medium' ) );
    	  the_post_thumbnail( 'normal_medium', array( 'class' => 'normal_medium' ) );
    	  the_post_thumbnail( 'better', array( 'class' => 'better' ) );
    	  the_post_thumbnail( 'normal_large', array( 'class' => 'normal_large' ) );
                        endif;
                        ?>

    I looked for following code snippet in my parent theme (Divi):

    add_action( 'after_setup_theme'

    but as I could not find it i added it to my child theme.

    I would be very glad for some help as the more I read in the internet the more confused I get.

    thanks in advance

Viewing 5 replies - 1 through 5 (of 5 total)
  • I’m not really understanding what the question or problem is. Maybe start from the beginning and explain what you are trying to accomplish. Where are you trying to use the image sizes? Is this for post content or for use in templates?

    Moderator bcworkz

    (@bcworkz)

    You should remove the first two add_theme_support() lines from your first snippet. The rest of the first snippet looks OK. The multiple the_post_thumbnail() calls do not make any sense. Determine the size you want to use, then remove the rest. You said you did not need featured image support, but your add_theme_support() and the_post_thumbnail() calls are precisely for featured images. Featured images were originally called thumbnails. The functions retained this nomenclature even though we now refer to the element as featured images.

    I’m not sure what your final question about the “after_theme_setup” action means. What you did in your first snippet regarding add_action() is fine. There is no reason to expect it to occur elsewhere in your theme. It may, or may not. It’s existence or lack infers no special meaning either way.

    hallo csloisel and bcworkz,

    bcworksz
    thankyou very much for your detailed answer – that was very helpful and also very kind.
    I threw out the
    add_theme_support
    and the insertion into the loop on the index page.

    I still have issues:
    the images are uploaded correctly to the upload directory but if I try to insert an image into page only “smallest”, “small”, “small medium”, “thumb” and “full” have the correct sizes – “medium”, “better” and “large” all have the wrong same size but it could be an issue with Divi and my understanding.
    So I’ll try Divi support for now especially as I want to use it with an implementation of Picturefill.

    thanks again for your input

    Hi, I’m back again .
    I’m asking Divi support but as my question has a lot to do with WordPress in general I’ll ask here too.
    As mentioned before in my last post I still have issues with three images that as I have learned exceed the tolerated size of WordPress’ content_width of 1600px.
    I’m a newbie but as I understand it WordPress lets the themes set content-Width downsize the offending images.
    That leaves me with three different images with 1080px width.

    As I learned while googling you cannot exceed the limit set in the parent theme through a child theme – as far as I know .
    But if somebody has an idea how to override the content_widrh of the parent theme I’d be glad to know.

    thaNKS for reading

    • This reply was modified 2 months, 1 week ago by bz61vl0p.
    Moderator bcworkz

    (@bcworkz)

    It should be possible to undo nearly anything a parent theme does if you know how it did it in the first place. For example, declaring global $content_width; then setting it to your desired width should override the parent, provided your script runs after the parent’s. To ensure this, you need to know when and how it was set by the parent. If it is a direct code in functions.php, the child’s functions.php runs later. If it is set within an action callback, override it from your own action callback, but specify a larger priority number when you add to the same action to ensure yours runs later. If the parent did not specify a priority, the default is 10.

    If the parent calls add_theme_support() to set a content width, again do the same, using your own value and ensuring your callback is added with a larger priority.

    However, successfully overriding the content width will not affect any images uploaded previously. It sounds like the images are correct anyway, but generally speaking, altering image size criteria in PHP never affects previously uploaded images, only those uploaded subsequent to the change. There are plugins that will go through and resize images based on the new criteria. Some may only affect featured image sizes, others may be more thorough.

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.