Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to add additional image sizes in wordpress

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 465
    Comment on it

    Hello reader's
    Today we discuss about "How to add additional image sizes in WordPress".

    When you upload an image to the media library, WordPress creates the store a range of various sizing's to the image. They're: thumbnail, medium, large and full-size.

    Default code for image re-sizing in WordPress

    <?php 
    
        /**************** Custom Code For Images  ***********************/ 
        add_action( 'after_setup_theme', 'setup' ); 
        function setup() 
        { 
            add_image_size( 'thumbnail', 150, 150, true ); 
    
            add_image_size( 'medium', 300, 225, true ); 
    
            add_image_size( 'large', 500, 375, true ); 
    
            add_image_size( 'full'); // display original image(full width and height)       
        } 
    ?> 
    

    In the event you run a site where you'll need the particular image to become a unique dimension, for instance a good e-Commerce dimension where you'll need the particular image to become a unique dimension with regard to uniformity, these foreclosures might not exactly suit your needs.

    When you finally make it possible for your help regarding thumbnails, it's easy to make use of the functionality of intricate more photograph sizes with the function add_image_size(). The effective use of add_image_size function is similar to this kind of: add_image_size( name-of-size, thickness, top, harvest function );

    Custom code for image resize in wordpress:

    Example:-

    <?php 
    
    /**************** Custom Code For Images  ***********************/ 
    add_action( 'after_setup_theme', 'setup' ); 
    function setup() 
    { 
        add_image_size( 'sidebar-thumb', 120, 120, true ); // Hard Crop Mode 
    
        add_image_size( 'homepage-thumb', 220, 180 ); // Soft Crop Mode 
    
        add_image_size( 'singlepost-thumb', 590, 9999 ); // Unlimited Height Mode      
    } 
     ?>
    

    There are three different sort of image sizes. Each has different modes such as hard crop mode, soft crop mode, and unlimited height mode.

    Hard Crop Mode :-

    In Hard Crop Mode, after the height there is a value true added. This "True" value tell's WordPress to crop the image to the size which we have defined (for example in this case 120 x 120px). We mostly use this method in our theme designs to make sure everything is proportionate and our design is not breaking. Also this function will automatically crop the image either from the sides or from the top and bottom depending on the size.

    Soft Crop Mode :-

    This method re-sizes the image proportionally without distorting it. Here you can't get the dimension of image according you want. It just matches the width dimension, the heights are different based on each images proportion.

    Unlimited Height Mode :-

    In this method the width is fixed but you can't fixed the height of the image. Those images are used in infographic posts, infographics tend to be very long and full of information images.
    In other words, in such case while leaving height to be unlimited you only have to specify width which will not break your design because of height, so that all of infographic can be shown without any distortion.

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: