【发布时间】：2016-11-06 22:35:35
【问题描述】：
我正在开发一个新主题，我真的需要 3 个图像上传选项来触发弹出媒体上传框。
我知道现在推荐使用定制器，但仅将它用于样式（即颜色和字体）对我来说才有意义，并且仍然有一个主题设置部分，这就是我所做的。
在尝试了许多解决方案之后，Rushabh Dave 的解决方案 here 效果很好，几乎完美但并不完全...
我的问题是我得到弹出框，选择图像，然后我有该图像的 URL，但是当我点击保存时，页面刷新但我的图像没有保存，URL 消失，因此我无法选择它在前端。
我不确定我做错了什么。
在functions.php中
<?php
// jQuery
wp_enqueue_script('jquery');
// This will enqueue the Media Uploader script
wp_enqueue_media();
?>
<div>
<label for="image_url">Image</label>
<input type="text" name="image_url" id="image_url" class="regular-text" />
<input type="button" name="upload-btn" id="upload-btn" class="button-secondary" value="Upload Image">
</div>
<script type="text/javascript">
jQuery(document).ready(function($){
$('#upload-btn').click(function(e) {
e.preventDefault();
var image = wp.media({
title: 'Upload Image',
// mutiple: true if you want to upload multiple files at once
multiple: false
}).open()
.on('select', function(e){
// This will return the selected image from the Media Uploader, the result is an object
var uploaded_image = image.state().get('selection').first();
// We convert uploaded_image to a JSON object to make accessing it easier
// Output to the console uploaded_image
console.log(uploaded_image);
var image_url = uploaded_image.toJSON().url;
// Let's assign the url value to the input field
$('#image_url').val(image_url);
});
});
});
</script>
在前端
<div><img src="<?php echo $options['image_url']; ?>" /></div>
【问题讨论】：
-
你在哪里上传这些图片？前端，后端？
-
这就是我有点困惑的地方。我（愚蠢地）假设用户可以单击“添加媒体”，选择他们的图像，然后将其上传到服务器并保存。然后我可以在前端调用这个来显示它。
-
但是抱歉，您的意思可能是“添加媒体”选项在哪里。它位于后台后台的“主题设置”部分。
-
如果您希望用户将图像上传到您的 WordPress，我不建议您使用媒体上传器。他们将能够看到您媒体库 (you could restrict it) 中的所有图像。我会使用简单的文件上传输入并使用media_handle_sideload 加载图像
-
抱歉，这里有些混乱。我不希望用户上传到我的媒体库。这是他们将使用的主题，而不是我的。我为客户开发主题，但不经常使用主题设置，所以我尝试添加很多选项，以便他们可以自己更新所有选项，这样他们就可以看到自己的媒体库了。
标签： php wordpress themes settings