Існують десятки й десятки конструкторів сторінок, і ви, напевно, запитуєте себе: що ж такого особливого в Page Builder Sandwich? Навіщо взагалі ним користуватися, якщо у вас уже є один під рукою?
У цій статті я перелічу кілька ключових функцій Page Builder Sandwich, які роблять його унікальним і справжнім мастхевом як для творців контенту, так і для дизайнерів. Якщо ви не знаєте, що таке конструктор сторінок і навіщо він вам потрібен, не хвилюйтеся, у нас є матеріали, які можуть вам допомогти.
1. Ви не просто бачите візуальне представлення вашого вмісту — ви бачите та редагуєте сам контент
В інших конструкторах сторінок ви бачите області, які лише представляють ваш контент. Ви переважно компонуєте вміст за допомогою блоків і прямокутних форм, і результат більше схожий на каркас того, як ваш контент зрештою виглядатиме на сторінці. Це призводить до постійного натискання кнопки попереднього перегляду, лише щоб побачити результат.
З Page Builder Sandwich усе редагування відбувається безпосередньо у фронтенді вашого сайту, і ви редагуєте свій контент напряму для справжнього досвіду «що бачиш, те й отримуєш» (WYSIWYG).
2. Швидке та просте пряме редагування без усіх цих надокучливих спливаючих вікон
Спливаючі вікна (попапи) стали невіддільною частиною конструкторів сторінок. У більшості з них, якщо ви хочете змінити будь-що в макеті — чи то заголовок, напис на кнопці чи невеликий слоган — вам спочатку потрібно дочекатися відкриття спливаючого діалогового вікна і вже всередині нього вносити зміни.
Ми поставили собі за мету максимально мінімізувати використання спливаючих вікон у Page Builder Sandwich. Завдяки відмові від попапів редагування будь-якого вмісту стало простішим і плавнішим, ніж будь-коли.
Редагування виконується абсолютно прямолінійно: клацніть по тексту, щоб встановити курсор, і починайте друкувати. Вам більше не потрібно чекати на спливаюче вікно з редактором TinyMCE, щоб почати вносити правки. Найкраще те, що ви все ще можете перетягувати свій контент.
Ще однією інновацією, яка забезпечує безпроблемне редагування, є постійно доступний інспектор. Інспектор служить вашою панеллю інструментів і редактором властивостей. Інструменти для форматування контенту: кольори тексту, заголовки, налаштування розміру шрифту, зовнішні та внутрішні відступи, рамки, цитати та багато іншого доступні в один простий клік.

3. Повторне використання функціоналу WordPress
Ще одна річ, яку ми помітили в інших конструкторах сторінок, — це те, що вони часто винаходять колесо заново. Деякі впроваджують власні палітри вибору кольору, завантажувачі зображень, генератори галерей та різноманітні інші інструменти. У цьому як такому немає нічого поганого, але WordPress — це справжня скарбниця фрагментів коду, то чому б їх не використати?
WordPress — це величезна і чудова платформа, яка містить безліч класних інструментів, створених купою чудових контриб’юторів. Page Builder Sandwich максимально використовує функціонал, який уже вбудований у WordPress.
Замість власного вибору кольору ми використовуємо палітру Iris. Замість власного завантажувача зображень ми використовуємо медіабібліотеку (media manager). Крім того, є ще backbonejs, underscorejs, wp.hooks і wp.shortcode, якщо назвати лише кілька корисних скриптів. Ми використовуємо їх усі, і це полегшило нам життя, а також зробило кодову базу більш стабільною.
Повторне використання функціоналу WordPress принесло й кілька чудових сюрпризів. Наприклад, оскільки ми використовували медіабібліотеку для вставки зображень, приємною несподіванкою стало те, що ми відразу змогли працювати з галереями WordPress, списками відтворення відео та аудіо, а також зовнішніми URL-адресами з коробки. Ми також могли просто використовувати медіабібліотеку для редагування зображень, що позбавило від годин непотрібного головного болю під час розробки.
4. Навігація за допомогою клавіатури та гарячі клавіші
В інших конструкторах сторінок миша — ваш найкращий друг. Ви перетягуєте нею елементи та двічі клацаєте по них для редагування. Але клавіатурою часто нехтують.
Наприклад, у деяких конструкторах неможливо легко відредагувати текст на один абзац/розділ вище поточного місця редагування, оскільки вам доведеться вийти зі спливаючого діалогового вікна і клацнути в нове. У Page Builder Sandwich ви можете переміщатися за допомогою клавіатури. Натискайте клавіші зі стрілками для навігації між елементами вмісту — це працює, навіть якщо інший контент захований усередині іншого рядка чи стовпця.
Ще однією важливою функцією є гарячі клавіші скасування (undo) та повторення (redo). Спочатку це може здатися дрібницею, але подумайте ось про що: що, як ви випадково перетягнули вміст не туди? У деяких конструкторах сторінок вам доведеться перетягувати його назад на початкове місце. У Page Builder Sandwich працюють і скасування, і повторення. Тож незалежно від того, чи хочете ви виправити надруковане, чи повернути назад перетягнутий контент (або декілька елементів), просто натисніть комбінацію для скасування або повторення. Скасування та повторення працюють як для перетягнутого вмісту, так і для зміни властивостей, таких як розміри шрифтів чи відступи рядків. Це робить їх потужними інструментами у вашому арсеналі редагування.

5. Справжній фронтенд-конструктор сторінок — більш спокійний і безтурботний процес редагування
Під час розробки ми керувалися тим, що редагування у фронтенді не повинно створювати відчуття, ніби ви все ще працюєте з інструментами бекенду. Не повинно бути відчуття, ніби конструктор спочатку створили для бекенду, а потім просто перенесли у фронтенд.
Загалом, для мене головна відмінність Page Builder Sandwich полягає в тому, що ми створили його з метою бути «справжнім» фронтенд-конструктором сторінок — переосмисленням того, яким має бути редагування наживо.