Підстановка даних за допомогою SRT-блоків

У системі eSputnik є можливість автоматично створювати контент для листів із використанням зовнішніх джерел даних (звідки будуть передаватися дані) та вже налаштованих та збережених у бібліотеці модулів (які визначають дизайн елемента у листі).

В результаті перетворені дані, підключені до модулів, розміщуються у спеціальних смугах, заздалегідь підготовлених для використання.

SRT визначає зовнішній вигляд і правила, за якими підставлятимуться дані у смугу. Конструктор розділений на 3 секції:

• Start section (Початкова) – тут можна визначити, які модулі повинні бути розміщені на самому початку автоматично згенерованої області.

• Repeatable section (Повторювана) – тут можна встановити правило, які модулі слід використовувати для кожного циклу (кола). Це дуже корисно, якщо ви хочете чергувати різні модулі або використати деякі специфічні модулі в окремих циклах.

• Tail section (Хвостова секція) – це місце, де ви можете встановити правило для відображення певного модуля у випадку, якщо у вашому джерелі даних недостатньо елементів (товарів) для завершення всього кола з області, що повторюється.

Теорія. Базові налаштування SRT

Перш ніж приступати до роботи, необхідно:

• підключити одне із джерел даних (Google Sheets, рекомендації);

• налаштувати smart-контейнери для вибраного джерела та зберегти їх до бібліотеки модулів.

Після цього можна приступати до підготовки зовнішнього вигляду блоків для підстановки.

Підготовка листа та налаштування SRT

Додайте смугу в лист. Клацніть на фон навколо листа в редакторі та натисніть “+”.

Перейдіть до розділу "Дані" → Dynamic:

Заповніть такі поля:

• Назва елемента.

• Джерело даних. Якщо у вас ще жодне джерело не підключене, скористайтесь нашою інструкцією.

• Виберіть зі списку, яку дію виконати, якщо джерело даних буде порожнім:

  • приховувати елемент,

  • показувати елемент,

  • не генерувати лист.

Клікніть двічі на смугу, щоб вказати значення для підстановки:

Виберіть з бібліотеки модулів необхідні структури та перетягніть їх у тіло листа:

1. Стартова секція
   Які модулі повинні розміщуватися на початку динамічного елемента.

2. Періодична секція
   Які модулі слід використовувати в циклі та правила для підставлення блоків.

3. Кінцева секція
   Який модуль/модулі слід використовувати у самому кінці динамічного елемента.

Заповнення всіх секцій необов'язкове. Секції №1 і №3 використовуються для статичних елементів, тобто вони будуть зображуватися у тому вигляді, як ви їх поставите. Їх можна не заповнювати.

Розглянемо другу секцію, яка призначена для заповнення елементами, що повторюються.

Налаштування SRT (Repeatable section)

Повторювана секція призначена для гнучкого керування зовнішнім виглядом даних і правилами їх відображення в листі. Наприклад, необхідно, щоб товари підставилися у такому вигляді:

• модуль із трьома товарами у рядку;

• модуль із двома товарами у рядку;

• модуль з одним товаром у рядку (якщо залишиться один товар у джерелі).

У момент відправлення листа до зазначених блоків будуть поставлятися товари з джерела даних та чергуватись 3+2+3+2. Блоки будуть повторюватися, доки товари не закінчаться у файлі. Одиночна структура відобразиться лише якщо у файлі залишиться один останній товар.

Ви можете вибрати тип структури зі збережених модулів у вкладці “Мої модулі” або зі вкладки “Загальні”:

Перетягніть модуль у лист – відобразиться порожня структура, яку потрібно заповнити смарт-контейнерами.

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

Задаються правила відображення всій структурі

або  кожному контейнеру окремо.

Приведемо приклад, який варіант налаштувань обрати:

1. Налаштування структур. Потрібно, щоб відображалися по два товари в структурі. Але у фіді може бути непарна кількість товарів.

Тоді додаємо дві структури: одну на 2 товари і нижче – на 1 товар. Для структури на 1 товар додаємо правило "Застосовувати, якщо у джерелі даних залишилася задана кількість записів" і пишемо значення 1. Якщо в фіді 4 товари, вони відобразяться 2+2. Якщо в фіді 5 товарів, вони відобразяться послідовно 2+2+1.

