X
  • Дизайн та розробка сайту
  • Дизайн і створення сайтів. Розробка тем для WordPress. Створення Landing Page.
  • office@gnatkovsky.com.ua
  • @vgnat
  • Написати мені
Замовити послугу

Как вывести цену товара WooCommerce в любом месте

Приклад
  • 2024-04-25
  • 7279 переглядів

  • Дизайн та розробка сайту

Доброго времени суток

Представляю вам очередную небольшую статью по WooCommerce. В ней расскажу как вывести цену товара в произвольном месте. Например, если вам нужно дублировать цену, перенести или вы выполняете какие-то дополнительные действия с ценой. Данная статья будет полезна тем, кто занимается глубокой доработкой WooCommerce, созданием тем под WooCommerce и тд.

Как вывести цену товара WooCommerce в любом месте

Чтобы просто вывести цену текущего товара, нужно внутри его цикла просто добавить небольшой код. Для этого нужный файл Где у вашей темы выводится товар. Название файла зависит от вашей темы. Поэтому точно сказать не могу, если вы занимаетесь разработкой своей темы, то должны знать. Возможно у вас вообще отдельная функция, которая выводит содержание карточки товара.

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

В общим в нужном вам вам месте, для вывода цены товара нужно добавить вот такой код PHP:

echo get_post_meta( get_the_ID(), '_price', true); 

Как видите, мы просто вывели произвольное поле _price с помощью get_post_meta(). WooCommerce использует это поле для базовой цены. Это работает только в случаи, если у вас цена без скидки, но как вывести старую цену и новую с учетом скидки?

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

$price = get_post_meta( get_the_ID(), '_regular_price', true);
$sale = get_post_meta( get_the_ID(), '_price', true);
if (!empty($sale)){
  echo $sale;
} else {
  echo $price;
}

Тут как и в предыдущем ничего сложного. Задаем две переменные с произвольными полями. WooCommerce использует эти поля для базовой цены, как писал ранее и новой с учетом акции. Далее, просто, делаем проверку есть ли цена со скидкой, если есть - выводим ее, нет - выводим базовую.

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

<div class="totalprice">
<div class="totalamount"><?php
  $price = get_post_meta( get_the_ID(), '_regular_price', true);
  $sale = get_post_meta( get_the_ID(), '_price', true);
 
  if (!empty($sale)){
    echo $sale;
  } else {
    echo $price;
  }
  ?></div>
  <div class="currentprice" style="display:none;">
  <?php 
  if (!empty($sale)){
    echo $sale;
  } else {
    echo $price;
  } 
  ?></div>
</div>

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

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

<script>	
jQuery(document).ready(function($){
$(".qty").click(function () {
    var calc = $(this);
    var calcText = calc.val();
    var price = $('.currentprice');
    var priceText = price.text();
    var totalAmount = $('.totalamount');
    var n = priceText * calcText;
    totalAmount.text( n );
});
});	
</script>	

Скрипт простой. При нажатии на числовое поле - задаем переменную в которое помещаем наше поле, вторую переменную - текущее значение поля, третью переменную - блок с ценой за единицу товара, четвертая - текст, то бишь текущая цена, пятая - блок с общей ценой и последняя переменная - умножаем значение поля(количество) на цену за единицу. В конце, просто меняем в блоке с общей ценой значение на новое, что получилось после умножения.

Данный скрипт рассчитан на стандартное числовое поле ввода WooCommerce, что задает количество в карточке товара. Если у вас какое-то другое поле или модифицированное, то скрипт придется немного изменить под себя. Тут зависит от конкретного случая, поэтому подсказать не могу.

На этом все, спасибо за внимание. 🙂

Якщо Вам була корисна моя праця, можете фінансово підтримати сайт або відключити блокувальник реклами, що займе 2 хвилини :)

Хочу підтримати фінансово Хочу відключити блокувальник

Оцініть статтю
  1. 5
  2. 4
  3. 3
  4. 2
  5. 1
Проголосовало: 4, в среднем: 2.8 из 5
Читайте також