Указываем процент скидки или сэкономленную сумму для товаров на распродаже

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

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

Также рекомендую вам свой видеокурс по созданию темы WooCommerce на основе готовой HTML-вёрстки.

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

сэкономленная сумма в процентах при покупке товара в интернет-магазине на WooCommerce

И вот так для страницы каталога и категорий товаров:

отображаем экономию в процентах рядом с ценой товара в WooCommerce
add_filter( 'woocommerce_format_sale_price', 'truemisha_discount_percentage', 10, 3 );
 
function truemisha_discount_percentage( $price, $regular_price, $sale_price ) {
 
	// вычисляем процент скидки
	$percentage = round( ( $regular_price - $sale_price ) / $regular_price * 100 ).'%';
 
	// сообщение об экономии, можете стилизовать его при помощи CSS
	$percentage_message = '<span style="color: #ff7070;">Экономия ' . $percentage . '!</span>';
 
	// отображение цены в новом формате
	$price = '<del>' . wc_price( $regular_price ) . '</del> <ins>' . wc_price( $sale_price ) . $percentage_message . '</ins>';
 
	// возвращаем результат
	return $price;
 
}

Пара моментов по коду:

  • Прежде всего, если не знаете, куда его вставлять, то читайте этот урок.
  • Функция wc_price() позволяет отформатировать числовое значение цены, добавляя разделители тысяч и знак валюты.

Кстати, если вы хотите отображать количество сэкономленных денег не в процентах, то достаточно поменять эти строчки:

// вычисляем сколько сэкономится
$discount_amount = $regular_price - $sale_price;
 
// оборачиваем в функцию wc_price()
$percentage_message = '<span style="color: #ff7070;">Экономия ' . wc_price( $discount_amount ) . '!</span>';

И тогда:

сообщение с сэкономленной суммой на странице товара

Миша

Недавно я осознал, что моя миссия – способствовать распространению WordPress. Ведь WordPress – это лучший движок для разработки сайтов – как для тех, кто готов использовать заложенную структуру этой CMS, так и для тех, кто предпочитает headless решения.

Сам же я впервые познакомился с WordPress в 2009 году. Организатор WordCamp. Преподаватель в школах Epic Skills и LoftSchool.

Если вам нужна помощь с вашим сайтом или может даже разработка с нуля на WordPress / WooCommerce — пишите. Я и моя команда сделаем вам всё на лучшем уровне.

Комментарии — 2

Комментирование этого поста более не доступно.