2. Налаштування контейнера. Наприклад, є знижка не на всі товари, а лише на певні. У цьому випадку у обраних товарів потрібно відображати перекреслену ціну. Для цього створюється два контейнери:

• один блок – нова ціна + перекреслена стара ціна;

• другий блок – лише актуальна ціна.

Додаємо правило: якщо у товара є поле oldPrice, показувати один контейнер, якщо немає – інший.

Налаштування структури

Щоб задати налаштування, виділіть потрібний блок. Зліва відкриється меню, де можна:

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

• Застосувати інші – відобразиться лише порожня структура, яку потрібно заповнити смарт-блоками для підставлення даних.

Для останнього варіанту після додавання смарт-блоків стануть доступними “Колонки”, де можна задавати правила для кожної горизонтальної або вертикальної колонки окремо.

У варіанті з колонками важливо, щоб не було порожніх структур: все потрібно заповнити даними, інакше незаповнені елементи не будуть відображатися.

Далі можна добавляти правила, що однакові для блоків та структур.

Налаштування контейнера

Зверніть увагу, що зовнішній вигляд контейнерів у самому SRT-конструкторі змінювати не можна. Редагування можна виконати у паралельній вкладці, або повернутися до листа. Після внесення змін потрібно оновити блок у бібліотеці.

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

Для контейнера можна обрати, заповнювати його даними чи ні.

Якщо ви оберете “Ні”, то інформація залишиться без змін, блок буде статичним.

Наприклад, для лівого блока вибрано "Ні", і він залишається статичним, а для правого залишено “Так”, і в ньому змінюються картки.

Після вибору опції можна переходити до правил, або відразу до тестування.

Правила для застосування в блоках та структурах

Варіант 1. Застосовувати, якщо певне поле присутнє в джерелі даних

Як це працює?

Наприклад, ми хочемо, щоб в картках виводилася стара ціна у товарів, на які є знижка.

1. По-перше створюємо альтернативний контейнер, для якого з‘явиться помітка “або”:

2. Задаємо налаштування нижньому контейнеру, беручи зі джерел даних потрібну змінну. В нашому випадку це назва стовпця oldPrice.

3. Прописуємо в полі змінну саме так, як вказано в таблиці.

Таким чином, у товарів зі старою ціною вона відобразиться в картці.

Варіант 2. Застосовувати, якщо в джерелі даних залишилася певна кількість записів

Як це працює?

Наприклад, у джерелі використовується непарна кількість товарів.

Структура з даними відобразиться, тільки якщо всі товари вже будуть підставлені в лист, і залишиться лише один.

Варіант 3. Застосовувати тільки до певного циклу

Як це працює?

Наприклад, у нас є 12 товарів, і потрібно після 6 товарів показувати кнопку СТА.

Ми додаємо структуру з кнопкою і вказуємо, що вона повинна застосовуватися лише для 3-го циклу.

Виходить, що перші 2 цикли містять по 3 товари. Після їхнього підставлення додасться кнопка СТА, потім знову товари.

Варіант 4. Застосовувати до циклів, значення є кратним певному числу

Як це працює?

Налаштування аналогічне попредньому варіанту, але буде застосовуватися до всіх циклів, що кратні нашому значенню.

Наприклад, у нас є 12 товарів і потрібно після кожних 6 товарів показувати кнопку СТА.

Ми додаємо структуру з кнопкою та вказуємо, що вона має застосовуватися для кожного циклу, який дорівнює трьом.

Цикл #1 и #2 містять по 3 товари. Після їх підставлення в цикл #3 додасться кнопка СТА, потім знов два цикли по 3 товари – і знову відобразиться кнопка.

Варіант 5. Застосовувати, починаючи із певного циклу

Як це працює?

Це правило допоможе нам використовувати різні варіанти верстки та з обраного циклу відображати товари в іншому вигляді.

Наприклад, потрібно, щоб спочатку була верстка блоків по 3 товари в ряд, потім змінилася на 2 товари.

