/ Плагины / Апселлы и кросселы

Апселлы и кросселы

HIT

06.12.2016

10381

12

У Woocommerce есть функционал Апселлы (аналоги) и Кросселы (сопутствующие).

upsell_cross-sell_blog1-1

Апселлы

Апселлы — лучшие товары которые вы бы рекомендовали в замен данному. К примеру, товары которые лучше по качеству или каким-то другим характеристикам, допустим более высокой ценой.

Выводятся под табами (вкладками) товара с заголовком Вам также может понравиться…, но можно быстро вывести их в отдельную вкладку.

Кросселы

Кросселы — Кросс-продажи — это сопутствующие для данного товары.

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

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

Данный вывод в корзине не всегда удобен. Сделаем чтобы кросселы выводились в карточке товара.

Удалить сопутствующие товары из шаблона корзины:

// Удаляем сопутствующие товары из корзины
remove_action( 'woocommerce_cart_collaterals', 'woocommerce_cross_sell_display');

Выводим сопутствующие в корзине, но не там где они выводятся по умолчанию, а ниже списка товаров корзины

add_action( 'woocommerce_after_cart_table', 'woocommerce_cross_sell_display' );

Изменяем количество колонок верстки (не использую в своих шаблонах, а зря) и количество выводимых товаров:

add_filter( 'woocommerce_cross_sells_columns', 'bbloomer_change_cross_sells_columns' );
function bbloomer_change_cross_sells_columns( $columns ) { return 4; }

add_filter( 'woocommerce_cross_sells_total', 'bbloomer_change_cross_sells_product_no' );
function bbloomer_change_cross_sells_product_no( $columns ) { return 4; }

Кросселы в шаблоне товара

В необходимом месте шаблона карточки товара вставляем код:

<?php $crosssell_ids = get_post_meta( get_the_ID(), '_crosssell_ids' );

if( !empty ($crosssell_ids) ){

	$crosssell_ids = $crosssell_ids[0];

	if(count($crosssell_ids)>0){

		$args = array(
			'post_type' => 'product',
			'ignore_sticky_posts' => 1,
			'no_found_rows' => 1,
			'posts_per_page' => apply_filters( 'woocommerce_cross_sells_total', $posts_per_page ),
			'orderby' => $orderby,
			'post__in' => $crosssell_ids
		);

		$products = new WP_Query( $args );

		$woocommerce_loop['columns'] = apply_filters( 'woocommerce_cross_sells_columns', $columns );

		if ( $products->have_posts() ) : ?>

			<div class="cross-sells">

			<h2><?php _e( 'You may be interested in…', 'woocommerce' ) ?></h2>

			<?php woocommerce_product_loop_start(); ?>

			<?php while ( $products->have_posts() ) : $products->the_post(); ?>

			<?php wc_get_template_part( 'content', 'product' ); ?>

			<?php endwhile; // end of the loop. ?>

			<?php woocommerce_product_loop_end(); ?>

			</div>

		<?php endif;

	}

	wp_reset_query();

} ?>

Чтобы сопутствующие товары выводились в случайном порядке — надо заменить значение

‘orderby’ => $orderby, на ‘orderby’ => ‘rand’,

Чтобы создать эффект динамики сопутствующих товаров, можно сделать следующее: поставить лимит вывода товаров (5 шт), задать больше 5 шт сопутствующих товаров (10 шт) и включить случайный порядок (rand). При перезагрузке страницы сопутствующие товары и их расположение будет меняться!

Вывод сопутствующие товаров внизу (после всех табов) функцией:

