您需要做的第一件事是能够在您使用的页面上加载WordPress媒体管理器。这意味着您需要加载WordPress的核心,或者从WP调用media方法。下面的代码将加载WordPress core并查询所有需要调用媒体管理器的文件。
require_once( \'wp-load.php\' );
wp_enqueue_media();
接下来要做的事情是创建一个javascript函数来加载WordPress媒体管理器。以下函数将执行此操作,然后将所选图像返回到触发它的TinyMCE实例。原因是,页面上可能有多个TinyMCE实例,您需要确保将数据返回到正确的实例。
<script type="text/javascript">
function wpmediabrowser(field_name, url, type, win)
{
var image = wp.media({
title: \'Upload Image\',
multiple: false
}).open().on(\'select\', function(e){
var uploaded_image = image.state().get(\'selection\').first();
jQuery("#" + field_name).val(uploaded_image["attributes"]["url"]);
var arr = field_name.split(\'-\');
var field = arr[0];
var number = parseInt(field.split(\'_\')[1]) + 1;
var descriptionid = field.split(\'_\')[0] + "_" + number;
jQuery("#" + descriptionid).val(uploaded_image["attributes"]["description"]);
});
}
</script>
您可以通过使用a href调用该函数来测试其是否工作。要做的最后一步是将此函数链接到TinyMCE的init中。以下代码就是您所需要的全部代码
"file_browser_callback: wpmediabrowser,";
TinyMCE init中的此变量将告诉应用程序您正在使用文件管理器,并在单击browse按钮时调用名为“wpmediabrowser”的函数。当您从WordPress文件管理器中选择图像时,它会将图像url返回到框中。