Ми вказуємо для блоку з 2 товарами “5”, що відобразить цей тип верстки лише з 5-го циклу.

Варіант 6. Застосовувати до певного циклу

Як це працює?

Це правило, аналогічно попередньому, допоможе використовувати різні варіанти верстки, але тільки до обраного циклу.

Наприклад, потрібно, щоб спочатку була верстка блоків по 3 товари в ряд, потім змінилася на 2 товари.

Ми вказуємо для блоку із 3 товарами “5”, що відобразить цей тип верстки лише до 5-го циклу.
 

Починаючи з 6-го циклу оформлення зміниться на два товари до ряду.

Довільний код

Код генерується, коли ви вносите зміни через конструктор SRT, або можна прописати його самостійно. Наприклад, якщо потрібно скопіювати код з іншого листа або переглянути структуру смуги.

Частина 2. Приклад створення листа SRT

Перш ніж створити лист, підключіть хоча б одне джерело даних у власному кабінеті (Налаштування → Джерела даних).

Створення блоків для письма. Підготовчий етап

Можна створювати лист повністю у динамічній смузі, заповнюючи всі розділи, або частково, використовуючи лише один. Розглянемо створення листа із заповненням всіх розділів.

1. Створюємо та зберігаємо в бібліотеку блоків структуру "Хедер".

2. Створюємо порожню структуру з двома контейнерами та додаємо її до бібліотеки модулів:

3. Окремо створюємо смарт-блок у структурі на два контейнери та зберігаємо його до бібліотеки. У нашому випадку джерело даних – Google-таблиця. Назви полів у таблиці – це наші змінні для підстановки.

Можна використовувати готові смарт-блоки з бібліотеки: Модулі → Загальні → Картки товарів.

Потрібно лише змінити назви змінних та зберегти оновлений блок у бібліотеці. Це може бути простіше та швидше, ніж створювати свої.

Зверніть увагу, що для встановлення в SRT потрібні саме контейнери. Тому можете зберегти окремо блоки, окремо структуру, щоб спростити заповнення SRT-смуги.

4. Створюємо смарт-блок з перекресленою старою ціною у структурі на два контейнери та зберігаємо його до бібліотеки.

Змінні використовуємо з джерела даних, наприклад, у Google Sheets це назви стовпців.

5. Створюємо та зберігаємо в бібліотеку блоків структуру з кнопкою.

Налаштування SRT в листі

1. Заходимо в налаштування смуги та натискаємо Dynamic. Потім даємо назву елемента, вибираємо джерело даних, яке вказано у smart-блоках, і що робити, якщо джерело порожнє.

2. За кліком на SRT-смугу відкриваємо конструктор:

Опціонально до стартової секції додаємо з модулів структуру "Хедер", клікаємо по неї і зліва вибираємо "Залишити поточні":

3. У секцію, що повторюється, додаємо з модулів порожню структуру:

4. Перетягуємо до неї смарт-блоки зі старою ціною.

Під них перетягуємо смарт-блок без старої ціни.

5. Вибираємо кожен контейнер зі старою ціною та додаємо правило "Застосовувати, якщо певне поле присутнє у джерелі даних". У цьому випадку, якщо є oldPrice, то клієнт побачив перекреслену стару ціну.

6. Додаємо структуру з одним товаром у разі, якщо у джерелі буде непарна кількість записів. Вибираємо для неї правило "Застосовувати, якщо в джерелі даних залишилася певна кількість записів" і прописуємо 1.

Структура з даними відобразиться лише тоді, коли всі товари вже будуть підставлені в лист, і залишиться лише один.

7. Опціонально до замикаючої секції додаємо з модулів структуру з кнопкою, клікаємо по неї та вибираємо перемикач "Залишити поточні".

8. Зберігаємо зміни.

Надсилання тестового повідомлення

Щоб перевірити підстановку даних, натисніть кнопку "Test" у редакторі та вкажіть адресу для надсилання тестового повідомлення.

Або надішліть тест у списку повідомлень через пункт “Створити розсилку”,

обравши потрібний email у вкладці "Контакти".

Читайте також, як налаштувати лист з рекомендаціями в обліковому записі eSputnik.