我用前端做了一个Plupload。WordPress Plupload是非常定制的,因此我从头开始就将其作为插件实现。我将展示一个使用函数的示例。php
从下载Pluploadhttp://www.plupload.com/download/ 并将主题放入js/thirdparty/plupload/{all\\u files}中
用于函数的代码。php
//Plupload File
wp_enqueue_script( \'plupload\', get_template_directory_uri() . \'/js/thirdparty/plupload/js/plupload.full.min.js\', array( \'jquery\' ) );
//Plupload Queue File (up to you using queue)
wp_enqueue_script( \'plupload-queue\', get_template_directory_uri() .\'/js/thirdparty/plupload/js/jquery.plupload.queue.min.js\', array( \'jquery\' ) );
//Your own JS (make sure you set the dependencies)
wp_enqueue_script( \'my-functions\', get_template_directory_uri() .\'/js/functions.js\', array( \'jquery\' , \'plupload\', \'plupload-queue\' ) );
//Send the wp-admin/wp-ajax.php to the Javascript:
wp_localize_script( \'my-functions\', \'customObj\', array(
\'ajax_url\' => admin_url( \'admin-ajax.php\' )
) );
//AJAX Upload function
add_action( \'wp_ajax_my_custom_plupload_ajax_method\', \'process_ajax_my_custom_plupload_ajax_method\' );
add_action( \'wp_ajax_nopriv_my_custom_plupload_ajax_method\', \'process_ajax_my_custom_plupload_ajax_method\' );
//Here you will code your upload depends on your needs:
function process_ajax_my_custom_plupload_ajax_method() {
$mimes = array(
\'jpg\' =>\'image/jpg\',
\'jpeg\' =>\'image/jpeg\',
\'gif\' => \'image/gif\',
\'png\' => \'image/png\'
);
$uploadedfile = $_FILES[\'file\']; //Default from Plupload.
//You could use media_handle_upload also, up to you.
$upload_overrides = array( \'test_form\' => false, \'mimes\' => $mimes );
$movefile = wp_handle_upload( $uploadedfile, $upload_overrides );
if ( is_wp_error( $movefile ) ) {
return wp_send_json_error( $movefile );
} else {
return wp_send_json_success( $movefile );
}
}
而不是像通常那样使用JS
要在函数中使用的代码。js公司:
var uploader = new plupload.Uploader({
runtimes : \'html5, flash, silverlight, html4\',
url : customObj.ajax_url, //it comes with wp_localize_script
drop_element: \'sortable\', //up to you
chunk_size : \'1mb\',
unique_names : true,
resize : {width : 320, height : 240, quality : 90}, //Here you go to resize images
browse_button : \'pickfiles\', // you can pass in id...
container: \'container\', // ... or DOM Element itself
filters : {
max_file_size : \'2mb\',
// Specify what files to browse for
mime_types: [
{title : "Image files", extensions : "jpeg,jpg,gif,png"}
],
prevent_duplicates: true
},
multipart_params: {
\'action\': \'my_custom_plupload_ajax_method\' //Depends on the PHP method
},
//Flash settings
flash_swf_url : \'/plupload/js/Moxie.swf\',
// Silverlight settings
silverlight_xap_url : \'/plupload/js/Moxie.xap\',
init: {
PostInit: function() {
document.getElementById(\'filelist\').innerHTML = \'\';
document.getElementById(\'uploadfiles\').onclick = function() {
uploader.start();
return false;
};
},
FilesAdded: function(up, files) {
plupload.each(files, function(file) {
document.getElementById(\'filelist\').innerHTML += \'<div id="\' + file.id + \'">\' + file.name + \' (\' + plupload.formatSize(file.size) + \') <b></b></div>\';
});
},
UploadProgress: function(up, file) {
document.getElementById(file.id).getElementsByTagName(\'b\')[0].innerHTML = \'<span>\' + file.percent + "%</span>";
},
Error: function(up, err) {
document.getElementById(\'console\').innerHTML += "\\nError #" + err.code + ": " + err.message;
},
FileUploaded: function(up, file, info) {
var photo = JSON.parse(info.response);
console.log(photo); //Here you\'ll use in your JS. That\'s the WP result.
}
});
uploader.init();
要上载的方法,可以使用
media_handle_upload 如果您希望它进入您的媒体或
wp_handle_upload 对于自行上载(可用于任何文件,只需更改mime\\u类型)。
希望对你有用。