Support

Account

Home Forums Front-end Issues Outputting custom image size Reply To: Outputting custom image size

  • Hi,

    I had some issues with that to i actually set 3 different sizes
    “custom-thumb”, “feature-img” and “main-img” infunction.php but unlike what you said I use a single field which generate all 3 sizes.

    I set the return value to image ID

    and I am able to get the images in the front end like that:

    
    $attachment_id = get_field('you_field_name');
    
    //in the $custom_thumb var i get the custom_thumb infos replace "product-thumb with the name of your custom size you set in function.php
     
    $custom_thumb = wp_get_attachment_image_src( $attachment_id,"product-thumb" );
    
    //then you are able to output the following values from the $custom_thumb var:
    // the url: $custom_thumb[0];
    // the width: $custom_thumb[1];
    // the height: $custom_thumb[2];   
    
    //use these variable as you like on your html
    
    <img src="<?php echo $custom_feature[0]; ?>" />
    
    //or
    <img src="<?php echo $custom_thumb[0]; ?>" width="<?php echo $custom_thumb[1]; ?>" height="<?php echo $custom_thumb[2]; ?>" />
    
    //you can do the same with any other custom sizes or with the original sizes
    //just change the last argument "product-thumb" to what you need on that line (the $attachement_id should be declared as seen above).
    $your_var = wp_get_attachment_image_src( $attachment_id,"your-custom-size" );
    
    //then $your_var shoud have the data you want.
    
    

    you can still have different fields to upload your images and declare 3 times
    $attachment_id_1 = get_field(‘you_field_thumb’);
    $attachment_id_2 = get_field(‘you_field_feature’);
    $attachment_id_3 = get_field(‘you_field_custom’);

    but that’s only necessary if the images are different if it’s the same image the 3 sizes gets generated when you upload the first time.

    then to control the crop you can add that little plugin

    http://wordpress.org/plugins/manual-image-crop/

    it does a good job.