因此,对于Plupload,我知道有一个文档说明了如何在上载之前在客户端调整图像大小:http://www.plupload.com/docs/Image-Resizing-on-Client-Side
然而,我不知道如何为Wordpress做到这一点。
你们能告诉我怎么做吗?
非常感谢你!
当做
因此,对于Plupload,我知道有一个文档说明了如何在上载之前在客户端调整图像大小:http://www.plupload.com/docs/Image-Resizing-on-Client-Side
然而,我不知道如何为Wordpress做到这一点。
你们能告诉我怎么做吗?
非常感谢你!
当做
我用前端做了一个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类型)。希望对你有用。
以下代码将启用客户端图像随处调整大小:
放置一个名为client-side-image-resize.php
在您的mu插件目录中(wp-content/mu-plugins/
)
function client_side_resize_load() {
wp_enqueue_script( \'client-resize\' , plugins_url( \'client-side-image-resize.js\' , __FILE__ ) , array(\'media-editor\' ) , \'0.0.1\' );
wp_localize_script( \'client-resize\' , \'client_resize\' , array(
\'plupload\' => array(
\'resize\' => array(
\'enabled\' => true,
\'width\' => 1920, // enter your width here
\'height\' => 1200, // enter your width here
\'quality\' => 90,
),
)
) );
}
add_action( \'wp_enqueue_media\' , \'client_side_resize_load\' );
php将创建一个名为client_resize
并将以下脚本排队。保存另一个名为client-side-image-resize.js
在同一目录中:
(function(media){
var oldReady = media.view.UploaderWindow.prototype.ready;
media.view.UploaderWindow.prototype.ready = function() {
if ( ! this.options.uploader.plupload )
this.options.uploader.plupload = client_resize.plupload;
// back to default behaviour
oldReady.apply( this , arguments );
};
})(wp.media);
JS正在配置Plupload,以便在上载图像之前调整客户端图像的大小。下一步是扫描WPs图像大小以获得最大的可能大小,以便自动配置client_resize
js对象。
我想调整服务器上的图像大小,我的WordPress站点库中有7000多个图像。我想调整服务器本身上所有图像的大小。我知道可以使用“重新生成缩略图”插件,但为此,我将不得不整天打开浏览器窗口,甚至可能在中间某个地方崩溃,这将导致我再次调整所有图像的大小。有谁有更好的主意来做这件事吗?请简要解释答案。