/ Плагины / Metabox woocommerce

Metabox woocommerce

HIT

13.10.2016

3591

1

У плагина woocommerce есть набор дополнительных полей при редактировании товара. При необходимости можно в группы полей WC добавить свои произвольные metabox. Должно получится так:
mastering-woocommerce-product-fields

Создание и отображение metabox

Первый экшн это создание metabox, второй сохранение значений. Ниже функция создания дополнительного поля.

add_action( 'woocommerce_product_options_general_product_data', 'woo_add_custom_general_fields' );
add_action( 'woocommerce_process_product_meta', 'woo_add_custom_general_fields_save' );

function woo_add_custom_general_fields() {

  global $woocommerce, $post;
  
  echo '<div class="options_group">';
  
  // Metabox WC помещаются сюда..
  
  echo '</div>';
	
}

В примере выше созданные метаполя попадут в первую закладку woocommerce — Основные. В зависимости от того в какую закладку нам необходимо поместить надо менять хук (выделено жирным в коде):
woocommerce_product_options_general_product_data — Основные
woocommerce_product_options_inventory_product_data — Запасы
woocommerce_product_options_shipping_product_data — Доставка (не выводится)
woocommerce_product_options_linked_product_data — Сопутствующие (не выводится)
woocommerce_product_options_product_attributes — Атрибуты (не выводится)
woocommerce_product_options_advanced_product_data — Дополнительно (не выводится)

Metabox выводится только в первых 2-х вариантах, в остальных вкладках не выводится

Типы metabox woocommerce

Текстовое поле
_text_field — slug метаполя

woocommerce_wp_text_input( 
	array( 
		'id'          => '_text_field', 
		'label'       => __( 'My Text Field', 'woocommerce' ), 
		'placeholder' => 'http://',
		'desc_tip'    => 'true',
		'description' => __( 'Enter the custom value here.', 'woocommerce' ) 
	)
);

Числовое поле
_number_field — slug метаполя

woocommerce_wp_text_input( 
	array( 
		'id'                => '_number_field', 
		'label'             => __( 'My Number Field', 'woocommerce' ), 
		'placeholder'       => '', 
		'description'       => __( 'Enter the custom value here.', 'woocommerce' ),
		'type'              => 'number', 
		'custom_attributes' => array(
				'step' 	=> 'any',
				'min'	=> '0'
			) 
	)
);

Поле область текста
_textarea — slug метаполя

woocommerce_wp_textarea_input( 
	array( 
		'id'          => '_textarea', 
		'label'       => __( 'My Textarea', 'woocommerce' ), 
		'placeholder' => '', 
		'description' => __( 'Enter the custom value here.', 'woocommerce' ) 
	)
);

Выпадающий список
_select — slug метаполя

woocommerce_wp_select( 
array( 
	'id'      => '_select', 
	'label'   => __( 'My Select Field', 'woocommerce' ), 
	'options' => array(
		'one'   => __( 'Option 1', 'woocommerce' ),
		'two'   => __( 'Option 2', 'woocommerce' ),
		'three' => __( 'Option 3', 'woocommerce' )
		)
	)
);

Checkbox
_checkbox — slug метаполя

woocommerce_wp_checkbox( 
array( 
	'id'            => '_checkbox', 
	'wrapper_class' => 'show_if_simple', 
	'label'         => __('My Checkbox Field', 'woocommerce' ), 
	'description'   => __( 'Check me!', 'woocommerce' ) 
	)
);

Скрытое поле
_hidden_field — slug метаполя

woocommerce_wp_hidden_input(
array( 
	'id'    => '_hidden_field', 
	'value' => 'hidden_value'
	)
);

Специфическое поле — выбор товара
_product_field_type_ids — slug метаполя

?>
<p class="form-field product_field_type">
<label for="product_field_type"><?php _e( 'Product Select', 'woocommerce' ); ?></label>
<select id="product_field_type" name="product_field_type[]" class="ajax_chosen_select_products" multiple="multiple" data-placeholder="<?php _e( 'Search for a product&hellip;', 'woocommerce' ); ?>">
	<?php
		$product_field_type_ids = get_post_meta( $post->ID, '_product_field_type_ids', true );
		$product_ids = ! empty( $product_field_type_ids ) ? array_map( 'absint',  $product_field_type_ids ) : null;
		if ( $product_ids ) {
			foreach ( $product_ids as $product_id ) {

				$product      = get_product( $product_id );
				$product_name = woocommerce_get_formatted_product_name( $product );

				echo '<option value="' . esc_attr( $product_id ) . '" selected="selected">' . esc_html( $product_name ) . '</option>';
			}
		}
	?>
