WordPress 常规设置页面调用媒体中心上传图片插入URL（新版可用）

最新推荐文章于 2024-02-22 12:23:25 发布

程序小小生

最新推荐文章于 2024-02-22 12:23:25 发布

阅读量607

点赞数

分类专栏： WordPress 文章标签： WordPress WordPress媒体上传 WordPress上传图片字段 WordPress调用媒体中心

本文链接：https://blog.csdn.net/cnpinpai/article/details/133855835

版权

首先，我们需要在主题或插件文件夹中创建一个 JavaScript 文件（如：media-uploader.js），该文件中包含如下代码。

/**
 * 媒体中心上传 js
**/
jQuery(document).ready(function($){
	var mediaUploader;
	$('#upload_image_button').click(function(e) {
	 
	e.preventDefault();
	 
	if (mediaUploader) {
		mediaUploader.open();
		return;
	}
	 
	mediaUploader = wp.media.frames.file_frame = wp.media({
	title: '选择图片',
	button: {
	text: '选择图片'
	}, multiple: false });
	 
	mediaUploader.on('select', function() {
	var attachment = mediaUploader.state().get('selection').first().toJSON();
	 
	// 插入媒体URL到背景图像字段中
	$('#bzg_wechat_img').val(attachment.url);
	});
	 
	mediaUploader.open();
	});
});

上面代码所做的工作很简单，当我们点击 #upload_image_button 按钮时，代码调用wordpress的媒体上传工具，用户选择图片后，插入图片网址到 #background_image 字段，作为该字段的值。创建并保存好上面的代码文件后，下一步，我们需要把这个JavaScr