Від автора: з одного боку лендінгем пейдж досить сильно підвищують відвідуваність і конверсію сайту, але з іншого боку, їх не так легко створити, особливо якщо ви не вмієте програмувати. Саме для цього, я представив вам рішення — WordPress плагін Long Form Storybuilder (LFS). У цій статті я розповім вам, як в два кліка створити інтуїтивно-зрозумілу лендінгем сторінку.
Базові налаштування
Давайте встановимо і запустимо. На даному етапі мається на увазі, що у вас є такі речі:
Сайт WordPress на локальному або веб-сервері
Встановлений і запущений плагін Long Form Storybuilder
Якщо виконано умови вище, перейдіть в панель WordPress і додайте нову сторінку Сторінки > додати. Задайте відповідний заголовок і збережіть її. Потім дозвольте плагіну підключитися до проекту, клікнувши на Enable Long Form Content галочку в правому верхньому куті.
На сторінці вище видно, що я додав нову сторінку і активував галочку. Тепер пересохраните сторінку. Ви отримаєте повідомлення про те, що Long Format Content активний та, що ви можете редагувати цю сторінку в плагіні. Клікніть на кнопку Edit my Long Format Content Page.
На даному етапі відкриється кастомайзер тим, в якому з’являться дві нові панелі від плагіна. Нові панелі:
Long Format Page Sections
Page Options
З допомогою Page Options можна встановити основні і вторинні кольори лендінгем пейдж, а Long Format Page Sections допоможе додати секції на сторінку.
В попередній статті я згадав цілий список можливих секцій, які можна додати через плагін Long Form Storybuilder. Перейдіть в Long Format Page Sections > Add a Section і додайте потрібні секції.
У кожній секції є ряд налаштувань, які необхідно змінити, щоб секція стала частиною лендінгем пейдж.
Створення лендінгем пейдж
Після того, як я пояснив базову архітектуру плагіна Long Form Storybuilder, давайте нарешті створимо наш лендінгем пейдж. Я відразу перестрибнув у панель Page Options і поставив чорний основним кольором, а білий вторинним.
Далі йде сама крута частина – додавання секцій на лендінгем сторінку.
Крок 1: Додавання меню
Перша секція, яку я додав, що це панель навігації. Я назвав її My_Nav_Menu, поставив свій логотип і вибрав тип меню.
Крок 2: Хедер
Відразу після панелі навігації йде вкрай важливий компонент лендінгем сторінки – вступний блок. Зазвичай це зображення з текстом по центру.
На скріншоті вище видно, що я додав секцію під назвою My_Header_Menu. Першим ділом я додав зображення. Потім йде поле основного заголовка, де ви можете задати назву вашого продукту або сервісу.
Крок 3: Заголовок секції
Далі я додав секцію під назвою Section Heading. Це звичайний заголовок, який вказує на початок нової секції. На скріншоті нижче показані деталі.
Крок 4: Колонка з контентом
Потім я додав трохи тексту про особливості мого продукту. Ви повинні були помітити, що зазвичай опис відображається у дві-три колонки. Через плагін Long Form Storybuilder можна з легкістю їх додати. Я використовував дві колонки.
Секція дуже проста, всього-то й потрібно, що додати текст. Я обидві колонки забив текстом-прикладом.
Крок 5: Секція призову до дії
В кінці я додав секцію заклику до дії, спонукають людей купити продукт, про який йдеться на сторінці. У нашому випадку я прошу людей зареєструватися. Ви ж можете направити їх на сторінку кошика або куди-небудь ще.
Всього я додав п’ять секцій на лендінгем пейдж. На скріншоті нижче показана кнопка Reorder, з допомогою якої можна поміняти порядок секцій.
Крок 6: Публікація
Як тільки ви закінчите, натисніть кнопку Save & Publish в самому верху. Зауважте, що яку б ви секцію не створили, ви відразу ж побачите її в живому превью – приваблива особливість.
Крок 7: Попередній перегляд результату
Перейдіть на вкладку Сторінки та подивіться на сторінку, яку ви відредагували в плагіні LFS, клікнувши на View Page. Нижче представлений результат моєї лендінгем пейдж.
Висновок
Дані секції можна додати повторно, додати ще більше секцій і відсортувати їх за своїм розсудом. Більш ніж упевнений, що ви з допомогою цього плагіна створите круту лендінгем сторінку не більше ніж за 5 -10 хвилин. Для пошуку зображень високого дозволу з ліцензією CC0 можна скористатися сервісом PicJumbo. Процес створення лендінгем пейдж через плагін Long Form Storybuilder став дуже простим і зручним. Можна виставляти по одній новій сторінці кожен день. А що ви думаєте про це плагіні? Буду радий почути ваші коментарі.