• Справка
  • Создание и настройка виджета

Создание и настройка виджета

1. Авторизуйтесь на сайте, перейдя по ссылке Вход, или нажмите на соответствующую кнопку в «шапке» сайта.

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

 

2. После успешной авторизации перейдите в личный кабинет, выберите вкладку «Мои виджеты» и нажмите кнопку «Добавить виджет».

Добавить новый виджет

Подробнее об авторизации вы можете прочитать в разделе "Справка" -> "Авторизация на сайте".

 

3. Настройте виджет

Общие настройки виджета

 В «Основных параметрах» укажите домен Вашего сайта, на котором будете размещать виджет. Если Вы введете некорректный домен или домен, отличный от того, на котором планируете запуск виджета, — виджет не будет запускаться.

В «Настройках отображения» укажите формат отображения виджета. Виджет может работать в двух режимах: в формате модального (всплывающего) окна и как часть контента. О том, как будет выглядеть выжет на сайте, можно прочитать в разделе "Справка" -> "Как будет выглядеть виджет на моем сайте".

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

 

Сценарий 1 (настройка «Открывать виджет в модальном окне» не установлена)

а) В группе настроек «Выбора калькуляторов» выберите один калькулятор, который будет отображаться на Вашем сайте.

б) Подтвердите конфигурацию настроек Вашего виджета, нажав на кнопку «Сохранить».

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

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

Настройка виджета сроительных калькуляторов в режиме отображения в контенте сайта

 

 

Сценарий 2 (настройка «Открывать виджет в модальном окне» установлена)

При выборе данной настройки запуск виджета на Вашем сайте будет осуществляться через нажатие на активный элемент – «кнопку».

а) В группе настроек «Настройки кнопки виджета» выпадающее меню «Тип кнопки» содержит список доступных вариантов внешнего вида «кнопки»: баннер, кнопка, ссылка.

Выбор типа кнопки виджета

Баннер – самый крупный и заметный формат из доступных вариантов отображения «кнопки». Высота баннера равна 120 px, ширина может быть вариативной – подстраиваться под содержимое кнопки, либо занимать всю ширину – 100% родительского блока, в который будет вставлен код виджета (такой вариант отображения доступен при активации опции «Кнопка во всю ширину» группы настроек «Дополнительно»).

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

Настройки кнопки виджета

Еще одна опция группы настроек «Дополнительно» - «Использовать картинку для кнопки», при ее активации баннер будет содержать картинку (иконку), ассоциируемую с выбранным набором калькуляторов из группы настроек «Выберите калькуляторы».

Кнопка – формат отображения по настройкам, полностью аналогичный формату баннера, однако высота кнопки составляет всего 54 px.

Гиперссылка – формат отображения с высотой 40 px. Для данного формата доступны все настройки баннера и кнопки, за исключением цвета фона. Данный формат обычно используется как строковый элемент для вставки в текст.

б) В группе настроек «Выбора калькуляторов» укажите один или несколько калькуляторов, которые будут доступны в виджете.

Настройка калькуляторов виджета

в) Убедитесь, что внешний вид «кнопки» настроен в соответствии с Вашими ожиданиями. Для этого обратите внимание на ее внешний вид в блоке «Как будет выглядеть кнопка».

г) Подтвердите конфигурацию настроек Вашего виджета нажав на кнопку «Сохранить».

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

 

После установки кода виджета на Ваш сайт, в случае, когда Вам потребуется изменить внешний вид кнопки или набор доступных калькуляторов — просто зайдите в личный кабинет Kalk.Pro и осуществите необходимые настройки, подтвердив их нажатием кнопки "Сохранить". Виджет на Вашем сайте автоматически подхватит изменения без переустановки кода.

 

Обязательна переустановка кода на Вашем сайте: при изменении «Настроек отображения» (модальное окно или как часть контента), а также в случае изменения настройки "Использовать картинку для кнопки".

Назад