Skip to content

Установка 2.0

Alex Vi edited this page May 3, 2024 · 4 revisions

С 3 версии меняются адреса и способ установки виджета. На данной странице описан процесс установки старой версии виджета.

Caution

2 версия виджета объявлена устаревшей 13.09.2023, в нее не будут вноситься изменения или улучшения, рекомендуется мигрировать на 3 версию

Процесс миграции описан на странице Миграция 3.0

Способы установки виджета

Есть два способа установки виджета:

  1. Локальная — когда все файлы размещаются на вашем сервере.
  2. Минимальная — когда все файлы грузятся с нашего сайта, а с вашего сайта подгружается только данные с авторизацией. (С 01.04.2024 недоступна, подробнее)

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

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

Распаковка архива

Для установки виджета необходимо распаковать архив с виджетом. Внутри архива содержится:

  • скрипты виджета - директория widget;
  • примеры работы виджета - директория examples;
  • краткая инструкция по установке виджета - файл index.php. Важно понимать, что в составе виджета есть серверные файлы (widget/scripts/service.php и widget/scripts/template.php), для функционирования которых необходимо разместить их на веб-сервере. Поэтому рекомендуется смотреть примеры на веб-сервере

Для локальной установки виджета необходимо скопировать директорию widget в директорию сайта: Например сайт расположен в директории /home/site/, копируем каталог с виджетом и тогда полный путь к виджету будет /home/site/widget/ Зависимость расположений скриптов должна быть сохранена. Обратите внимание, что в сборке виджета есть серверный файл (widget/scripts/service.php).

Для минимальной установки виджета необходимо скопировать только серверные файлы (widget/scripts/service.php, widget/scripts/tempplate.php) к себе на сайт, например в директорию /home/site/widget/scripts/service.php.

Авторизация и настройка

Для корректного расчета стоимости доставки виджету необходимы авторизационные данные для доступа к сервису интеграции СДЭК. Чтобы получить данные по Аккаунту интеграции нужно в личном кабинете, в разделе Интеграция нажать кнопку «Создать ключ», затем в разделе интеграция появится Идентификатор аккаунта и Пароль.

Чтобы ввести данные, откройте файл scripts/service.php. Данные вводятся в 17-й (account) и 20-й (key) строках внутри пустых кавычек.

Если необходимо изменить приоритет расчета тарифов, измените их последовательность в строках 11 (доставка курьером) и 14 (самовывоз из ПВЗ). Номера тарифов можно получить в документации к сервису интеграции https://api-docs.cdek.ru/15616129.html в Приложении 1

Подключение скриптов

Для подключения локальной версии виджета необходимо на нужную страницу добавить код (рекомендуется его расположить внутри тега <head>): <script type="text/javascript" src="https://ваш.сайт/путь_к_файлу/widjet.js" id="ISDEKscript" charset="utf-8"></script>

Для подключения минимальной версии виджета необходимо на нужную страницу добавить код (рекомендуется его расположить внутри тега <head>): <script type="text/javascript" id="ISDEKscript" src="https://cdn.jsdelivr.net/gh/cdek-it/widget@2/widget/widjet.min.js" charset="utf-8"></script>

Размещение виджета на странице

На страницу необходимо добавить элемент, в который будет встроен виджет. Данному элементу следует указать высоту, иначе он может принять значение высоты равной 0 и виджет на странице не будет видно. <div id="forpvz" style="height:600px;"></div>

Далее необходимо создать обработчик для инициализации виджета:

Для локальной версии виджета обработчик с минимальным числом параметров будет выглядеть так:

<script type="text/javascript">
   var widjet = new ISDEKWidjet({
       defaultCity: 'Уфа',
       cityFrom: 'Омск',
       link: 'forpvz'
   });
</script>

Для минимальной установки виджета наименьшее число параметров будет выглядеть таким образом:

<script type="text/javascript">
   var widjet = new ISDEKWidjet({
       defaultCity: 'Уфа',
       cityFrom: 'Омск',
       link: 'forpvz',
       path: 'https://cdn.jsdelivr.net/gh/cdek-it/widget@2/widget/scripts/',
       servicepath: 'http://yoursite.net/service.php' //ссылка на файл service.php на вашем сайте
   });
</script>

Далее необходимо провести настройку виджета в соответствии с информацией со страницы Настройка 2.0