/ Плагины / Поле для вариативного товара

Поле для вариативного товара

HIT

01.08.2018

4035

Как делать произвольные (пользовательские) поля для товаров Woocommerce описано здесь. Но теперь пойдем дальше — сделаем поле для вариативного товара. Это должно открыть горизонты для интересных решений. Но я предвижу сложность в реализации вывода данного поля во фронтенде.

Создание и сохранение поля для вариации

// Add Variation Settings
add_action( 'woocommerce_product_after_variable_attributes', 'variation_settings_fields', 10, 3 );
// Save Variation Settings
add_action( 'woocommerce_save_product_variation', 'save_variation_settings_fields', 10, 2 );

// Create new fields for variations
function variation_settings_fields( $loop, $variation_data, $variation ) {
 // Text Field
 woocommerce_wp_text_input( 
 array( 
 'id'          => '_text_field[' . $variation->ID . ']', 
 'label'       => __( 'My Text Field', 'woocommerce' ), 
 'placeholder' => 'http://',
 'desc_tip'    => 'true',
 'description' => __( 'Enter the custom value here.', 'woocommerce' ),
 'value'       => get_post_meta( $variation->ID, '_text_field', true )
 )
 );
 // Number Field
 woocommerce_wp_text_input( 
 array( 
 'id'          => '_number_field[' . $variation->ID . ']', 
 'label'       => __( 'My Number Field', 'woocommerce' ), 
 'desc_tip'    => 'true',
 'description' => __( 'Enter the custom number here.', 'woocommerce' ),
 'value'       => get_post_meta( $variation->ID, '_number_field', true ),
 'custom_attributes' => array(
 'step'  => 'any',
 'min' => '0'
 ) 
 )
 );
 // Textarea
 woocommerce_wp_textarea_input( 
 array( 
 'id'          => '_textarea[' . $variation->ID . ']', 
 'label'       => __( 'My Textarea', 'woocommerce' ), 
 'placeholder' => '', 
 'description' => __( 'Enter the custom value here.', 'woocommerce' ),
 'value'       => get_post_meta( $variation->ID, '_textarea', true ),
 )
 );
 // Select
 woocommerce_wp_select( 
 array( 
 'id'          => '_select[' . $variation->ID . ']', 
 'label'       => __( 'My Select Field', 'woocommerce' ), 
 'description' => __( 'Choose a value.', 'woocommerce' ),
 'value'       => get_post_meta( $variation->ID, '_select', true ),
 'options' => array(
 'one'   => __( 'Option 1', 'woocommerce' ),
 'two'   => __( 'Option 2', 'woocommerce' ),
 'three' => __( 'Option 3', 'woocommerce' )
 )
 )
 );
 // Checkbox
 woocommerce_wp_checkbox( 
 array( 
 'id'            => '_checkbox[' . $variation->ID . ']', 
 'label'         => __('My Checkbox Field', 'woocommerce' ), 
 'description'   => __( 'Check me!', 'woocommerce' ),
 'value'         => get_post_meta( $variation->ID, '_checkbox', true ), 
 )
 );
 // Hidden field
 woocommerce_wp_hidden_input(
 array( 
 'id'    => '_hidden_field[' . $variation->ID . ']', 
 'value' => 'hidden_value'
 )
 );
}

// Save new fields for variations
function save_variation_settings_fields( $post_id ) {
 // Text Field
 $text_field = $_POST['_text_field'][ $post_id ];
 if( ! empty( $text_field ) ) {
 update_post_meta( $post_id, '_text_field', esc_attr( $text_field ) );
 }
 
 // Number Field
 $number_field = $_POST['_number_field'][ $post_id ];
 if( ! empty( $number_field ) ) {
 update_post_meta( $post_id, '_number_field', esc_attr( $number_field ) );
 }
 // Textarea
 $textarea = $_POST['_textarea'][ $post_id ];
 if( ! empty( $textarea ) ) {
 update_post_meta( $post_id, '_textarea', esc_attr( $textarea ) );
 }
 
 // Select
 $select = $_POST['_select'][ $post_id ];
 if( ! empty( $select ) ) {
 update_post_meta( $post_id, '_select', esc_attr( $select ) );
 }
 
 // Checkbox
 $checkbox = isset( $_POST['_checkbox'][ $post_id ] ) ? 'yes' : 'no';
 update_post_meta( $post_id, '_checkbox', $checkbox );
 
 // Hidden field
 $hidden = $_POST['_hidden_field'][ $post_id ];
 if( ! empty( $hidden ) ) {
 update_post_meta( $post_id, '_hidden_field', esc_attr( $hidden ) );
 }
}