</select> <img class="help_tip" data-tip='<?php _e( 'Your description here', 'woocommerce' ) ?>' src="<?php echo $woocommerce->plugin_url(); ?>/assets/images/help.png" height="16" width="16" />
</p>
<?php

Специфическое поле — произвольные поля
Тут можно добавлять дополнительные поля созданные другими модулями.
_custom_field_type — slug метаполя

?>
<p class="form-field custom_field_type">
	<label for="custom_field_type"><?php echo __( 'Custom Field Type', 'woocommerce' ); ?></label>
	<span class="wrap">
		<?php $custom_field_type = get_post_meta( $post->ID, '_custom_field_type', true ); ?>	
		<input placeholder="<?php _e( 'Field One', 'woocommerce' ); ?>" class="" type="number" name="_field_one" value="<?php echo $custom_field_type[0]; ?>" step="any" min="0" style="width: 80px;" />
		<input placeholder="<?php _e( 'Field Two', 'woocommerce' ); ?>" type="number" name="_field_two" value="<?php echo $custom_field_type[1]; ?>" step="any" min="0" style="width: 80px;" />
	</span>
	<span class="description"><?php _e( 'Place your own description here!', 'woocommerce' ); ?></span>
</p>
<?php
Слаги метаполей можно (и нужно) менять на свои значения подходящие по смыслу

Сохранение значений metabox

Функция сохранения значений для всех вышеописанных типов полей.

function woo_add_custom_general_fields_save( $post_id ){
	
	// Text Field
	$woocommerce_text_field = $_POST['_text_field'];
	if( !empty( $woocommerce_text_field ) )
		update_post_meta( $post_id, '_text_field', esc_attr( $woocommerce_text_field ) );
		
	// Number Field
	$woocommerce_number_field = $_POST['_number_field'];
	if( !empty( $woocommerce_number_field ) )
		update_post_meta( $post_id, '_number_field', esc_attr( $woocommerce_number_field ) );
		
	// Textarea
	$woocommerce_textarea = $_POST['_textarea'];
	if( !empty( $woocommerce_textarea ) )
		update_post_meta( $post_id, '_textarea', esc_html( $woocommerce_textarea ) );
		
	// Select
	$woocommerce_select = $_POST['_select'];
	if( !empty( $woocommerce_select ) )
		update_post_meta( $post_id, '_select', esc_attr( $woocommerce_select ) );
		
	// Checkbox
	$woocommerce_checkbox = isset( $_POST['_checkbox'] ) ? 'yes' : 'no';
	update_post_meta( $post_id, '_checkbox', $woocommerce_checkbox );
	
	// Hidden Field
	$woocommerce_hidden_field = $_POST['_hidden_field'];
	if( !empty( $woocommerce_hidden_field ) )
	update_post_meta( $post_id, '_hidden_field', esc_attr( $woocommerce_hidden_field ) );
		
	// Product Field Type
	$product_field_type =  $_POST['product_field_type'];
	update_post_meta( $post_id, '_product_field_type_ids', $product_field_type );

        // Custom Field
	$custom_field_type =  array( esc_attr( $_POST['_field_one'] ), esc_attr( $_POST['_field_two'] ) );
	update_post_meta( $post_id, '_custom_field_type', $custom_field_type );
	
}

По материалам статьи Remi Corson Mastering WooCommerce Products Custom Fields

Вывод metabox WC

Метабоксы woocommerce выводятся также как и стандартные

echo get_post_meta($post->ID, 'video_field', true);

Если нужно вывести через функцию, то надо добавить global $post;. Пример вывода метабокса через функцию:

function video_product_tab_content() {
  
global $post;  
echo '<iframe width="560" height="315" src="';
echo get_post_meta($post->ID, 'video_field', true);
echo '" frameborder="0" allowfullscreen></iframe>';
  
}
add_filter( 'woocommerce_product_tabs', 'video_product_tab' );

Создание секции (таба) для дополнительных полей

Если созданные дополнительные поля по функционалу входят в одну группу, то для них можно создать отдельную секцию.

