Динамическая цена товара в OpenCart

 

banknote

 

Что это?

 

Очень часто, меня просят сделать динамическую цену на товар. Это означает, что когда пользователь выбирает те или иные опции к товару, его цена должна динамично изменяться, т.е. сразу. Например, мы выбираем опцию «Подсветка (+1500 руб)» и цена товара изменяется (стрелка 2).

 

dynamics_price_example

 

«OpenCart из коробки» это сделать не позволяет, новую цена товару (с учетом выбранных опций) вы увидите только в корзине. В интернете существует огромное количество платных и бесплатных модулей позволяющий сделать данный функционал.

Если вам нужна динамическая цена,

  • вам придется искать модули под вашу версию OpenCart
  • скорее, всего устанавливать vQmod , т.к. в последнее время модули его требуют
  • разбираться с настройками модуля.

А зачем? Если это можно сделать с помощью нескольких строчек кода на jQuery. Когда ваш проект «не горит», рекомендую работать «чистым лезвием», а не раздувать систему устанавливая модули на каждую мелочь.

 

 

Как это сделать?

 

Откроем шаблон представления «catalog\view\theme\default\template\product\product.tpl«, отвечающий за страницу с описанием товара.

 

Далее, найдите тег выводящий стоимость товара и пометьте его id=span.price-now, если вы используете в OpenCart акции и выводите стоимость до акции отдельным тегом, то пометьте его id=span.price-old (как в моем случаем). Таким образом, при выборе той или иной опции будет изменяться стоимость с акцией и без.

 

Если мы используем опции типа radio, select или image, т.е. те опции, где выбор осуществляется по принципу «выбирается один из множества».  

То поступаем следующим образом, отыскиваем в коде следующий IF

P.S. если вам нужен select или image, делайте все по аналогии, только вместо if с $option[‘type’] == ‘radio’ ищите if с $option[‘type’] == ‘selectили c ‘image’.

 

В нем находим тэг input

Добавляем в тэг input новый атрибут price. 

P.S. многоточием я пометил все то, что идет после атрибута radio, удалять это не надо.

 

И самое главное, добавляем к тэгу input обработчик события OnClick, должно получится так:

Вот и все, теперь данная опция при выборе будет динамично изменять стоимость товара на странице.

 

Для опций типа checkbox, все также, находим input, добавляем также атрибут price, но обработчик события OnClik будет немного другой:

 

Единственное, что вам может понадобиться регулировать, так это параметр

Он отвечает, за длину которую нужно отрезать от стоимости товара, что-бы получить значение-цифру в чистом виду. Значение «4» подходит  для рублевой валюты — «руб.«, для любой другой вы можете настроить сами.

 

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




Буду признателен если вы поделитесь данным постом

