Advanced Search

Return to Snippet

Revision: 60114
at October 21, 2012 08:29 by FatFolderDesigner
Initial Code 
// 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();
    };
});
Initial URL 
http://fatfolderdesign.com/684/wordpress/implementing-the-wordpress-media-uploader-into-your-plugin
Initial Description 
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.
Initial Title 
Intergrating the wordpress media uploader into your plugin
Initial Tags 
plugin, wordpress, theme, Development
Initial Language 
PHP