Support » Plugin: OptionTree » WordPress image resizing in option tree

  • Resolved zackskeeter


    Hey, i have been stuck on this for a while and am to the point of using php or jquery to add the modded url.

    Here is what i want to do, i am making a there and using option tree as for the global settings. On the slider i want the user to upload an image and i want wordpress to crop it to the size i need easy enough with this <?php add_image_size( $name, $width, $height, $crop ); ?>, but now how can i make option tree display the selected size on the frontend?

    Pretty much i want to upload the original image and have a re-sized one display.

Viewing 15 replies - 1 through 15 (of 15 total)
  • Plugin Author Derek Herman


    I found a fix, it will be in the next version. Should be a day or two before it comes out.

    From now on it will send the URL of the image you’ve selected in the list of image sizes. Thanks for bringing it to my attention. If you want to patch your version of OT until then, just replace option-tree/assets/js/ot-admin.js with the contents of this gist file

    Thank you so much! Its quite a big hole in the plugin. Thanks for the fix and im glad to hear it will be coming out with a copy that includes that 😀

    Plugin Author Derek Herman


    Yeah, no problem. It always bugged me too, but it was actually an easy fix. If you don’t mind testing it out just to verify it’s working before I push it live; I would really appreciate it.

    Did you make the fix yourself?
    Ill integrate it tonight and will let you know.
    Thanks again

    Plugin Author Derek Herman


    Yes, I just fixed it on the development branch of OptionTree. However, 2.0.12 will probably go live Thursday or late Wednesday. I have a couple things still to do before the next version is released.


    Maybe i am doing something wrong

    I replaced the code with the updated one from github.
    I uploaded a new image to the slider (using option tree for backend)
    Then i run a print_r($slide); in order to see available options of what i can query from the array. Here is what i get,
    Normally i will see a size option here and would echo it with somthing like $slide[image][mysize]

    Array ( [0] => Array ( [title] => the
    new york [image] => [link] => # [description] => Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur facilisis nibh vel mauris mattis vestibulum. Quisque non magna at urna pretium interdum eget… ) )

    What would i be doing wrong?

    Plugin Author Derek Herman


    I think you might be confused as to what the update does. The JS code make it so when you send the URL to OptionTree it sends the selected size you’ve chosen. So if you’ve chosen thumbnail it will send that URL and not the full size one. I’m not exactly sure what it is your asking above. Where is $slide[image][mysize] coming from.

    Ohh okay, i see so they select it through the frontend.

    I was talking about the method where you can force a specific size to be shown.
    For example, with a featured image you can use something like this $image =wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), ‘mysize’ ); ?>

    Example from Advanced Custom Fields:
    <?php $image = get_sub_field(‘image’); $image = $image[‘sizes’][‘slider’]; ?>

    Now no matter what the select on the frontend it will always choose the size i want them to. The reason, so that i can make sure that the image fits without any chance of human error.

    Plugin Author Derek Herman


    So you want the images ID, so you can get the available sizes?

    That way the all the user needs to do is upload a image and the code specifies what version to show,

    For instance, the user uploads a 1000px by 1000px image, they are not very computer literate so i don’t want to rely on them to select the size.

    Anyway he uploads the image and i want it to show up in a 300px block.

    Normally i use something like this

    $image =wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), ‘thumbnail’ ); ?> //300px x 300px


    <?php $image = get_sub_field(‘image’); $image = $image[‘sizes’][‘thumbnail’]; ?> //300px x 300px

    Now no matter what, i get the correct image size in the block.
    Yes i could use css and just re-size it but a large image uploaded will require more bandwidth.

    Plugin Author Derek Herman


    Just to be clear this is way out of the scope of OptionTree. However, you’re in luck as I’ve already wrote a function that gets image ID’s from URLs. Mind you, this will fail if the image is not uploaded to WP.

    function custom_get_attachment_id( $guid ) {
      global $wpdb;
      /* nothing to find return false */
      if ( ! $guid )
        return false;
      /* get the ID */
      $id = $wpdb->get_var( $wpdb->prepare(
        SELECT  p.ID
        FROM    $wpdb->posts p
        WHERE   p.guid = %s
                AND p.post_type = %s
      ) );
      /* the ID was not found, try getting it the expensive WordPress way */
      if ( $id == 0 )
        $id = url_to_postid( $guid );
      return $id;

    Oh wow im glad to be in luck 😀
    Where would you recommend I place this code?

    Plugin Author Derek Herman


    It would go in your functions.php and you would use it like any other function.

    $slides = ot_get_option( 'my_slider', array() );
    if ( ! empty( $slides ) ) {
        foreach( $slides as $slide ) {
            $id = custom_get_attachment_id( $slide['image'] );
            $src = wp_get_attachment_image_src( $id, 'you-image-size' );
            echo 'HTML HERE';


    Thank you so much for sticking with me on this. Working 100%

    Just a note, you should consider putting that function in the documentation, im sure im not the first who has wanted to use OT for something like this

    Thanks Again, Ps the code you send me earlier that is to be included in the next update for selecting the image size is working.

    Derek – thanks for supporting the plugin so well. I needed this exact functionality and am glad to have found this post.

    Zach – glad you were inquiring on this point!

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘WordPress image resizing in option tree’ is closed to new replies.