Опубликовано в: Доработка Virtuemart
07 мая 2011


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

Данная модификация была разработана мной для одного из сайтов. Довольно часто возникает необходимость использовать свойства товара. Например мы продаём автомобиль Opel, который стоит 50000 евро. Такой же автомобиль красного цвета стоит 60000 евро, к примеру. Когда клиент выбирает из списка свойств нужный ему товар или опцию, то на странице он видит не начальную стоимость товара, а стоимость с учётом его опции.

Но, расскажу более подробно...

Когда мы вносим информацию о товаре, мы можем назначить для него определённые свойства. Рассмотрим на примере "чистого" Virtuemart с установленными демоданными.

У нас есть товар, который называется "Hammer", на самом деле - это молоток :)

Перейдём во вкладку "Статус товара" и назначим ему дополнительные свойства. Я, например, задал размеры - простой, большой, очень большой и наигромаднейший. Для простого молотка стоимость равна стоимости товара по умолчанию. Большой молоток будет стоить 10 зелёных рублей, очень большой - 15 и наигромаднейший - 20 зелёных рубликов. Почему в долларах? Лень было менять настройки Virta :)

Изменение цены товара - Virtuemart

Нажимаем кнопку применить и видим, что на странице товара появилась возможность выбрать свойства товара. Например выберем большой молоток. Мы увидим, что в выпадающем списке указана его цена ($10.98), но стоимость товара на странице осталась неизменной.

Изменение цены товара - Virtuemart

Довольно часто подобная ерунда приводит покупателей в замешательство. Цену видят одну, а в корзину добавляется совсем другая. Чтобы этого избежать, я решил сделать так, чтобы цена динамически изменялась в зависисмости от выбранной опции (свойства).

Скачками кинулся рыть интернет и нифига не нашёл. Готовых решений нет. У буржуев есть вариант, но стоит 25 баксов. В силу своего патриотизма и жадности этот вариант был отброшен сразу. У украинского разработчика мелькнул вариант коряво оформленного неработающего кода. Ну и на Joomla форуме есть кое-какая инфа, но тоже, по большому счёту состоящая из вопросов и невнятных ответов.

Пришлось "убить" лень и делать самому. Делать будем используя библиотеку jQuery, поэтому для начала её нужно подключить.

 

Шаг 1. Подключение jQuery

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

Открываем файл index.php шаблона. Он находится в папке /templates/имя вашего шаблона/index.php

Перед </head> добавляем код:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js "></script>
<script type="text/javascript">
    jQuery.noConflict();
</script>

На данном этапе мы подключили jQuery, а также добавили noConflict, дабы избежать проблем с mootools Joomla. Кстати, перед подключением jQuery проверьте, не подключена ли это библиотека вами ранее. Возможно у вас стоит какое-либо дополнение/плагин, который уже подключил данную библиотеку.

 

Шаг 2. Правка файла price.tpl.php

Открываем файл /components/com_virtuemart/themes/default/templates/common/price.tpl.php

В районе 23-24 строки ищем код:

<?php
if( !empty( $price_info["product_price_id"] )) { ?>

После него нужно добавить следующий код:

<script type="text/javascript">
 jQuery(function() {
 jQuery('option').click(function() {
 if(jQuery(this).attr("title") != '') {
 jQuery('span.productPrice').replaceWith('<span class="productPrice">' + jQuery(this).attr("title") + '</span>');
 }
 else {
 jQuery('span.productPrice').replaceWith('<span class="productPrice"><?php echo $CURRENCY_DISPLAY->getFullValue($base_price) ?></span>');
 }
 return false;
 });
 });
</script>

На данном этапе мы добавляем скрипт, который и будет динамически менять цену.


Шаг 3. Правим файл addtocart_advanced_attribute.tpl.php

Открываем файл /components/com_virtuemart/themes/default/templates/product_details/includes/addtocart_advanced_attribute.tpl.php

В районе 12 строки ищем код

<option value=""><?php echo $options_item['base_value'] ?> (<?php echo $options_item['sign'].$options_item['display_price'] ?>)</option>

Заменяем его на:

<option title="" value=""><?php echo $options_item['base_value'] ?> (<?php echo $options_item['sign'].$options_item['display_price'] ?>)</option>

Тестирование:

Тестирование проводилось на Joomla 1.5.23 и Virtuemart 1.4-1.8. Полёт нормальный.

Недостатки:

При использовании данного метода, можно указывать только явную стоимость в свойствах товара. Т.е. цена должна быть указана так: =10 , нельзя прибавлять или удалять стоимость. Т.е. нельзя в стоимости указать +10 или -10.

Также не происходит перерасчёта стоимости в случае увеличения количества товаров. Данные моменты будут дорабатываться по мере необходимости.

Если у кого-то возникнут идеи, появятся предложения по улучшению или доработке кода - буду только рад. С удовольствием внесу изменения с указанием вашего авторства.

 

Вы можете отблагодарить автора:

WMR - R166832041362

WMZ - Z314865156270

QIWI - 9638061071

Яндекс деньги - 41001228750313


Комментарии 
 
#24 Данил 17.12.2011 18:44
Здравствуйте. Случайно наткнулся на статью, до этого действительно попадался только платный вариант, Подскажите насколько хорошо оно работает?
Цитировать
 
 
#23 Skylucky 22.11.2011 19:10
()

У себя такого именно кода не нашел в файле addtocart_advan ced_attribute.tpl.php
И соответственно как результат - не получается изменять цену динамически
Цитировать
 
 
#22 Вадим 21.11.2011 15:36
Поправочка по коду - title остается пустым, пока не прописать так:
title="$options_item['display_price'] ?>"
а еще value - не пустое, а равно
Цитата:
value=""
Цитировать
 
 
#21 Вадим 21.11.2011 15:34
Поправочка по коду - title остается пустым, пока не прописать так:
"> ()
а еще value - не пустое, а равно
Цитировать
 
 
#20 DimonMa 08.11.2011 12:23
Даже чуть по другому надо, нашел один бок, если на странице несколько селектов встречается, надо явно в скрипте указать, на какое селект ориентироваться , переделал немного код скрипта

jQuery(document ).ready(function( ){
jQuery("#Razmer").change(function () {
jQuery('span.productPrice').replaceWith('' +jQuery("#Razmer :selected").attr("title") + '');
})
.change();

});



Цитирую DidGo:
Отлично, DimonMa, спасибо.

Обязательно обновлю инструкцию!
Цитировать
 
 
#19 DidGo 08.11.2011 12:12
Отлично, DimonMa, спасибо.

Обязательно обновлю инструкцию!
Цитировать
 
 
#18 DimonMa 08.11.2011 12:11
html код вставлять не получаеться, если есть вопросы пишите ICQ 128178 ноль ноль 6
Цитировать
 
 
#17 DimonMa 08.11.2011 12:09
Точнее так :)
Цитировать
 
 
#16 DimonMa 08.11.2011 12:08
я сделал так
Цитировать
 
 
#15 4ort 07.11.2011 13:29
Цитирую DimonMa:
Сделал в IE и Chome работает, изменил скрипт

jQuery(document ).ready(function( ){
jQuery("select").change(function () {
jQuery('span.productPrice').replaceWith('' +jQuery("#Razmer :selected").attr("title") + '');
})
.change();
});


В файле addtocart_advan ced_attribute.tpl.php, добавил ID селекту


DimonMa, можешь поподробнее описать? В селекте ведь есть свой id="_field" получается, ты его поменял на id="Razmer"? Это на работоспособнос ть никак не повлияет?
Цитировать