Создание конфигурации

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

Пример конфигурации с полным набором параметров

{
  "productId": 23903,
  "isDemo": true,
  "color": "#FA6400",
  "colorText" "#FFFFFF",
  "theme": {
    "background": "#F0F0F0",
    "backgroundWidget": "#F6F6F6",
    "components": {
      "primaryBackground": "linear-gradient(117.59deg, #FF944D -1.03%, #FA6400 51.21%, #FF944D 107.6%)",
      "primaryText": "#FFFFFF",
      "secondaryBackground": "#F6F6F6",
      "secondaryText": "#0B132A",
      /* "reservePrimaryBackground": "#FA6400" */
    },
    "svg": {
      "fill": "#FA6400",
      "content": "#FFFFFF"
    }
  },
  "logoImage": "logo.svg",
  "headerLink": "https://www.giftery.ru",
  "locale": "en",
  "macroregion": "ru",
  "currencyCode": "RUB",
  "face": 1000,
  "faces": [500, 1000, 1500],
  "recipients": ["friend"],
  "allowTestSend": false,
  "imageSelect": false,
  "allowCustomImage": true,
  "allowPromoCodes": true,
  "checkBalance": "disabled",
  "corporateOrder": "disabled",
  "analytics_channel": "site=1"
}

Описание параметров

Параметр	По-умолчанию	Описание
`productId`	Параметр обязателен, значение по-умолчанию отсутствует	ID бренда в каталоге Гифтери.
`isDemo`	false	Демо-режим виджета. В данном режиме заказ не формируется, а вместо перехода на оплату сразу отображается сообщение об успешной отправке.
`color`	#fa6400	Цвет темы виджета в шестнадцатеричном виде. Данный параметр перебьет theme.components.secondaryBackground и theme.svg.fill
`colorText`	#ffffff	Цвет текста в компонентах виджета в шестнадцатеричном виде. Данный параметр перебьет theme.components.primaryText и theme.svg.content
`logoImage`		Путь к логотипу бренда.
`headerLink`		Данный параметр позволяет добавить ссылку к логотипу в блоке header.
`locale`	ru	Локаль виджета. На данный момент виджет может быть отображён на русском, казахском, английском и испанском языках. Для этого можно указать значение параметра `ru`,`kk`,`en`,`es` соответственно.
`macroregion`	ru	Возможность указывать регион вне зависимости от региона продукта. (Влияет исключительно на интерфейс виджета, внутренняя логика и покупки завязаны на регионе продукта!)
`currencyCode`	RUB	Возможность указывать валюту вне зависимости от региона продукта. Поддерживается трёхбуквенный код по стандарту ISO 4217 (пример: RUB, BYN, EUR, USD)
`face`	выбирается первый из списка	Номинал подарочного сертификата, который будет выбран по умолчанию при открытии виджета.
`faces`	выводится весь список доступных номиналов	Массив номиналов, которые будут отображены в списке выбора номиналов. Если оставить только один номинал, то в форме покупки вместо селекта будет выведена надпись с единственно возможным номиналом.
`recipients`	["friend", "myself"]	Данный параметр позволяет скрыть выбор адресата, для отправки. Например, задав `["friend"]`, можно убрать возможность отправки сертификата самому себе.
`allowTestSend`	true	Установив параметру значение `false`, можно скрыть форму отправки тестового сертификата.
`imageSelect`	true	Установив параметру значение `false`, можно ограничить возможность выбора изображения из доступных для продукта.
`allowCustomImage`	false	Позволяет включить возможность загрузки своего изображения.
`allowPromoCodes`	false	Добавляет поле для ввода промокода на страницу корзины.
`checkBalance`	"disabled"	Позволяет вручную отключать возможность проверки баланса. Принимает значения: "disabled"
`corporateOrder`	"enabled"	Позволяет вручную включать/отключать кнопку Корпоративный заказ. Принимает значения: "enabled", "disabled"
`analytics_channel`	site	Параметр, позволяющий передавать аналитическую информацию. Пример: `https://widget.giftery.cards/?code=card&analytics_channel=site=1`

Описание кастомизации темы виджета

Параметр	По-умолчанию	Описание
Фон виджета (theme):
`background`	#F0F0F0	Меняет фон, над которым рисуется виджет. Подробнее: MDN
`backgroundWidget`	#F6F6F6	Меняет фон внутри виджета. Подробнее: MDN
Компоненты (theme.components):
`primaryBackground`	linear-gradient(117.59deg, #FF944D -1.03%, #FA6400 51.21%, #FF944D 107.6%)	Меняет цвет основных компонентов виджета (кнопки "Далее", "В корзину", селекторы, чекбоксы и т.д.). Может принимать все значения, которые соответствуют полю background в CSS. Подробнее: MDN
`primaryText`	#FFFFFF	Меняет цвет текста внутри основных компонентов виджета. Цвет задается в шестнадцатеричном виде.
`secondaryBackground`	#F6F6F6	Меняет цвет дополнительных компонентов виджета (кнопки "Назад", "Отменить" и т.д.). Может принимать все значения, которые соответствуют полю background в CSS. Подробнее: MDN
`secondaryText`	#0B132A	Меняет цвет текста внутри дополнительных компонентов виджета. Цвет задается в шестнадцатеричном виде.
Иконки (theme.svg):
`fill`	#FA6400	Меняет фон иконок. Цвет задается в шестнадцатеричном виде.
`content`	#FFFFFF	Меняет цвет контента внутри иконок. Цвет задается в шестнадцатеричном виде.