Як налаштувати інформери для вашого сайту

Інформери — це інтерактивні віджети, що дозволяють інформувати клієнтів про акції, знижки, нові надходження і майбутні події та підвищувати їхню залученість у соціальні мережі.

Встановлення скрипту

Перш ніж розпочати створення інформера, необхідно встановити на сайт скрипт eSputnik. Для цього:

1. Перейдіть у Сайт → Форми.

2. Натисніть кнопку "Отримати скрипт".

3. Введіть ваше доменне ім'я.

4. Натисніть “Копіювати до буферу обміну” на бічній панелі, щоб скопіювати скрипт.

5. Встановіть скрипт на сайт.

6. Натисніть кнопку “Перевірити статус”, щоб переконатися, що ваш скрипт працює коректно.

Створення нового інформера

Щоб створити новий інформаційний віджет:

1. Перейдіть у Сайт → Форми → Інформери і натисніть кнопку "Створити інформер".

2. Введіть назву інформера у поле “Назва”, після чого виберіть тип інформаційного сповіщення з доступних опцій:

• Вбудований
• Модальне вікно
• Плаваюча форма

3. Натисніть кнопку “Далі”.

4. Натисніть панель кольорів і виберіть із випадаючої панелі потрібний колір для таких елементів інформера:

• Основна кнопка
• Основний заголовок
• Фон

5. Виберіть стиль сайту і натисніть "Далі". Доступні такі стилі:

• М’який
• Мінімалізм
• Класика
• Декоративний
• Сучасний

6. Прокрутіть вниз і виберіть зовнішній вигляд інформера, натиснувши кнопку “Вибрати” під варіантом, який ви вибираєте.

7. Натисніть кнопку “Зберегти”, щоб зберегти інформер з налаштуваннями за замовчуванням. Про те, як їх змінити, ви дізнаєтесь із розділу “Редагування параметрів інформаційного сповіщення”.

8. Якщо ви вибрали лінійний тип віджета, додайте CSS-селектор, щоб визначити його позицію. Розгорніть список “Як знайти CCS-селектор”, щоб дізнатися, як це зробити.

Якщо ви хочете вказати місце розміщення форми пізніше, активуйте перемикач “Додати місцезнаходження пізніше”.

9. Клікніть одну із п'яти іконок, щоб вибрати місцезнаходження для вашого інформера, після чого натисніть “Готово”.

10. Натисніть “Готово” на бічній панелі для завершення.

Ви можете відредагувати свій інформер у будь-який момент.

Редагування параметрів інформера

Щоб відредагувати параметри інформера:

1. Перейдіть у Сайти → Форми і натисніть “Інформери” в меню ліворуч.

2. Натисніть інформер, який ви бажаєте відредагувати.

Ви можете відредагувати такі параметри:

• Зовнішній вигляд
• Правила відображення інформера
• Місцезнаходження

Нижче ви знайдете доступні опції для кожного з цих параметрів.

Редагування зовнішнього вигляду

Для редагування параметрів зовнішнього вигляду інформера:

1. Натисніть "Редагувати" у вкладці "Параметри інформера".

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

3. Натисніть кнопку “Зберегти/опублікувати” і виберіть “Зберегти” або “Зберегти й опублікувати” у випадаючому меню.

Дії з елементами

Щоб внести якісь зміни до елементів вашого інформаційного сповіщення:

1. Наведіть курсор на елемент, щоб активувати меню елемента.

2. Наведіть курсор на іконку з трьома крапками.

3. Клікніть потрібний значок:

• А. Перемістити
• Б. Створити копію
• В. Видалити

Додавання елементів

Щоб додати елемент у ваше інформаційне сповіщення:

1. Виберіть вкладку “Контент”.

2. Перетягніть потрібний елемент у свій інформер і відпустіть кнопку в потрібному місці всередині віджета.

Налаштування параметрів рамки інформера

Щоб налаштувати параметри рамки інформера:

1. Натисніть рамку інформера.

2. Виберіть вкладку “Десктоп” або “Мобільні налаштування” в меню ліворуч.

3. Змініть будь-який із таких параметрів:

• Розмір
• Вирівнювання елементів всередині
• Внутрішні відступи
• Зовнішні відступи
• Фон
• Обведення
• Тінь
• Скруглення кутів

4. Клацніть іконку замка і виберіть потрібну синхронізацію. Для кожного застосованого параметра можна вибрати таку синхронізацію його налаштувань на сторінках:

• Для всіх. Налаштування, які застосовуються, синхронізуються на всіх сторінках (у мобільній та десктопній версіях).
• Окремо для десктопної/мобільної версії. Застосовані налаштування синхронізуються на всіх сторінках десктопної або мобільної версії.
• Не синхронізувати. Без синхронізації.

Налаштування параметрів елементів інформера

Для налаштування параметрів елемента інформера:

1. Клікніть елемент інформера.

2. Виберіть вкладку “Десктопна версія” або “Мобільна версія”.

3. Змініть будь-які параметри, що відображаються в меню ліворуч.

Редагування верстки

Для редагування параметрів оформлення інформера:

1. Виберіть вкладку “Оформлення” в меню ліворуч і розгорніть пункти меню.

2. У пункті меню “Стиль тексту” виберіть із випадаючого списку необхідні параметри для:

• Шрифту заголовка
• Шрифту тексту

Виберіть “Докладніше”, щоб дізнатися, як визначити сімейство шрифтів.

3. У пункті меню “Адаптивність” введіть потрібне значення ширини екрана.

Налаштування загальних параметрів

Ви можете призначити дію за кліком для таких елементів інформаційного сповіщення:

• Кнопка
• Зображення
• Контейнер

Щоб налаштувати дію за кліком:

1. Натисніть будь-який із вищенаведених елементів інформера.

2. Виберіть вкладку “Загальні” в меню праворуч.

3. Вставте або впишіть URL-адресу в полі “Відкрити URL”.

4. Якщо ви хочете, щоб сторінка відображалася в новій вкладці, активуйте кнопку “Відкрити сторінку в новій вкладці”. 

Меню верхньої панелі

У меню верхньої панелі знаходяться кнопки з такими функціями:

• А. Скасувати/Повторити
• Б. Багатомовні налаштування
• В. Колір фону
• Г. Попередній перегляд брейкпойнта на десктопі
• Ґ. Попередній перегляд брейкпойнта на мобільному
• Д. Попередній перегляд форми
• Е. Закрити без збереження
• Є. Зберегти/опублікувати

Редагування відображення інформаційного сповіщення

Для редагування правил показу інформера:

1. Натисніть “Змінити” в полі “Виклик інформера”.

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

• Частота показу
• Кому
• На сторінках
• API

3. Натисніть “Зберегти”.

Застосовані правила відображаються у вкладці “Правила”.

Редагування місцезнаходження

Щоб відредагувати параметри місцезнаходження:

1. Натисніть “Редагувати” в полі “Місце розміщення”.

2. У меню редагування місцезнаходження змініть CSS-селектор, дотримуючись інструкцій, що відображаються за натисканням кнопки “Як знайти CSS-селектор”.

3. Клікніть будь-яку з невиділених іконок, щоб вибрати іншу позицію для вашого інформера.

4. Натисніть “Готово”.