Настройки товара

Урок 5

Зарегистрируйтесь или войдите и получите бесплатный доступ к первым 2-м урокам курса.

Урок 5

Настройки товара

Структура этого урока будет следующей – сначала рассмотрим общий пример кода, используя который вы сможете добавлять свой поля в настройки товаров, потом покажу, как добавлять поля в разные вкладки настроек товара в WooCommerce, а уже потом создадим свою вкладку.

В контексте плагина, который мы разрабатываем на протяжении этого видеокурса, добавим в настройки товара два поля – на минимальное количество товара и на максимальное количество, которое можно указать при добавлении в корзину.

Чтобы скачать плагин, который получился в процессе этого урока, нужно купить курс.

Добавление собственных настроек в товары WooCommerce
Тут мы добавили два поля во вкладку «Запасы», но я также покажу вам, как это делать и для других вкладок метабокса «Данные Товара».

Вот структура кода:

add_action( 'woocommerce_product_options_inventory_product_data', 'truemisha_product_options' );
 
function truemisha_product_options() {
 
	echo '<div class="option_group">';
 
	// выводим тут поля
 
	echo '</div>';
 
}
 
 
add_action( 'woocommerce_process_product_meta', 'truemisha_save_checkboxes', 20, 2 );
 
function truemisha_save_checkboxes( $id, $post ){
 
	// сохраняем значения полей
	// не забываем про их очистку
 
}

Давайте теперь разбираться подробно, что к чему.

  • Когда вы добавляете свои поля внутрь <div class="option_group">, то вы создаёте группу полей, они будут красиво разделены серой линией (видно на скриншоте выше).
  • Для вывода полей вы конечно можете использовать обычный HTML, но я однозначно рекомендую встроенные в WooCommerce функции woocommerce_wp_text_input(), woocommerce_wp_textarea_input(), woocommerce_wp_checkbox(), woocommerce_wp_select() и woocommerce_wp_radio(), которые как раз для этой цели и предназначены!
  • Как вы поняли, настройки сохраняются как обычные метаданные, поэтому используем get_post_meta() для получения (но обратите внимание, что value можно не указывать, если ключ мета-поля совпадает с id поля) и update_post_meta() для сохранения
  • Вы можете заморочиться и добавить ещё одну nonce-проверку в свой код, но WooCommerce и так добавляет одну.
  • Не забываем про очистку полей при сохранении, её никто не отменял, а вот про очистку при выводе – забудьте, всё уже встроено в функции вывода полей.

Добавление полей в другие вкладки настроек

Вкладка «Основные»

  • woocommerce_product_options_general_product_data – то, что использовали мы для создания группы настроек,
  • woocommerce_product_options_pricing – группа полей с ценами,
  • woocommerce_product_options_tax – группа полей с налогами.

Вкладка «Запасы»

  • woocommerce_product_options_stock_status – первая группа полей,
  • woocommerce_product_options_sold_individually – вторая группа, там где чекбокс индивидуальной продажи,
  • woocommerce_product_options_inventory_product_data – создание собственной группы полей.

Вкладка «Доставка»

  • woocommerce_product_options_dimensions – первая группа полей с габаритами товара,
  • woocommerce_product_options_shipping – вторая группа полей.

Бам, а тут нельзя создать собственную группу полей, придётся довольствоваться тем, что есть.

Вкладка «Сопутствующие»

Тут всего один хук – woocommerce_product_options_related.

Вкладка «Дополнительно»

  • woocommerce_product_options_reviews – группа полей с отзывами,
  • woocommerce_product_options_advanced – если создаёте свою группу полей.

Создание своей вкладки

А что если нам не хватает стандартных владок метабокса и нужно добавить-таки свою собственную?

/*
 * Создание вкладки
 */
add_filter( 'woocommerce_product_data_tabs', 'truemisha_new_tab' );
 
function truemisha_new_tab( $tabs ){
 
	//unset( $tabs[ 'general' ] ); // отключаем вкладку Основные
	//unset( $tabs[ 'inventory' ] ); // Запасы
	//unset( $tabs[ 'shipping' ] ); // Доставка
	//unset( $tabs[ 'linked_product' ] ); // Сопутствующие
	//unset( $tabs[ 'attribute' ] ); // Атрибуты
	//unset( $tabs[ 'variations' ] ); // Вариации
	//unset( $tabs[ 'advanced' ] ); // Дополнительно
 
	$tabs[ 'truemisha' ] = array(
		'label'    => 'Настройки Миши',
		'target'   => 'truemisha_tab_content',
		'class' => array( 'class1', 'class2' ),
		'priority' => 15,
	);
	return $tabs;
 
}
 
/*
 * Заполнение вкладки
 */
add_action( 'woocommerce_product_data_panels', 'truemisha_tab_contents' );
 
function truemisha_tab_contents(){
 
	echo '<div id="truemisha_tab_content" class="panel woocommerce_options_panel hidden">';
 
	// тут уже выводим поля
 
	echo '</div>';
 
}
 
/*
 * Сохранение полей
 */
add_action( 'woocommerce_process_product_meta', 'бла бла бла...'
  • Бонусом показал вам, как удалить стандартные вкладки настроек товара 😁
  • При указании параметров вкладки (строки 17-20) самый важный, понятно, это target, который должен совпадать с атрибутом ID на строке 33.
  • Меняя параметр priority, можно изменить порядок расположения вашей вкладки по отношению к другим.

Вот что у меня получилось:

Создание произвольной вкладки настроек товара в WooCommerce

Наверное последний вопрос, который тут можно задать это – «А как указать произвольную иконку, например из Dashicons?» И ответ максимально банален – «При помощи CSS».

Условия отображения полей

Когда вы работаете с товарами, вы не могли не заметить, что определённые вкладки и настройки появляются и исчезают в зависимости от например выбранного типа товара. Например вкладка настроек вариаций появляется только для вариативных товаров.

Можем ли мы это как-то использовать и для своих вкладок и полей?

Вот о чём я говорю:

Выбор типа товара в настройках товара WooCommerce

Да и ещё раз да! Вы можете отображать или скрывать свои вкладки настроек, поля или группы полей в зависимости от типа товара, от того, виртуальный товар или скачиваемый! 🚀

Для этого нужно лишь указать соответствующий CSS класс. И вот их список:

  • hide_if_simple, show_if_simple – скрываем / отображаем, если простой товар,
  • hide_if_grouped, show_if_grouped – если сгруппированный,
  • hide_if_external, show_if_external – если внешний,
  • hide_if_variable, show_if_variable – если вариативный,
  • hide_if_virtual, show_if_virtual – если виртуальный,
  • hide_if_downloadable, show_if_downloadable – если скачиваемый.

Также у вас есть возможность использовать несколько классов сразу!

Купить курс
  • 11 видеоуроков
  • Можно скачать готовый код после каждого урока
  • Можно начать проходить курс сразу же после оплаты
  • Единоразовый платёж
  • Доступ навсегда
  • Уроки актуальны в 2024-м году
7000 р

Нажав на кнопку, вы соглашаетесь c условиями предоставления услуг и с обработкой персональных данных.