如何根据自定义操作创建不同的媒体上传框/滤镜库

时间:2017-03-24 作者:Nosebleed

事情是这样的。我在前端使用WP媒体上传器。我需要的是让它根据特定的动作表现出不同的行为。

我正在将媒体附加到特定的自定义贴子类型的单页中。

这是我代码的一个小摘录。我用这个来触发媒体库。

var uploader = wp.media({
        title: \'Upload Image\',
        multiple: false
    }).open()
    .on(\'select\', function(e){
    // Some code here
    });
然后,通过在此处使用此筛选器并使用$\\u请求获取当前帖子id,我正在筛选库以仅显示库中的某些附件:

function show_current_user_attachments( $query = array() ) {

   //Modify the query here to show current user attachments only
   return $query;
}
add_filter( \'ajax_query_attachments_args\', \'show_current_user_attachments\', 10, 1 );
到目前为止还不错,但我需要在当前的帖子上另一个单独的逻辑。我需要触发另一个wp。与此完全不同的媒体。它不需要具有上载图像功能,并且需要在库中显示不同的附件。

简单地说,我的问题是如何扩展wp。介质并传递我可以在“ajax\\u query\\u attachments\\u args”过滤器中处理的不同参数,因此我有两个功能完全不同的介质弹出窗口?

提前感谢!

1 个回复
SO网友:Samyer

您必须创建两个不同的媒体模式,根据您的点击事件触发。以下是我最近在tinyMCE可视化编辑器中添加这些按钮的项目中的一些代码:

jQuery(document).ready(function($){
$(document).on(\'click\', \'.mce-my_upload_button\', upload_image_tinymce);
$(document).on(\'click\', \'.mce-my_upload_pdf_button\', upload_pdf_tinymce);

function upload_image_tinymce(e) {
    e.preventDefault();
    var $input_field = $(\'.mce-my_input_image\');
    var custom_uploader = wp.media.frames.file_frame = wp.media({
        title: \'Add Image\',
        button: {
            text: \'Add Image\'
        },
         library: {
            type: \'image\'
        },
        multiple: false
    });
    custom_uploader.on(\'select\', function() {
        var attachment = custom_uploader.state().get(\'selection\').first().toJSON();
        $input_field.val(attachment.sizes.medium.url);
    });
    custom_uploader.open();
}
function upload_pdf_tinymce(e) {
    e.preventDefault();
    var $input_field = $(\'.mce-my_input_pdf\');
    var custom_uploader = wp.media.frames.file_frame = wp.media({
        title: \'Add PDF\',
        button: {
            text: \'Add PDF\'
        },
        library: {
            type: \'application/pdf\'
        },
        multiple: false
    });
    custom_uploader.on(\'select\', function() {
        var attachment = custom_uploader.state().get(\'selection\').first().toJSON();
        $input_field.val(attachment.url);
    });
    custom_uploader.open();
}});
希望这有帮助!