Комментарии
  1. Сергей пишет:

    Таким же образом можно организовать смену валют на сайте? я правильно Вас понимаю?

  2. admin пишет:

    Смена валюты (т.е. например, с доллара на рубль) в OpenCart уже встроена по умолчанию.

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

  3. Анатолий пишет:

    Скажите пожалуйста: что я делаю не так ?
    Добавил новую опцию: название «Цвет товара», значения: обычный (0), красный (1), зелёный (2). Здесь в скобках указана сортировка.
    Внес изменения, как описано в статье, но изменение цены отображается только в корзине. Что нужно сделать, чтобы цена менялась динамически и по умолчанию был выставлен цвет = обычный ?

  4. admin пишет:

    Как я понимаю, у вас используется radiobutton.

    Так, попробуйте в обработчике, вместо


    //узнаем цену выбранной опции
    price_select=$(this).attr('price');
    price_select=price_select.substring(0,price_select.length-length_trash);
    //конец узнаем цену выбранной опции

    Написать так


    //узнаем цену выбранной опции
    price_select=$('input[type=radio]).prop('checked', true).attr('price');
    price_select=price_select.substring(0,price_select.length-length_trash);
    //конец узнаем цену выбранной опции

  5. Анатолий пишет:

    И ещё один вопрос: есть ли какая-нибудь возможность указывать эти опции не для каждого товара (это очень долго), а для группы (например для выбранной категории) ?

  6. admin пишет:

    В OpenCart есть модули для групповой работы с товарами, где можно переименовывать, задавать стоимость, опции, атрибуты и т.п. для группы. Название не вспомню, по гуглите.

  7. Анатолий пишет:

    Спасибо за ответ, буду пробовать !

  8. Анатолий пишет:

    Вот в этой строке ято всё-таки должно быть заключено в кавычки ?

    price_select=$(‘input[type=radio]).prop(‘checked’, true).attr(‘price’);

    смущает вот это

    $(‘input[type=radio])

  9. admin пишет:

    Вас все правильно смущает, кавычки должны быть

    price_select=$(«input[type=radio]»).prop(«checked», true).attr(«price»);

  10. Анатолий пишет:

    Пробовал и с кавычкой и без неё: безрезультатно, динамически цена не меняется, только в корзине.

  11. admin пишет:

    Хм, если хотите я могу вам помочь.
    В 12.00 по Москве, я напишу вам email.

  12. Анатолий пишет:

    Было бы очень здорово.
    Спасибо за помощь !

  13. Сергей пишет:

    >Смена валюты (т.е. например, с доллара на рубль) в OpenCart уже >встроена по умолчанию.
    >
    >Данный пост описывает, как сделать, что-бы при выборе той или >иной опции цена изменялась динамически, т.е. сразу при нажатие.

    Я имел ввиду про другое что если разные товары изначально забиваются в разных валютах использоваться данный метод в виде вывода валюты возможно ли как то адаптировать?
    P.S>Ваши статьи под какую версию OpenCart?

  14. admin пишет:

    Не думаю, что данный метод перестанет работать, надо попробовать.

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

  15. Андрей пишет:

    Здравствуй, Инженер.
    Очень хороший блог, и все понятно.
    Я сисадмин, но меня заставляют заниматься сайтом.
    Сначала я упирался, но потом понял, что для меня это будет полезно. Вообщем, сайт который я указал переделывал сам.
    В HTML и CSS как-то разобрался, а PHP сложновато, тем более опыта по программированию у меня не было.
    Теперь о деле.
    Стоит задача — сделать группу пользователей со-скидкой, и это я сделал прикрутив модуль «Групповая скидка», но теперь поставили задачу, что-бы, если в карточке товара стояла «Акция» — скидка на этот товар не распространялась.
    Алгоритм я понимаю. Нужно делать скидку не на сумму, а на каждый товар в отдельности. И сделать проверку на «Акцию». Но как это реализовать? Опыта не хватает.
    Буду очень признателен за помощь.
    Спасибо.

  16. admin пишет:

    Андрей добрый вечер. Задача интересная, что-бы подсказать что-то, мне нужно поискать техническое решение. Думаю должно получится, я написал вам письмо на почту.

  17. Илья пишет:

    Немного не в тему, но Вы, кажется, разбираетесь в вопросе лучше остальных — подскажите, а как сделать так, чтобы цены в категории (или по всему сайту) можно было менять на выбранное количество процентов?
    например, вводим в некое новое поле в админке «15%» — и все цены увеличиваются на 15%. ставим «-15%» — всё возвращается.

  18. admin пишет:

    Добрый вечер Илья. Я написал вам на почту.

  19. Алексей пишет:

    Добрый день. Интересует вопрос. Как такое же сделать в категории, где идёт фильтр по опциям

  20. admin пишет:

    Добрый день Алексей!
    Не совсем понятен вопрос, в моем примере меняется цена на товар при выборе опций, в вашем случае надо что-бы менялись цены на категории, при выборе опций в фильтре?

  21. Александр пишет:

    http://dev.component.kg/index.php?route=product/product&path=120&product_id=918
    Есть такой товар… вроде прописал в select так как вы сказали не заработало…. как и что нужно сделать, может покажите пример для select?

  22. admin пишет:

    Добрый день Александр.

    Я могу посмотреть ваш код, но это будет в рамках уже услуги.
    Если вас интересует это, напишите мне сюда.

  23. Анна пишет:

    Добрый день! Очень нужная статья, сделала, как написано (у меня выбор опции тип radio), но не заработало… ((

  24. admin пишет:

    Добрый день Анна!

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

  25. Roman пишет:

    Здравствуйте. Очень доходчиво, спасибо. Но беда в том, что цена обновлятся, пересчитывается а в корзину летит изначальная цена товара, без учета опций. Как исправить?

  26. admin пишет:

    Добрый день Роман!

    Подскажите Роман, до встраивания «динамической цены» у вас была данная проблема?

  27. AskhatB пишет:

    Большое вам спасибо! Очень полезный сайт!

  28. admin пишет:

    Спасибо вам, что посетили мой сайт =)



Ваш комментарий


Ответ в цифрах

 
© s-engineer.ru, 2012-2017 | Все права защищены