Добавление виджетов транспортных компаний 2.0
Учитывая гибкие возможности виджетов транспортных компаний и короткие сроки их внедрения мы написали для веб-разработчиков (треб. знание JS и HTML) инструкцию по добавлению виджетов доставки в корзину 5CMS.
Убеждаемся, что у интересующей вас транспортной компании есть виджет (на сайте этой ТК).
Суть интеграции с виджетом транспортной компании:
- считать скриптом по id из шаблона вес, объем, длина одной стороны, сумму заказа
- отправить эти данные через виджет
- полученные обратно данные от виджета записать в специальные поля в шаблоне
Теперь пошагово:
В админке:
Настройки > Доставка
создаем новый вариант доставки, вводим его название и выбираем "Используется виджет доставки".
И будет сгенерирован ваш ID доставки.
Виджет должен запускаться по клику "выбрать на карте" class="show_map" (чтобы не грузить лишних скриптов в холостую):
a) Код виджета и вызов скриптов виджета (вставляете в админке), рекомендуется обернуть в $(window).load(function(){ (чтобы вызов был запущен точно после загрузки всех скриптов)
б) Инициализация виджета (реком. открытие во всплывающем окне) по клику на "выбрать на карте":
$(document).on('click', '#li_delivery_ваш ID .show_map', function () {
1) Считываем: вес, объем, длина одной стороны, сумму заказа:
var weight = $('#ems-total-weight').text(); // кг
var volume = $('#total-volume').text();
var side = $('#cart-side').text(); // см
var order_total_price = $('#ems-total-price').text();
2) Вызываем инициализацию функции (напр.: open и тп)
});
в) Ответ от виджета используем следующим образом:
Если хотите учитывать параметр "Доставка бесплатна от", то дополнительно возьмите у радио-кнопки атрибут data-freefrom и при выполнении условия обнуляйте расссчитанную стоимость доставки.
Допустим виджет отдает нам стоимость доставки переменной result.price
- Пишем стоимость (с пересчетом в валюту пользователя с использованием переменной curr_convert) в <span id=not-null-delivery-price-ваш ID
- и стоимость как есть в <input id="widget_ваш ID "
Напр:
// calc (1)
$('#not-null-delivery-price-ваш ID').html( (result.price*curr_convert).toFixed(0) );
$('#widget_ваш ID').val(result.price);
// calc (1) end
// переменная curr_convert отдается из шаблона
- Остальную инфу о заказе (город, вид, сроки и тд) вставляем скриптом в <div class="deliveryinfo"></div> (этот div уже присутствует автоматом в шаблоне)
- Затем убедимся, что радио-кнопка доставки нажата и отправим инфу о рассчитанной доставки из .deliveryinfo в #calc_info (также уже присутствует в шаблоне):
// calc (2)
$('#deliveries_ваш ID').click();
$('#calc_info').html( $("#li_delivery_ваш ID .deliveryinfo").text() );
// calc (2) end
UPD: описание обновлено 25.11.2022
Еще нет своего сайта? Запустите интернет-магазин на платформе 5CMS - Все для продаж уже внутри!
-
21.09.2018
В 5CMS проделана большая работа по удовлетворению мыслимых и немыслимых потребностей SEO-специалистов.
На текущий момент 5CMS обладает самым богатым SEO-функционалом...
-
01.08.2014
В 5CMS реализована возможность комбинировать применение скидок: от суммы, постоянная, накопительная, бонусы и промокоды, а также купоны
-
12.07.2018
Кроме стандартных способов продаж в интернет-магазинах (зашел на сайт > нашел товар > купил), 5CMS позволяет также делать косвенные продажи (сопутствующие, допродажи и др.).