在 WordPress v4.4.2 之前,为术语创建自定义元字段非常困难但不可能,但现在它非常容易和简单。
你想上传图片所以我们创建一个js文件并在functions.php中写一些代码。
但首先我们创建自定义上传元字段。
在您的function.php 或您编写用于注册自定义分类的代码并编写此代码的地方:
首先我们创建自定义元术语字段
add_action('product_categories_add_form_fields', 'add_term_image', 10, 2);
function add_term_image($taxonomy){
?>
<div class="form-field term-group">
<label for="">Upload and Image</label>
<input type="text" name="txt_upload_image" id="txt_upload_image" value="" style="width: 77%">
<input type="button" id="upload_image_btn" class="button" value="Upload an Image" />
</div>
<?php
}
在 add_action() 中的 _add_form_fields 之前写下您的自定义分类,就像我在上面写的"product_categories"_add_form_fields
然后我们保存元词值
<?php
add_action('created_product_categories', 'save_term_image', 10, 2);
function save_term_image($term_id, $tt_id) {
if (isset($_POST['txt_upload_image']) && '' !== $_POST['txt_upload_image']){
$group = '#' . sanitize_title($_POST['txt_upload_image']);
add_term_meta($term_id, 'term_image', $group, true);
}
}
?>
与上述相同,在 add_action 中 created_ 之后写下您的分类名称 Like created_product_categories
现在我们为编辑创建元术语字段
add_action('product_categories_edit_form_fields', 'edit_image_upload', 10, 2);
function edit_image_upload($term, $taxonomy) {
// get current group
$txt_upload_image = get_term_meta($term->term_id, 'term_image', true);
?>
<div class="form-field term-group">
<label for="">Upload and Image</label>
<input type="text" name="txt_upload_image" id="txt_upload_image" value="<?php echo $txt_upload_image ?>" style="width: 77%">
<input type="button" id="upload_image_btn" class="button" value="Upload an Image" />
</div>
<?php
}
现在保存编辑的值
add_action('edited_product_categories', 'update_image_upload', 10, 2);
function update_image_upload($term_id, $tt_id) {
if (isset($_POST['txt_upload_image']) && '' !== $_POST['txt_upload_image']){
$group = '#' . sanitize_title($_POST['txt_upload_image']);
update_term_meta($term_id, 'term_image', $group);
}
}
现在我们转到 **JS WordPress 媒体上传器文件**
媒体上传器.js
jQuery(document).ready(function($){
// Instantiates the variable that holds the media library frame.
var meta_image_frame;
// Runs when the image button is clicked.
$('#upload_image_btn').click(function(e){
// Prevents the default action from occuring.
e.preventDefault();
// If the frame already exists, re-open it.
if ( meta_image_frame ) {
meta_image_frame.open();
return;
}
// Sets up the media library frame
meta_image_frame = wp.media.frames.meta_image_frame = wp.media({
title: meta_image.title,
button: { text: meta_image.button },
library: { type: 'image' }
});
// Runs when an image is selected.
meta_image_frame.on('select', function(){
// Grabs the attachment selection and creates a JSON representation of the model.
var media_attachment = meta_image_frame.state().get('selection').first().toJSON();
// Sends the attachment URL to our custom image input field.
$('#txt_upload_image').val(media_attachment.url);
});
// Opens the media library frame.
meta_image_frame.open();
});
});
现在是最后一步
转到functions.php
function image_uploader_enqueue() {
global $typenow;
if( ($typenow == 'products') ) {
wp_enqueue_media();
wp_register_script( 'meta-image', get_template_directory_uri() . '/js/media-uploader.js', array( 'jquery' ) );
wp_localize_script( 'meta-image', 'meta_image',
array(
'title' => 'Upload an Image',
'button' => 'Use this Image',
)
);
wp_enqueue_script( 'meta-image' );
}
}
add_action( 'admin_enqueue_scripts', 'image_uploader_enqueue' );
调用图像
调用图像
<?php
$categories = get_terms('product_categories');
foreach($categories as $term) {
$upload_image = get_term_meta($term->term_id, 'term_image', true);
?>
<img src="<?php echo $upload_image ?>">
<?php
}
?>
这是我的工作代码,请谨慎使用。
希望此代码对您有所帮助。如果此代码有效,请接受我的回答 :)