Page Builder Sandwich не схожий на типовий конструктор сторінок — він нескладний і простий у використанні.

Ви можете переглянути відео нижче для швидкого ознайомлення.

Де знаходиться редактор?

Спочатку створіть нову сторінку, публікацію або CPT. Потім відкрийте нову або будь-яку наявну публікацію у фронтенді. PBS повністю працює на фронтенді, тому вам не доведеться порпатися в бекенді.

У верхній частині сторінки (на панелі адміністратора) має бути кнопка «Page Builder Sandwich», натисніть її, щоб розпочати редагування. Зверху з’явиться область форматування тексту, а збоку — панель додавання елементів. Тепер область вмісту вашої теми стала вашим редактором!

За допомогою PBS можна редагувати лише окремі сторінки. Ви не можете редагувати список публікацій блогу або сторінку 404, оскільки вони створюються вашою темою. Публікації, сторінки та користувацькі типи записів підтримуються.

Редагування вмісту

А тепер найцікавіше… опинившись у фронтенді всередині редактора, клацніть будь-який текст у вашому контенті або клацніть всередині області контенту та починайте вводити текст! На відміну від інших конструкторів сторінок, PBS дозволяє безпосередньо редагувати вміст без потреби відкривати спливаючі діалогові вікна.

Форматування вмісту / Наведення краси

Під час редагування область угорі називається панеллю форматування тексту. Ця панель містить усі інструменти форматування, які ви використовуватимете для оформлення тексту: кольори, жирний, курсив, вирівнювання, додавання посилань, списки тощо. Наведіть курсор на кожну кнопку, щоб дізнатися, що робить цей інструмент.

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

Наведіть курсор миші на кнопку «Додати елементи» у верхньому лівому куті екрана, щоб відкрити панель додавання елементів. Також ви можете просто перемістити курсор до лівого краю екрана, щоб вона з’явилася.

Щоб вставити будь-який елемент, затисніть його лівою кнопкою миші та перетягніть в область контенту. Область, куди буде розміщено елемент, підсвітиться. Відпустіть кнопку миші, щоб розташувати елемент.

Стилізація та змінення елементів

Наведіть курсор миші на будь-який елемент у вашому контенті, і над ним з’являться контури та панелі інструментів.

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

Ви також можете натиснути кнопку на панелі інструментів для виконання швидких дій над елементом. Натискання на піктограму шестерні на панелі інструментів відкриє інспектор властивостей, який містить додаткові параметри.

Інспектор властивостей

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

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

Інспектор властивостей містить багато різноманітних налаштувань для різних елементів, тому обов’язково ознайомтеся з ними всіма.

Використання шорткодів

Page Builder Sandwich відображає справжні шорткоди у фронтенді, і ви також можете легко їх редагувати!

Якщо ви пам’ятаєте свої шорткоди, ви можете вставити їх, ввівши безпосередньо у свій вміст. Але якщо ви не пам’ятаєте їх усі (та й хто взагалі це робить?), інспектор містить список усіх шорткодів, доступних на вашому сайті. Перетягніть кнопку Шорткод з інспектора у вашу область вмісту, знайдіть потрібний і клацніть по ньому, щоб вставити.

Шорткоди відтворюються як реальний вміст на фронтенді; щоб відредагувати їх, виберіть потрібний і перегляньте його атрибути в інспекторі. Або ж, для більшого контролю, двічі клацніть на шорткод, щоб відредагувати його у вихідному вигляді. Після внесення змін ваш шорткод оновиться відповідно до них.

Зміна порядку вмісту

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

Збереження вашої роботи

Коли результат вас влаштує, просто натисніть кнопку збереження у верхньому лівому куті сторінки. Ось і все!