/ Сайтостроение / Плагины / Вариативный товар

Вариативный товар

HIT

11.11.2016

1085

Вариативный товар — один из типов товаров плагина интернет-магазина Woocommerce. Суть вариативного товара в том, что мы создаем несколько вариантов исполнения одного товара (размер, цвет, емкость и т.д.), и в зависимости от варианта исполнения у товара может меняться стоимость.

Вариативный товар. Основы

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

Если использовать для вариаций несколько наборов атрибутов, то при создании вариации их можно комбинировать. Причем если выбрать первую вариацию, то она отключить последующие вариации которые с ней не комбинируются.

Шаблон выбора

Шаблон выбора вариаций редактируется файлом woocommerce/single-product/add-to-cart/variable.php.

Лично мне не удобно то что он сверстан таблицей, альтернативная верстка:

<div class="variations"><!-- <div class="variations"><!-- <?php foreach ( $attributes as $attribute_name => $options ) : ?> --><div class="label"> <label for="<?php echo sanitize_title( $attribute_name ); ?>"><?php echo wc_attribute_label( $attribute_name ); ?></label> <?php echo end( $attribute_keys ) === $attribute_name ? apply_filters( 'woocommerce_reset_variations_link', '<a class="reset_variations" href="#">' . esc_html__( 'Clear', 'woocommerce' ) . '</a>' ) : ''; ?> </div><!-- --><div class="value"> <?php $selected = isset( $_REQUEST[ 'attribute_' . sanitize_title( $attribute_name ) ] ) ? wc_clean( stripslashes( urldecode( $_REQUEST[ 'attribute_' . sanitize_title( $attribute_name ) ] ) ) ) : $product->get_variation_default_attribute( $attribute_name ); wc_dropdown_variation_attribute_options( array( 'options' => $options, 'attribute' => $attribute_name, 'product' => $product, 'selected' => $selected ) ); ?> </div><!-- <?php endforeach;?> --></div>

Стили:

/* Вариативный товар */
.variations {margin-bottom: 15px;}
.variations > div {display: inline-block; vertical-align: middle;}
.variations .label {width: 30%;}
.variations .value {width: 70%;}
.variations select {padding: 5px;}

Вариации в корзине

За вариации в корзине (после основного наименования) отвечает строка

echo WC()->cart->get_item_data( $cart_item );

Изображения вариаций

Каждой вариации можно задать одно уникальное изображение, т.е. оно будет появляется при выборе вариации, добавляясь перед общими изображениями.

Изменение свойств вариаций

Известная давняя проблема Woocommerce — архивность (создавать для вариации отдельный архив), сортировка и тип вариации задается только при ее создании. Позже этого изменить мы не можем.
Точнее можно конечно, но не через админку, а напрямую в базе данных — таблица wp_woocommerce_attribute_taxonomies.

Из коробки в WC есть 2 типа вариаций: выбор и текст (select, text). Отличаются они по сути только способ набирания атрибутов в админке. Чтобы расширить варианты (цвет, изображение и т.д.) выбора вариаций во фронтенде нужно расширить функционал одним из плагинов.

Самая низкая цена вариации

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

// Используем формат цены вариативного товара WC 2.0
add_filter( 'woocommerce_variable_sale_price_html', 'wc_wc20_variation_price_format', 10, 2 );
add_filter( 'woocommerce_variable_price_html', 'wc_wc20_variation_price_format', 10, 2 );

function wc_wc20_variation_price_format( $price, $product ) {
// Основная цена
$prices = array( $product->get_variation_price( 'min', true ), $product->get_variation_price( 'max', true ) );
$price = $prices[0] !== $prices[1] ? sprintf( __( '%1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );
// Цена со скидкой
$prices = array( $product->get_variation_regular_price( 'min', true ), $product->get_variation_regular_price( 'max', true ) );
sort( $prices );
$saleprice = $prices[0] !== $prices[1] ? sprintf( __( '%1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

if ( $price !== $saleprice ) {
$price = '<del>' . $saleprice . '</del> <ins>' . $price . '</ins>';
}
return $price;
}

Если мы хотим менять таким образом цену только в каталоге (т.к. в карточке удобнее когда показан диапазон цен), то оборачиваем часть функции в проверку:

if ( !is_product() ) {
	// Основная цена
	$prices = array( $product->get_variation_price( 'min', true ), $product->get_variation_price( 'max', true ) );
	$price = $prices[0] !== $prices[1] ? sprintf( __( '%1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );
	// Цена со скидкой
	$prices = array( $product->get_variation_regular_price( 'min', true ), $product->get_variation_regular_price( 'max', true ) );
	sort( $prices );
	$saleprice = $prices[0] !== $prices[1] ? sprintf( __( '%1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );
}

Изменение параметров всех вариаций товара

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

Тэги:

Поделится информацией с друзьями

  • Похожие записи
  • Комментарии
  • Вложения
Купить в 1 клик

Купить в 1 клик

Добавляем в интернет-магазин кнопку «Купить в 1 клик». Рассмотрим различные плагины по данному направлению. WooCommerce Direct Checkout Плагин с 20 000 скачиваниями, по сути только меняет назначение кнопки «В корзину», Читать далее »

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

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

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

Атрибуты товара WC

Атрибуты товара WC

В интернет-магазине Woocommerce есть функционал атрибутов. Атрибуты товара — это дополнительные поля для различных значений. Атрибуты бывают 2-х типов: текстовый (text) и с выбором значения (select). Архив значения атрибута Для Читать далее »

/

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

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

Вариативный товар Вариативный товар
Иконки svg
Рекомендации для васИконки svgOpttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.