在可视化编辑器中添加wordpress文件选择器

Question

我想知道如何在我的tinymce可视化编辑器的弹出窗口中添加一个文件选择器（默认的wordpress librairy会很完美）。

目前我有一个字段，我必须通过图片的网址，如果我可以添加一个按钮从我的图书馆中选择一张图片，那就太棒了！

这是我到目前为止所拥有的

editor.addButton('thumbnail', {
            title: 'Thumbnail',
            image: url+'/../images/icon-thumbnail.png',
            onclick: function() {
                // Open window
                editor.windowManager.open({
                    title: 'Thumbnail',
                    width: 940,
                    height: 150,
                    body: [
    //I have to change this line--------->  {type: 'textbox', name: 'url', label: 'Media URL'},<----- Is there an option to put a filepicker here ?
                        {type: 'textbox', name: 'caption', label: 'Caption'},
                        {type: 'checkbox', name: 'lightbox', value: '1', label: 'Lightbox'}
                    ],
                    onsubmit: function(e) {
                        if(e.data.url==''){
                            alert('you have to provide the media\'s URL');
                            e.stopPropagation();
                            e.preventDefault();
                        }else{
                            // Insert content when the window form is submitted
                            var shortCode = '[thumbnail url="'+e.data.url+'"';
                            if(e.data.caption != ''){
                                shortCode = shortCode+' caption="'+e.data.caption+'"';
                            }
                            if(e.data.lightbox){
                                shortCode = shortCode+' lightbox=true';
                            }
                            shortCode = shortCode+' ]';
                            editor.insertContent(shortCode);
                        }
                    }
                });
            }
        });

Answer 1

您可以阅读this有用的文章，this也可以提供帮助。

我不想复制粘贴文章中的文本，但基本上你必须在主题的functions.php文件中创建自定义PHP函数，它将处理媒体对话框显示，然后将其包含在{{1在事件add_action()上。

最后一部分是使用一些JavaScript和上传器，如下所示：

admin_print_scripts