// Сопутствующие товары в карточке
function woocommerce_cross_sells_products() {
	$crosssell_ids = get_post_meta( get_the_ID(), '_crosssell_ids' );
	
	if( !empty ($crosssell_ids) ){

	$crosssell_ids = $crosssell_ids[0];

	if(count($crosssell_ids)>0){
		$args = array(
			'post_type' => 'product',
			'ignore_sticky_posts' => 1,
			'no_found_rows' => 1,
			'posts_per_page' => apply_filters( 'woocommerce_cross_sells_total', $posts_per_page ),
			'orderby' => $orderby,
			'post__in' => $crosssell_ids
		);
		$products = new WP_Query( $args );
		$woocommerce_loop['columns'] = apply_filters( 'woocommerce_cross_sells_columns', $columns );

		if ( $products->have_posts() ) : ?>
			<div class="cross-sells">
			<h2>С этим товаром покупают</h2>
			<?php woocommerce_product_loop_start(); ?>
			<?php while ( $products->have_posts() ) : $products->the_post(); ?>
$crosssell_ids = $crosssell_ids[0];				<?php wc_get_template_part( 'content', 'product' ); ?>
			<?php endwhile; ?>
			<?php woocommerce_product_loop_end(); ?>
			</div>
		<?php endif;
	}

	wp_reset_query();

	}
}

add_action( 'the_woocommerce_after_content_product', 'woocommerce_cross_sells_products', 15 );

Изменяем количество сопутствующих товаров

// Изменяем количество выводимых сопутствующих товаров
add_filter( 'woocommerce_cross_sells_total', 'bbloomer_change_cross_sells_product_no' );
  
function bbloomer_change_cross_sells_product_no( $columns ) {
return 2;
}

Также можно изменить количество колонок сопутствующих товаров, еще одной функцией:

// Изменяем количество сопутствующих товаров в ряду
add_filter( 'woocommerce_cross_sells_columns', 'change_cross_sells_columns' );
 
function change_cross_sells_columns( $columns ) {
return 5;
}

Можно объединить эти две функции так:

// Изменяем количество сопутствующих товаров (и в ряду)
add_filter( 'woocommerce_cross_sells_columns', 'change_cross_sells_columns' );
add_filter( 'woocommerce_cross_sells_total', 'change_cross_sells_columns' );
 
function change_cross_sells_columns( $columns ) {
return 4;
}

Как быстро заполнить сопутствующие товары — читайте статью Массовое редактирование свойств товаров.

Еще одна функция изменения количества и колонок:

add_filter( 'woocommerce_upsell_display_args', 'wc_change_number_related_products', 20 );
function wc_change_number_related_products( $args ) {
	$args['posts_per_page'] = 4;
	$args['columns'] = 4;
	return $args;
}

Похожие и сопутствующие товары в виде карусели

Плагин Carousel Upsells and Related Product for Woocommerce добавляет к похожим и сопутствующим товарам функционал карусели.

Плагин довольно прост, настроек не много, в основном настройки самой карусели.

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

  • Похожие записи
  • Комментарии
  • Вложения
Отключаем лишний функционал Woocommerce

Отключаем лишний функционал Woocommerce

Отключаем невостребованные функции Woocommerce, чтобы было легче работать, не захламлять админку и не путать заказчиков. Отключить типы товаров Удалить чекбоксы виртуальный и загружаемый товары Удалить их также из фильтра админки: Читать далее »

Настройка полей заказчика

Настройка полей заказчика

При заказе товара необходимо заполнить данные покупателя (имя, телефон, адрес доставки и т.д.). В стандартном варианте поля эти несколько «раздуты», много лишнего, требуется некоторое оформление. Можно использовать плагин Saphali Woocommerce Читать далее »

/
Категория товаров NEW

Категория товаров NEW

Если у нас большой интернет-магазин с множеством подкатегорий, и периодически появляются новые, то дополнительное внимание к этому можно привлечь лэйблом NEW. По дате мы этот функционал реализовать не сможем т.к. Читать далее »

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

