Метабокс тип color(picker), НАТИВНЫМ методом, кто делали?

Question

[trenton]

Вот как в этой статье делаются text, number, checkbox, по аналогии как сделать точно так же color?
Чтоб появлялась Айрис, выбрать в ней цвет и сохранить значение.
https://wpruse.ru/woocommerce/custom-fields-in-pro...
Iris встроена в тот же кастомайзер, значит это должно быть возможно.

Нашел по этому поводу вот такую статью, вроде бы оно.https://madebydenis.com/adding-metaboxes-to-your-p...
Понял, что надо через админку подключиться к api color-pickera, к скриптам и стилям.
Но не пойму, где это поле выводится, чтобы его попробовать, и пока не пойму, как его перевесить на любой из хуков первой статьи. В смысле на любой хук, который бы вывел эту красоту во вкладках продукта.
Может кто уже подобное делали? Или у кого глаз наметан.

Интересует именно и исключительно нативный способ. Может кто уже тоже докапывались до того же самого, что и я.

Comments

[Владимир Брумер]

Все просто:

включаем поддержку

add_action('admin_enqueue_scripts','enqueue_admin_scripts');
if(!function_exists('enqueue_admin_scripts')):function enqueue_admin_scripts(){
	wp_enqueue_style('wp-color-picker');
	wp_enqueue_script('wp-color-picker');
...

выводим в нужном месте инпут тип текст(не колор, хотя можно и колор).
<input type="text" class="wpColorChoose">
или
<input type="color" class="wpColorChoose">
если выводим там где не происходит обновление с помощью ajax, то можно для всех мест в админке проинициализировать вот так:

add_action('admin_footer','admin_footer_script',99);
if(!function_exists('admin_footer_script')){function admin_footer_script(){
		?><script type="text/javascript">
			jQuery(document).ready(function($){
				$('.wpColorChoose').wpColorPicker();

т.е просто добавляем нужному инпуту класс wpColorChoose

например в профле пользователя

add_action('show_user_profile','VAB_user_fields');
add_action('edit_user_profile','VAB_user_fields');
if(!function_exists('VAB_user_fields')){
	function VAB_user_fields($user){
		?><input type="text" class="wpColorChoose"><?php
...

если, например, в виджете, то лучше делать инициализацию в нурти виджета так как там обновляются данные без перезагрузки страницы

типо

...
public function form($instance){
...
<p><label for="<?php echo esc_attr($this->get_field_id('text-color'));?>"><?php esc_html_e('Цвет текста и ссылок','VAB');?></label><br/>
<input id="<?php echo esc_attr($this->get_field_id('text-color'));?>" type="text" name="<?php echo esc_attr($this->get_field_name('text-color'));?>" class="widefault widgetColorChoose" value="<?php echo $text_color;?>"></p>
...
<script type="text/javascript">jQuery(document).ready(function($){$('.widgetColorChoose').wpColorPicker();});</script>
...