0

I am developing a plugin in which I want to open media library box after clicking on a link from Admin Panel just like we do for Choose featured image.

<a href="#">Choose Image</a>

After clicking on Choose Image I want that media library box displayed in thickbox.

Thanks

-1
<img src="#" id="img-src"><a href="#" id="img-upload">Add Image</a>


jQuery(document).ready(function(){
   jQuery('#img-upload').click(function(e){
        e.preventDefault();
        var upload = wp.media({
        title:'Choose Image', //Title for Media Box
        multiple:false //For limiting multiple image
        })
        .on('select', function(){
            var select = upload.state().get('selection');
            var attach = select.first().toJSON();
            console.log(attach.id); //the attachment id of image
            console.log(attach.url); //url of image
            jQuery('img#img-upload').attr('src',attach.url);
        })
        .open();
   });
});

wp_enqueue_media(); calls the scripts into the footer of the page.

0

By enququing an JS file we can do like this:

<img src="#" id="img-src">
<a href="#" id="img-upload">Add Image</a>

Content of JS file

jQuery(document).ready(function(e){
    e.preventDefault();
    jQeury('#img-upload').click(function(){
        var upload = wp.media({
        title:'Choose Image', //Title for Media Box
        multiple:false //For limiting multiple image
        })
        .on('select', function(){
            var select = upload.state().get('selection');
            var attach = select.first().toJSON();
            console.log(attach.id); //the attachment id of image
            console.log(attach.url); //url of image
            jQuery('img#img-upload').attr('src',attach.url);
        })
        .open();
   });

}); 

Like this we can have it.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.