Создаем загрузчик изображений для термина таксономии. Данный пост содержит чистый метод создания metabox для термина таксономии. Есть более универсальный метод добавления изображений терминам, но нижеописанный способ может стать дополнительным, когда одного изображения не достаточно.
Создание метабокса-загрузчика
if ( ! class_exists( 'CT_TAX_META' ) ) {
class CT_TAX_META {
public function __construct() {
//
}
/*
* Initialize the class and start calling our hooks and filters
* @since 1.0.0
*/
public function init() {
add_action( 'product_tag_add_form_fields', array ( $this, 'add_product_tag_image' ), 10, 2 );
add_action( 'created_product_tag', array ( $this, 'save_product_tag_image' ), 10, 2 );
add_action( 'product_tag_edit_form_fields', array ( $this, 'update_product_tag_image' ), 10, 2 );
add_action( 'edited_product_tag', array ( $this, 'updated_product_tag_image' ), 10, 2 );
add_action( 'admin_footer', array ( $this, 'add_script' ) );
}
/*
* Add a form field in the new product_tag page
* @since 1.0.0
*/
public function add_product_tag_image ( $taxonomy ) { ?>
<div class="form-field term-group">
<label for="product_tag-image-id"><?php _e('Image', 'hero-theme'); ?></label>
<input type="hidden" id="product_tag-image-id" name="product_tag-image-id" class="custom_media_url" value="">
<div id="product_tag-image-wrapper"></div>
<p>
<input type="button" class="button button-secondary ct_tax_media_button" id="ct_tax_media_button" name="ct_tax_media_button" value="<?php _e( 'Add Image', 'hero-theme' ); ?>" />
<input type="button" class="button button-secondary ct_tax_media_remove" id="ct_tax_media_remove" name="ct_tax_media_remove" value="<?php _e( 'Remove Image', 'hero-theme' ); ?>" />
</p>
</div>
<?php
}
/*
* Save the form field
* @since 1.0.0
*/
public function save_product_tag_image ( $term_id, $tt_id ) {
if( isset( $_POST['product_tag-image-id'] ) && '' !== $_POST['product_tag-image-id'] ){
$image = $_POST['product_tag-image-id'];
add_term_meta( $term_id, 'product_tag-image-id', $image, true );
}
}
/*
* Edit the form field
* @since 1.0.0
*/
public function update_product_tag_image ( $term, $taxonomy ) { ?>
<tr class="form-field term-group-wrap">
<th scope="row">
<label for="product_tag-image-id"><?php _e( 'Image', 'hero-theme' ); ?></label>
</th>
<td>
<?php $image_id = get_term_meta ( $term -> term_id, 'product_tag-image-id', true ); ?>
<input type="hidden" id="product_tag-image-id" name="product_tag-image-id" value="<?php echo $image_id; ?>">
<div id="product_tag-image-wrapper">
<?php if ( $image_id ) { ?>
<?php echo wp_get_attachment_image ( $image_id, 'thumbnail' ); ?>
<?php } ?>
</div>
<p>
<input type="button" class="button button-secondary ct_tax_media_button" id="ct_tax_media_button" name="ct_tax_media_button" value="<?php _e( 'Add Image', 'hero-theme' ); ?>" />
<input type="button" class="button button-secondary ct_tax_media_remove" id="ct_tax_media_remove" name="ct_tax_media_remove" value="<?php _e( 'Remove Image', 'hero-theme' ); ?>" />
</p>
</td>
</tr>
<?php
}
/*
* Update the form field value
* @since 1.0.0
*/
public function updated_product_tag_image ( $term_id, $tt_id ) {
if( isset( $_POST['product_tag-image-id'] ) && '' !== $_POST['product_tag-image-id'] ){
$image = $_POST['product_tag-image-id'];
update_term_meta ( $term_id, 'product_tag-image-id', $image );
} else {
update_term_meta ( $term_id, 'product_tag-image-id', '' );
}
}
/*
* Add script
* @since 1.0.0
*/
public function add_script() { ?>
<script>
jQuery(document).ready( function($) {
function ct_media_upload(button_class) {
var _custom_media = true,
_orig_send_attachment = wp.media.editor.send.attachment;
$('body').on('click', button_class, function(e) {
var button_id = '#'+$(this).attr('id');
var send_attachment_bkp = wp.media.editor.send.attachment;
var button = $(button_id);
_custom_media = true;
wp.media.editor.send.attachment = function(props, attachment){
if ( _custom_media ) {
$('#product_tag-image-id').val(attachment.id);
$('#product_tag-image-wrapper').html('<img class="custom_media_image" src="" style="margin:0;padding:0;max-height:100px;float:none;" />');
$('#product_tag-image-wrapper .custom_media_image').attr('src',attachment.sizes.thumbnail.url).css('display','block');
} else {
return _orig_send_attachment.apply( button_id, [props, attachment] );
}
}
wp.media.editor.open(button);
return false;
});
}
ct_media_upload('.ct_tax_media_button.button');
$('body').on('click','.ct_tax_media_remove',function(){
$('#product_tag-image-id').val('');
$('#product_tag-image-wrapper').html('<img class="custom_media_image" src="" style="margin:0;padding:0;max-height:100px;float:none;" />');
});
// Thanks: http://stackoverflow.com/questions/15281995/wordpress-create-product_tag-ajax-response
$(document).ajaxComplete(function(event, xhr, settings) {
var queryStringArr = settings.data.split('&');
if( $.inArray('action=add-tag', queryStringArr) !== -1 ){
var xml = xhr.responseXML;
$response = $(xml).find('term_id').text();
if($response!=""){
// Clear the thumb image
$('#product_tag-image-wrapper').html('');
}
}
});
});
</script>
<?php }
}
$CT_TAX_META = new CT_TAX_META();
$CT_TAX_META -> init();
}
Таксономию можно менять в Notepad++ путем поиска и замены. Естественно данный код можно оформить в виде плагина. Решение это нашел на сайте catapultthemes.com.
Вывод изображения
Получаем объект таксономии, из него получаем ID термина таксономии, далее
$image_id = get_term_meta ( $term->term_id, 'product_tag-image-id', true ); echo wp_get_attachment_image ( $image_id, 'large' );
Пример: вызов изображения метки товара, и последующий его вывод в карточке товара
function tag_actions_woocommerce() {
global $post;
$actions_id = wp_get_object_terms($post->ID, 'product_tag');
foreach ($actions_id as $action_id) :
$image_id = get_term_meta ( $action_id->term_id, 'product_tag-image-id', true );
echo wp_get_attachment_image ( $image_id, 'full' );
endforeach;
}
add_action( 'woocommerce_single_product_summary', 'tag_actions_woocommerce', 15 );
