Posted By

FatFolderDesigner on 10/21/12

Tagged

Versions (?)

Last Edited at 10/21/12 08:29am

Statistics

Viewed 855 times

Favorited by 0 user(s)

Related snippets

Intergrating the wordpress media uploader into your plugin

/ Published in: PHP

It's a 3 part process, first is the PHP that you need to run, which includes the appropriate scripts and styles into the admin header, then you need an html button and input field to put the stored value in, then you need some jQuery to open the popup and get the appropriate information from it (then close it again).

There more information on implementation at the URL.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

// PHP, adds the appropriate scripts and styles in admin
add_action('admin_print_scripts',array(&$this,'uploader_scripts'));
add_action('admin_print_styles',array(&$this,'uploader_styles'));
public function uploader_scripts(){
    wp_enqueue_script('media-upload');
    wp_enqueue_script('thinkbox');
}
public function uploader_styles(){
    wp_enqueue_style('thickbox');
}
 
// The html for the button and hidden input for result (super simple)
<input id="backdrop_upload_button" value="Upload/Select Image" type="button" class="button" />
<input type="hidden" name="the_image" id="the_image" value="<?= $settings['the_image'] ?>" />
 
// The jQuery to open the media uploader and get the response
var $ = jQuery;
// Handels image uploading
$(document).ready(function(){
    $("input#upload_button").click(function(){
        tb_show('','media-upload.php?type=image&post_id=1&TB_iframe=true&flash=0&backdrop=true');
        return false;
    })
    window.send_to_editor=function(html){
        var img = $('<div>'+html+'</div>').find('img').attr('src');
        $('#the_image').val(img);
        tb_remove();
    };
});