随着Meta一词的引入，WordPress 4+的这一点已经更新。代码被大量注释。
:: My Functions - functions.php ::
以下功能用于在“添加新类别”屏幕上显示颜色选择器：
/**
* Add new colorpicker field to "Add new Category" screen
* - https://developer.wordpress.org/reference/hooks/taxonomy_add_form_fields/
*
* @param String $taxonomy
*
* @return void
*/
function colorpicker_field_add_new_category( $taxonomy ) {
?>
<div class="form-field term-colorpicker-wrap">
<label for="term-colorpicker">Category Color</label>
<input name="_category_color" value="#ffffff" class="colorpicker" id="term-colorpicker" />
<p>This is the field description where you can tell the user how the color is used in the theme.</p>
</div>
<?php
}
add_action( \'category_add_form_fields\', \'colorpicker_field_add_new_category\' ); // Variable Hook Name
以下功能将把colorpicker字段添加到“Edit Category”（编辑类别）屏幕：
/**
* Add new colopicker field to "Edit Category" screen
* - https://developer.wordpress.org/reference/hooks/taxonomy_add_form_fields/
*
* @param WP_Term_Object $term
*
* @return void
*/
function colorpicker_field_edit_category( $term ) {
$color = get_term_meta( $term->term_id, \'_category_color\', true );
$color = ( ! empty( $color ) ) ? "#{$color}" : \'#ffffff\';
?>
<tr class="form-field term-colorpicker-wrap">
<th scope="row"><label for="term-colorpicker">Severity Color</label></th>
<td>
<input name="_category_color" value="<?php echo $color; ?>" class="colorpicker" id="term-colorpicker" />
<p class="description">This is the field description where you can tell the user how the color is used in the theme.</p>
</td>
</tr>
<?php
}
add_action( \'category_edit_form_fields\', \'colorpicker_field_edit_category\' ); // Variable Hook Name
下面的函数将清理并保存术语meta，而不使用
# 但是有一个单独的函数，它将使用名为
sanitize_hex_color():
/**
* Term Metadata - Save Created and Edited Term Metadata
* - https://developer.wordpress.org/reference/hooks/created_taxonomy/
* - https://developer.wordpress.org/reference/hooks/edited_taxonomy/
*
* @param Integer $term_id
*
* @return void
*/
function save_termmeta( $term_id ) {
// Save term color if possible
if( isset( $_POST[\'_category_color\'] ) && ! empty( $_POST[\'_category_color\'] ) ) {
update_term_meta( $term_id, \'_category_color\', sanitize_hex_color_no_hash( $_POST[\'_category_color\'] ) );
} else {
delete_term_meta( $term_id, \'_category_color\' );
}
}
add_action( \'created_category\', \'save_termmeta\' ); // Variable Hook Name
add_action( \'edited_category\', \'save_termmeta\' ); // Variable Hook Name
现在已经添加了字段并保存了数据，我们需要将放置颜色选择器的脚本排队。请注意，在第一个条件测试中，我将根据分类法显示字段。
/**
* Enqueue colorpicker styles and scripts.
* - https://developer.wordpress.org/reference/hooks/admin_enqueue_scripts/
*
* @return void
*/
function category_colorpicker_enqueue( $taxonomy ) {
if( null !== ( $screen = get_current_screen() ) && \'edit-category\' !== $screen->id ) {
return;
}
// Colorpicker Scripts
wp_enqueue_script( \'wp-color-picker\' );
// Colorpicker Styles
wp_enqueue_style( \'wp-color-picker\' );
}
add_action( \'admin_enqueue_scripts\', \'category_colorpicker_enqueue\' );
最后，我们需要初始化colorpicker。在这里，我选择将其打印到页脚中，但将其放入外部文件并像普通脚本一样将其排队，可能会更有益，尤其是从插件的角度来看。
/**
* Print javascript to initialize the colorpicker
* - https://developer.wordpress.org/reference/hooks/admin_print_scripts/
*
* @return void
*/
function colorpicker_init_inline() {
if( null !== ( $screen = get_current_screen() ) && \'edit-category\' !== $screen->id ) {
return;
}
?>
<script>
jQuery( document ).ready( function( $ ) {
$( \'.colorpicker\' ).wpColorPicker();
} ); // End Document Ready JQuery
</script>
<?php
}
add_action( \'admin_print_scripts\', \'colorpicker_init_inline\', 20 );