Вывод поля во фронтенде

Добавляем значение поля в массив вариации:

// Add New Variation Settings
add_filter( 'woocommerce_available_variation', 'load_variation_settings_fields' );

//Add custom fields for variations
function load_variation_settings_fields( $variations ) {
 
 // duplicate the line for each field
 $variations['text_field'] = get_post_meta( $variations[ 'variation_id' ], '_text_field', true );
 
 return $variations;
}

Изменяем шаблон вывода информации вариативного товара (woocommerce/single-product/add-to-cart/variation.php), добавив в него

<div class="woocommerce-variation-custom-text-field">
{{{ data.variation.text_field }}}
</div>

Теперь при выборе вариации значение поля будет выводиться там, где мы его установили.

Благодарность за решение Реми Корсон, ссылка на источник.

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

Пример: цена за кг

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

Делаем расчет и создаем новые данные для вывода в вариации (проверяем чтобы поля цена и вес были заполнены):

// Расчет и вывод цены за кг (для вариативных товаров)
add_filter( 'woocommerce_available_variation', 'bbloomer_add_custom_field_variation_data' );
function bbloomer_add_custom_field_variation_data( $variations ) {
	$product = wc_get_product($variations['variation_id']);
	$price = $product->get_price();
	$weight = $product->get_weight();
	if ( !empty($price) && !empty($weight) ) {
		$price_per_weight = round ($price / $weight);
		$variations['price_per_weight'] = '<strong>'.$price_per_weight.'</strong> руб. за кг';
	}
	return $variations;
}

Добавляем в шаблон woocommerce/single-product/add-to-cart/variation.php вывод новых данных:

<div class="woocommerce-variation-price_per_weight">
{{{ data.variation.price_per_weight}}}
</div>

Вывод цены за кг для простого товара:

// Расчет и вывод цены за кг (для простых товаров)

function add_price_by_wheight() { 
	global $product; 
	$price = $product->get_price();
	$weight = $product->get_weight();
	if ( !empty($price) && !empty($weight) ) {
		$price_per_weight = round ($price / $weight);
		echo '<strong>'.$price_per_weight.'</strong> руб. за кг';
	}	
} 

add_action( 'woocommerce_single_product_summary', 'add_price_by_wheight', 12 );

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

  • Похожие записи
  • Комментарии
  • Вложения
Акция 20% на каждый второй и 30% на каждый 3 товар

Акция 20% на каждый второй и 30% на каждый 3 товар

Немного измененный и доработанный вариант акции (20% на 3 товар, 30% на 4 товар). В данном случае немного изменен принцип применения акции. Если в предыдущем примере акция применялась буквально к Читать далее »

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

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

Настройка доставки в woocommerce 2.6 кардинальным образом изменилась. Стала более гибкой, но и более сложной в настройке. Разберемся в тонкостях настройки доставки. Зоны доставки Зоны доставки — это определенная территория Читать далее »

/
Доработка функционала Woocommerce

Доработка функционала Woocommerce

Продолжаем дорабатывать различные аспекты модуля Woocommerce. Общий вес заказа Чтобы выводить общий вес заказа, нужно в шаблонах cart-totals.php (в корзине) и/или review-order.php (в заказе) добавить следующий код (перед закрывающим тегом Читать далее »

/ /

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

Пока нет комментариев. Будь первым!

Поле для вариативного товара
Импорт товаров из YML-файла
Рекомендации для васИмпорт товаров из YML-файлаOpttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.