В этой статье речь пойдет про настройку кнопки Купить в зависимости от наличия товара и ряда других условий.
Скрыть кнопку Купить у товаров, которых нет в наличии
Если товара нет в наличии, то вместо кнопки Купить можно показать кнопку Уведомить меня. Пользователь сможет оставить свои данные и при поступлении товара ему придет письмо. Подробнее можно прочитать в этой статье.
Если нужно просто скрыть кнопку Купить без показа Уведомить меня, то в файле /components/com_virtuemart/sublayouts/addtocart.php замените
|
1 |
if (!VmConfig::get('use_as_catalog', 0) ) |
на
|
1 |
if (!VmConfig::get('use_as_catalog', 0) && (($product->product_in_stock - $product->product_ordered) > 0) ) |
Чтобы эти изменения сохранились при обновлении virtuemart необходимо переопределить файл в папке /components/com_virtuemart/sublayouts/.
Аналогичным образом нужно переопределить и все остальные файлы, о которых пойдет речь далее, подробнее в этой статье (раздел Обновление virtuemart).
Ограничить количество товаров для покупки
При создании товара можно задать минимальное/максимальное количество, доступное для заказа.
Эти настройки зададут min/max ограничения для поля выбора количества, но при повторном заказе сверх лимита никакого уведомления не последует и покажется просто пустое окно.
Это можно ввести покупателя в заблуждение, поэтому было бы хорошо заранее проинформировать о максимальном количестве, доступном для заказа. Для этого в файле /components/com_virtuemart/sublayouts/addtocart.php после
|
1 |
echo shopFunctionsF::renderVmSubLayout('addtocartbar',array('product'=>$product)); |
добавьте
|
1 2 3 |
if($product->max_order_level) { echo '<div class="max-order-block">Доступно для заказа: <strong>'.$product->max_order_level.'</strong></div>'; } |
В итоге получится примерно следующее.
Для вывода информации во всплывающем окне в файле /components/com_virtuemart/views/cart/tmpl/padded.php перед
|
1 |
if(!empty($product->errorMsg)){ |
добавьте
|
1 |
echo '<p>В корзине находится максимальное количество для этого товара.</p>'; |
Добавление только одной единицы товара
Рассмотрим случай когда в корзину может быть добавлена только одна единица каждого товара и у товаров, уже добавленных в корзину, вместо кнопки Купить должна показываться кнопка перехода в корзину.
В файле /components/com_virtuemart/sublayouts/addtocart.php заменим
|
1 |
echo shopFunctionsF::renderVmSubLayout('addtocartbar',array('product'=>$product)); |
на
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
// получаем товары в корзине if(!class_exists('VirtueMartCart')) require(VMPATH_SITE.DS.'helpers'.DS.'cart.php'); $cart = VirtueMartCart::getCart(false); $product_in_cart = false; foreach($cart->cartProductsData as $cart_product){ if($cart_product['virtuemart_product_id'] == $product->virtuemart_product_id){ // если товар в корзине, то показываем ссылку на корзину echo '<a class="product-in-cart" rel="nofollow" href="'.JRoute::_('index.php?option=com_virtuemart&view=cart', FALSE).'">'.JText::_('COM_VIRTUEMART_PRODUCT_IN_CART').'</a>'; $product_in_cart = true; break; } } if(!$product_in_cart){ // если товара нет в корзине, то выводим стандартную кнопку Купить echo shopFunctionsF::renderVmSubLayout('addtocartbar',array('product'=>$product)); } |
В Расширения > Менеджер языков > Переопределение констант создадим новую языковую константу
|
1 |
COM_VIRTUEMART_PRODUCT_IN_CART = "В корзину" |
Теперь если товар в корзине, то у него вместо кнопки Купить будет показа ссылка на корзину.
Чтобы при клике на кнопку Купить она автоматически менялась необходимо отключить показ всплывающего окна и добавить небольшой скрипт.
Для отключения всплывающего окна в файле /сomponents/com_virtuemart/assets/js/vmprices.js закомментируйте
|
1 2 3 |
if(usefancy){ jQuery.fancybox.showActivity(); } |
и закомментируйте
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
if(usefancy){ jQuery.fancybox({ "titlePosition" : "inside", "transitionIn" : "fade", "transitionOut" : "fade", "changeFade" : "fast", "type" : "html", "autoCenter" : true, "closeBtn" : false, "closeClick" : false, "content" : txt } ); } else { jQuery.facebox( txt , 'my-groovy-style'); } |
Чтобы кнопка Купить автоматически менялась на все страницы сайта добавьте скрипт
|
1 2 3 4 5 6 7 8 9 10 |
<script> jQuery(document).ready(function($) { $('input[name="addtocart"]').click(function() { $(this).addClass('loading'); setTimeout(function(){ jQuery('input.loading').replaceWith('<a class="product-in-cart" href="/cart">В корзину</a>'); }, 2000); }); }); </script> |
С помощью скрипта кнопке на 2 сек. присваивается класс loading, который можно использовать для добавления анимации, имитирующей загрузку.
Финальный этап - добавление стилей. Ниже только самые необходимые стили. Вид кнопки Товар в корзине можно настроить с помощью класса product-in-cart.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
/* скрытие окна с выбором количества */ .addtocart-bar .quantity-controls, .addtocart-bar input.quantity-input{ display: none; } /* анимация на кнопке */ span.addtocart-button input.addtocart-button.loading{ text-indent: -999px; width: 119px; background-image: url(/images/loading.svg); background-position: center center; background-repeat: no-repeat; } |
Для анимации использовалась эта картинка.
Изменение цвета кнопки Купить, у товаров, которые добавлены в корзину
Если нужно просто изменить цвет кнопки Купить у товаров, которые уже в корзине, то можно это можно сделать проще. Достаточно в файле /components/com_virtuemart/sublayouts/addtocart.php после
|
1 |
$product = $viewData['product']; |
добавить
|
1 2 3 4 5 6 7 8 9 |
if(!class_exists('VirtueMartCart')) require(JPATH_VM_SITE.DS.'helpers'.DS.'cart.php'); $cartProducts = VirtueMartCart::getCart(false)->cartProductsData; $cartProductsIds = array_map(function($product) { return $product['virtuemart_product_id']; }, $cartProducts); $class = (in_array($product->virtuemart_product_id, $cartProductsIds)) ? 'in-cart' : ''; |
и там же заменить
|
1 |
<div class="addtocart-area"> |
на
|
1 |
<div class="addtocart-area <?php echo $class; ?>"> |
После этого у товаров в корзине у блока с кнопкой Купить появится дополнительный класс in-cart, который можно использовать для стилизации.
Надеюсь, что статья была полезна и пригодится в вашей работе.
Все скриншоты сделаны в шаблоне NanoShop.
7Hogik
Спасибо за статью. Недавно ознакомился с виджетами тк (ПЕК и СДЕК) на сайтах компании для их добавления на сайт. Планируете ли Вы написать статью о их внедрении в Ваш шаблон?
admin
Рад, что статья оказалась полезной. По СДЕК не планировал пока писать статьи.
Messir
Небольшое уточнение, ибо сам недавно сломал голову, почему товар вроде есть, а кнопки "купить" нету)))) Код:
лучше писать как:
ибо базовая интерпретация подразумевает определение "количество товара на складе минус количество заказанных", другими словами, если было куплено десять единиц этого товара, а вы (при нулевом остатке) добавили пять единиц, то кнопки "купить" все равно не будет. Столкнулся с этим еще на ВМ2.
admin
Спасибо за дополнение.
Алексей
Может подскажите как допилить?
Есть несколько производителей, хотелось бы сделать следующее -
при попытке положить в корзину товар от разных производителей появлялось бы сообщение что покупатель пытается выбрать товар от от другого производителя и если он согласен то можно продолжить покупку товара от др производителя.
admin
Нужно перехватывать событие добавление товара в корзину и сравнивать текущий товар со всеми товарами в корзине.
Получить список товаров в корзине можно с помощью кода
Детальнее не смогу ответить, нужно разбираться.