12 комментариев

  1. Артем

    // Удаляем сопутствующие товары из корзины
    remove_action( ‘woocommerce_cart_collaterals’, ‘woocommerce_cross_sell_display’);
    куда и в каком виде вставлять?
    в файл cart.php сюда? вместо этого или как?
    <div class=»cart-collaterals»>
    <?php do_action( ‘woocommerce_cart_collaterals’ ); ?>    
    </div>

    1. Alexandr

      remove_action нужно вставлять в functions.php

  2. Александр

    Огромное вам спасибо! 

  3. Nick

    Спасибо, было полезно

  4. Леонид

    Здравствуйте!
    Классное решение!
    Но как быть, если не добавлять к товару сопутствующие товары, то он выводит ошибку?Warning: count(): Parameter must be an array or an object that implements Countable in D:\OSPanel\domains\localhost\zabori\wp-content\themes\zabori\woocommerce\single-product.php on line 106

  5. Денис

    Доброго времени суток. Возникла необходимость написать плагин для аплейслов и рекомендуемых товаров, чтобы без всяких пробем поставил и забыл… Вот сам плагин https://wordpress.org/plugins/carousel-upsells-and-related-product-for-woocommerce/ . Плагин переделаыает стандартные апсейсы и прохожие пролкы в виде карусели. Вы можете выставить определенные настройки уситывая ваш дизайн сайта. Карточки товара подхватываются именно из дизайна ваших товаров. Важно учесть, что это первая перся плагина, я его планирую развивать и учлу ве пошелания и предложениея. 
     
    Основным преимуществом данного плагаина является то, что он не имеет зависимости от jquery, работает начистом javasceritp cо всеми возможностями тач свайпа(паеретаскивание пальцем). Это значит, что он значительно быстрее чем его аналги. В ближайгее время появится куча настроек, я надесю вы меня поддержите, делаю для людей. 

    1. Alexandr

      Обязательно заценю. Напишу отзыв. Если плагин окажется толковый буду внедрять в проекты. Единственно должен сказать, что заказчики не часто обращают внимание на данный функционал. Но при должной настройке — он может стать отличным инструментом маркетинга.

  6. Dan Zakirov

    Приветы, где обещанный отзыв) В общем основные простенькие настройки напилил, осталась проблемка — некоторые темы, особенно премиум класса, внедряют свои кастомные похожие или апсейлы — эту проблему пока не понимаю как решить, поэтому сделал финт ушами — возможность отключения. Как правило кастомы делают на что то одно, или на похожие или на апсейлы. Ну что тут говорить, надо просто покатать плагин. Сейчас практически на всех популярных темах он работает стабильно. Кстати, я подробный пост написал про него на этом сайте — https://n-wp.ru/kak-ustanovit-karusel-tovarov-woocommerce-dlya-rekomenduemyx-i-poxozhix-tovarov/

    1. Alexandr

      Написал краткий обзор. Особо писать нечего — функционал плагина прост. Похожие товары у меня работают отлично. По поводу сопутствующих — в своем шаблоне видимо я изменил вывод и поэтому плагин на них не влияет..

  7. Dan Zakirov

    Alexandr, скоро апдейт будет, а вот по кастомным апсейлам или похожим не могу решение найти, у тех у кого кастомы стоят не пашет.
    ———-
    1. Точно будет Центр-мод, это когда по краям каруселька обрезается, на яндексе такая стоит
    2. Будут добавлены настройки по управлению навигацией
    3. Подсказка на мобильном устройстве – не все понимают что можно прокручивать пальцем
    4. Продолжительность анимации в миллисекундах.
    5. Соотношение альтернативного расстояния перемещения слайдов при смахивании и перетаскивании. В общем это такая штука, когда вы пальцем зацепили слайд и перетаскиваете, так вот тут будет управление именно скорости перемещения. Пока думаю стоит ли вводить такую настройку
    6. Минимальное расстояние, необходимое для смены слайда.
    7. Размер зазора между слайдами в пикселях…

  8. Dan Zakirov

    Плагин довольно прост — теперь не прост) Alexandr, Обновитесь и посмотрите скрины в репозитории.

  9. Виталий

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

Апселлы и кросселы Апселлы и кросселы
Платежная система PayKeeper
Рекомендации для васПлатежная система PayKeeperOpttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.