// Создаем пользовательскую секцию полей товара

add_filter( 'woocommerce_product_data_tabs', 'add_my_custom_product_data_tab' );
function add_my_custom_product_data_tab( $product_data_tabs ) {
$product_data_tabs['my-custom-tab'] = array(
'label' => __( 'My Custom Tab', 'my_text_domain' ),
'target' => 'my_custom_product_data',
);
return $product_data_tabs;
}

add_action( 'woocommerce_product_data_panels', 'add_my_custom_product_data_fields' );
function add_my_custom_product_data_fields() {
global $woocommerce, $post;
?>
<!-- id below must match target registered in above add_my_custom_product_data_tab function -->
<div id="my_custom_product_data" class="panel woocommerce_options_panel">
<?php
woocommerce_wp_checkbox( array(
'id' => '_my_custom_field',
'wrapper_class' => 'show_if_simple',
'label' => __( 'My Custom Field Label', 'my_text_domain' ),
'description' => __( 'My Custom Field Description', 'my_text_domain' ),
'default' => '0',
'desc_tip' => false,
) );
?>
</div>
<?php
}

Поделиться в соц. сетях:

  • Похожие записи
  • Комментарии
  • Вложения
Колесо удачи для интернет-магазина

Колесо удачи для интернет-магазина

Добавим на интернет-магазин возможность посетителям проверить свою удачу посредством колеса удачи. Колесо представляет собой барабан с секторами с разными вариантами скидок, либо отсутствия их. Lucky Wheel for WooCommerce – Spin Читать далее »

Выравнивание миниатюр товаров

Выравнивание миниатюр товаров

Идеальная ситуация, когда мы загружаем изображения для товаров (хотя бы для главного изображения) квадратными. т.е. заранее подготовленными, откадрированными. Но бывают случаи, когда на сайт начинают заливаться изображения разных пропорций. Сделаем Читать далее »

/
Woocommerce и валюта

Woocommerce и валюта

Разбираем различные решения по работе с валютами (не мультивалютность, это отдельная тема). Курс в другой валюте Если мы торгуем на сайте в рублях, но нам нужно чтобы рядом с каждой Читать далее »

Добавить комментарий

1 комментарий

  1. Дмитрий

    У меня после использования данной функции, почему то не сохранялось значение, тоесть оно сохранялось, но только 1-н раз, больше его поменять нельзя было, например:
    У меня есть селектор с 2-мя вариантами
    1)Нет(Стоит по умолчанию)
    2)Да
    После того как выбрал значение «Да», значение «Нет» уже нельзя будет вернуть, так же и с чекбоксами, если поставил галочку, убрать ее уже нельзя, после обновления поста она обратно возвращается. Тоесть сохраняется мета поле только один раз, нашел решение, может кому пригодится, использовал функции приведённые в статье.
    Вот что я делал себе:
    // Display Fields
    add_action( ‘woocommerce_product_options_general_product_data’, ‘woo_add_custom_general_fields’ );
     
    // Save Fields
    add_action( ‘woocommerce_process_product_meta’, ‘woo_add_custom_general_fields_save’ );
     
    function woo_add_custom_general_fields() {
     
      global $woocommerce, $post;
     
      echo ‘<div class=»options_group»>’;
     
        // Select
        woocommerce_wp_select( 
        array( 
         ‘id’      => ‘_select’, 
         ‘label’   => __( ‘Обозначить это обьявление как ТОП?’, ‘woocommerce’ ), 
         ‘options’ => array(
         ‘ ‘   => __( ‘No’, ‘woocommerce’ ),
         ‘Топ’   => __( ‘Yes’, ‘woocommerce’ ),
         )
         )
        );
      echo ‘</div>’;
    }
    function woo_add_custom_general_fields_save( $post_id ){
        $woocommerce_select = $_POST[‘_select’];
         if( !empty( $woocommerce_select ) ){
          update_post_meta( $post_id, ‘_select’, esc_attr( $woocommerce_select ) );
         }
         else{
          update_post_meta( $post_id, ‘_select’, » );
         }
    }
    Изменения внесены только в конце в функцию  woo_add_custom_general_fields_save
    Просто добавил условие else

Metabox woocommerce Metabox woocommerce
Плавающий боковой блок
Рекомендации для васПлавающий боковой блокOpttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.