问题
I have created a custom taxonomy and want to have a image option for each category.
function create_product_taxonomies()
{
// Add new taxonomy, make it hierarchical (like categories)
$labels = array(
'name' => _x('product_categories', 'taxonomy general name'),
'singular_name' => _x('Product', 'taxonomy singular name'),
'search_items' => __('Search Product Category'),
'all_items' => __('All Product Categorie(s)'),
'parent_item' => __('Parent Product Category'),
'parent_item_colon' => __('Parent Product Category:'),
'edit_item' => __('Edit Product Category'),
'update_item' => __('Update Product Category'),
'add_new_item' => __('Add New'),
'new_item_name' => __('New Product Name'),
'menu_name' => __('Product Categories'),
);
$args = array(
'hierarchical' => true,
'labels' => $labels,
'show_ui' => true,
'show_admin_column' => true,
'query_var' => true,
'rewrite' => array('slug' => 'product_categories', 'with_front' => true));
register_taxonomy('product_categories', array('products'), $args);
flush_rewrite_rules();
}
//hooks
add_action('init', 'create_product_taxonomies', 0);
How can I provide user the option to upload a image for each category?
回答1:
Before WordPress v4.4.2 Its very difficult but not possible to make custom meta field for terms but now its very easy and simple.
And you want to upload image so we create a js file and write some code in functions.php.
But first we create custom upload meta field.
In your function.php or where you write a code for register custom taxonomy and write this code:
First we create custom meta term field
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
}
Write your custom taxonomy before _add_form_fields in add_action() Like I write above"product_categories"_add_form_fields
Then we save meta term value
<?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);
}
}
?>
Same as above write your taxonomy name after created_ in add_action Like created_product_categories
Now we create meta term field for edit
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
}
Now save the edited value
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);
}
}
Now we Move to **JS File for WordPress Media Uploader**
media-uploader.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();
});
});
And now Last Step
Go to 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' );
Call the Image
Call the Image
<?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
}
?>
Its my working code so please use it carefully.
Hope this code will help you. And if this code work just accept my answer :)
回答2:
Can't add whole lot of code, But you would be able to get it
- Use ACF, advanced custom field : wordpress.org/plugins/advanced-custom-fields/
Here is documentation for it documentation
Moreover for taxonomy related , github acf-taxonomy-field
here is a snippet from my theme:
register_field_group( array (
'id' => 'acf_taxonomy-authors',
'title' => 'Taxonomy Authors',
'fields' => array (
array (
'key' => 'field_560746011af90',
'label' => 'Book Authors',
'name' => 'book_authors',
'type' => 'image',
'instructions' => 'Upload the book author image here',
'save_format' => 'url',
'preview_size' => 'thumbnail',
'library' => 'all',
),
),
'location' => array (
array (
array (
'param' => 'ef_taxonomy',
'operator' => '==',
'value' => 'author',
'order_no' => 0,
'group_no' => 0,
),
),
),
'options' => array (
'position' => 'normal',
'layout' => 'default',
'hide_on_screen' => array (
),
),
'menu_order' => 0,
));
and taxonoy registration :
<?php
/**
* @uses Register Book Author Taxonomy
* @uses Adds query vars
* @author Nirpendra Patel
* @return void
**/
function reg_tax_author() {
$authors = array(
'name' => _x( 'Authors', 'Taxonomy plural name', 'b_thebookstore' ),
'singular_name' => _x( 'Author', 'Taxonomy singular name', 'b_thebookstore' ),
'search_items' => __( 'Search Authors', 'b_thebookstore' ),
'popular_items' => __( 'Popular Authors', 'b_thebookstore' ),
'all_items' => __( 'All Authors', 'b_thebookstore' ),
'parent_item' => __( 'Parent Author', 'b_thebookstore' ),
'parent_item_colon' => __( 'Parent Author:', 'b_thebookstore' ),
'edit_item' => __( 'Edit Author', 'b_thebookstore' ),
'update_item' => __( 'Update Author', 'b_thebookstore' ),
'add_new_item' => __( 'Add New Author', 'b_thebookstore' ),
'new_item_name' => __( 'New Author Name', 'b_thebookstore' ),
'add_or_remove_items' => __( 'Add or remove Authors', 'b_thebookstore' ),
'choose_from_most_used' => __( 'Choose from most used Authors', 'b_thebookstore' ),
'menu_name' => __( 'Authors', 'b_thebookstore' ),
);
$args = array(
'labels' => $authors,
'public' => true,
'show_in_nav_menus' => true,
'show_admin_column' => true,
'hierarchical' => true,
'show_tagcloud' => true,
'show_ui' => true,
'query_var' => true,
'rewrite' => true,
'query_var' => true,
'capabilities' => array(),
);
register_taxonomy( 'author', array( 'product' ), $args );
}
?>
来源：https://stackoverflow.com/questions/36029351/custom-taxonomy-image-option-in-admin-panel