PUFb6EiN

1
2## Виджет
3
4Установка виджета производится посредством добавления тега `script` на страницу или лэйаут сайта, а так же добавления на страницу элемента с уникальным идентификатором, в котором появится виджет.
5
6### Шаг 1. Добавление элемента-контейнера
7
8Для начала необходимо на странице создать пустой HTML–элемент с обязательным атрибутом `id` и разместить этот элемент в любом нужном месте. Например:
9```
10<div id='odnakassa-widget'></div>
11```
12Элемент должен быть пустым, т.к. его заменит виджет.
13Чтобы избежать "прыжков" при появлении виджета, можно дополнительно добавить CSS–стили для контейнера, например:
14```
15#odnakassa-widget {
16   min-height: 64px;
17}
18```
19
20### Шаг 2. Добавление скрипта виджета
21
22Перед закрывающим тегом `</body>` необходимо добавить скрипт-загрузчик:
23```
24<script src="https://static.odnakassa.ru/widget.js"></script>
25```
26
27### Шаг 3. Инициализация виджета
28
29Добавить еще один тег `<script>` перед закрытием `</body>` с функцией инициализации:
30```
31<script>
32OKWIDGET.init({
33  element: 'odnakassa-widget', // ID элемента-контейнера
34  agent_id: 4, // ID агента в системе
35  secret_key: '1q2w3e4r', // Секретный ключ для доступа к API
36  widget_id: 'ru.mysite' // ID виджета
37})
38</script>
39```