Page Builder Sandwich має бути сумісним із різними модулями Jetpack.
Модуль Markdown виконує особливі дії під час збереження вмісту, через що зміни втрачаються під час перетворення markdown. Щоб упоратися з цим, текст markdown у бекенд-редакторі перетворюється на теги html під час збереження змін із фронтенду. (Дякуємо Джейку Джексону за допомогу)
Ми протестували Page Builder Sandwich з PHP 7, і все має працювати належним чином без будь-яких проблем.
Будьте обережні під час оновлення вашого сайту зі старішої версії до PHP 7, оскільки існує багато несумісностей зі старішими версіями, які необхідно врахувати в усіх ваших темах і плагінах.
Виникає помилка Javascript, коли Page Builder Sandwich & Materialize використовуються разом. Існує конфлікт між materialize.js та інструментом вибору кольору ядра WordPress.
У репозиторії Materialize на GitHub створено повідомлення про цю проблему: https://github.com/Dogfalo/materialize/issues/2821
Плагін продовжуватиме працювати належним чином, доки ви не деактивуєте ліцензію на своєму сайті. Щойно ви деактивуєте її, ви не зможете активувати її знову.
Ви не зможете отримувати оновлення з панелі керування WordPress або мати доступ до новіших версій. Ми не зможемо надавати вам чудову індивідуальну підтримку.
Додавати віджети можна, натиснувши кнопку Елемент віджета у розділі Елементи в інспекторі. Після натискання має з’явитися спливаюче вікно зі списком усіх віджетів, які Page Builder Sandwich знайшов на вашому сайті.
Усі віджети, знайдені на вашому сайті WordPress, можна додати, проте деякі віджети, що використовують спеціалізований/кастомний код Javascript у своїх налаштуваннях, можуть працювати некоректно. Віджети, які використовують наступне, можуть не працювати:
Стандартні віджети WordPress і створені подібним чином віджети повинні працювати без проблем.
Якщо вам дійсно потрібно, щоб саме цей віджет працював, є спосіб обійти цю проблему.
Ви можете використати плагін Custom Sidebars від WPMU Dev, щоб створити новий сайдбар / область віджетів, додати туди свій віджет звичайним способом у меню Вигляд > Віджети. Потім у Page Builder Sandwich додайте Елемент сайдбара і виберіть сайдбар, який містить потрібний вам віджет.
Інша альтернатива — відтворити бажаний ефект за допомогою різноманітних елементів і стилів, доступних у Page Builder Sandwich.
Коли ви вперше купуєте Page Builder Sandwich, .zip-файл із плагіном автоматично завантажиться на ваш комп’ютер.
Якщо ви його загубите, ви можете завантажити свій .zip-файл знову, перейшовши за цим посиланням: https://dashboard.freemius.com/license-recovery/203/page-builder-sandwich/
Введення вашої ліцензії за цим посиланням дозволить вам отримати .zip-файл Page Builder Sandwich разом із вашою ліцензією та даними облікового запису.
Технічно це має працювати з будь-якими темами без винятку.
Разом із нашими користувачами та клієнтами ми успішно використовували Page Builder Sandwich із багатьма темами, зокрема темами з репозиторію WordPress.org, Genesis Themes, StudioPress Themes, Elegant Themes та темами з ThemeForest.
Проте інколи ваша тема може робити щось нестандартне, що перешкоджатиме належній роботі Page Builder Sandwich. Якщо таке станеться, будь ласка, надішліть нам запит на підтримку, і ми спробуємо це виправити.
Існують тисячі тем та інших плагінів. Тому, хоча ми намагаємося бути обережними та створювати все відповідно до стандартів, іноді щось може піти не так.
Якщо ви виявили, що Page Builder Sandwich працює некоректно у вашій системі, ось кілька кроків, які ви можете зробити для усунення проблеми.
Ознайомтеся зі статтею тут: Кнопка «Edit with Page Builder Sandwich» не з’являється Якщо це не вирішить проблему, читайте далі.
Перегляньте різні статті в категорії усунення несправностей у документації.
WordPress, ваші плагіни, ваша тема і навіть Page Builder Sandwich. Завжди корисно оновлюватися. Переконавшись, що все оновлено, ви отримаєте найновіші виправлення помилок та вразливостей для вашого сайту.
Якщо ви не можете редагувати свій вміст за допомогою Page Builder Sandwich (і, ймовірно, з’явилося спливаюче вікно з помилкою), можливо, вміст поточної сторінки повністю згенеровано вашою темою або плагіном. Щоб перевірити це, відредагуйте свою сторінку/допис у панелі керування звичайним способом за допомогою WordPress, а потім перевірте, чи відображається збережений вміст на сайті. Якщо він не з’являється, це означає, що вміст сторінки/допису повністю згенерований і його неможливо редагувати за допомогою PBS.
Іноді плагін може конфліктувати з Page Builder Sandwich. Щоб перевірити, який плагін може спричиняти конфлікт, деактивуйте плагін і перевірте, чи PBS знову працює. Зробіть це для кожного з ваших активованих плагінів. Якщо PBS знову починає працювати і ви можете редагувати свої сторінки, це означає, що щойно деактивований плагін несумісний із PBS. У таких випадках зв’яжіться з нами електронною поштою за адресою [email protected] і повідомте про це, щоб ми могли це виправити.
Якщо деактивація плагінів не допомогла, спробуйте перемкнути тему на стандартну тему WordPress (теми Twenty-Something). Якщо ви знову зможете редагувати свій вміст за допомогою Page Builder Sandwich, значить тема, яку ви використовуєте, несумісна з PBS. Надішліть нам цю інформацію електронною поштою на адресу [email protected] і повідомте про це, щоб ми могли це виправити.
У рідкісних випадках розширення браузера може заважати належній роботі коду Javascript на вебсайті. Щоб перевірити, чи розширення браузера не спричиняє проблем, відкрийте браузер у режимі анонімного перегляду (Chrome) або у приватному режимі та спробуйте відкрити PBS — це відкриє нову вкладку без жодних розширень. Якщо це спрацює, значить, одне з розширень конфліктує.
Було виявлено, що розширення для браузера PageXray спричиняє проблеми.
Видалення елементів у Page Builder Sandwich зазвичай здійснюється простим виділенням тексту або елемента з подальшим натисканням клавіші Delete або Backspace.
Інший варіант — натиснути кнопку видалення в інспекторі:
У деяких випадках це не працює. Елементи, для яких це не спрацьовує, зазвичай є контейнерами, такими як рядки, колонки або каруселі. Це зроблено для запобігання випадковому видаленню під час роботи з контентом.
Щоб видалити такі елементи, натисніть кнопку видалення у властивостях елемента в інспекторі. Наприклад, щоб видалити рядок, вам потрібно скористатися цією областю:
Page Builder Sandwich тепер доступний такими мовами:
Якщо ви бажаєте допомогти у створенні Page Builder Sandwich, переклавши його вашою мовою, перейдіть на нашу сторінку Transifex!
Додавати зображення дуже просто. Ви можете:
Раніше існувала проблема, пов’язана з NextGen та Page Builder Sandwich.
До версії 2.12 PBS певним чином викликав у NextGen повідомлення про помилку, через яке на вашому сайті з’являвся порожній білий екран. Це було виправлено у версії 2.12, тому, якщо ви користуєтеся старішою версією, будь ласка, оновіться.
Ми подбали про те, щоб Page Builder Sandwich мав майже нульовий вплив на продуктивність вашого вебсайту. Коли ви не ввійшли в систему, щонайменше, підключаються лише стилі CSS для рядків і стовпців, разом із необхідними скриптами JS і CSS для використаних вами шорткодів.
Markdown — це, по суті, синтаксис, який ви вводите під час редагування, щоб додати або змінити форматування вашого тексту. Це схоже на комбінації клавіш, але замість натискання комбінації ви вводите спеціальні символи.
Нижче наведено список усіх підтримуваних синтаксисів Markdown у Page Builder Sandwich.
## Заголовок 2
### Заголовок 3
і так далі до:
###### Заголовок 6
> Цитата
(4 пробіли)Попередньо відформатований текст/код
* Маркований список - Маркований список
1. Нумерований список 1) Нумерований список
- ------------------------------(або кілька дефісів)
Введення URL-адрес автоматично перетворюється на посилання:
Перейдіть на https://pagebuildersandwich.com
Перейдіть на [Page Builder Sandwich](https://pagebuildersandwich.com
Шорткоди можна вставляти або вводити вручну під час редагування. Після того, як ви ввели шорткод, натисніть enter або вийдіть за межі шорткоду, і він одразу має відобразитися у своєму згенерованому вигляді.
Інший спосіб додавання шорткодів — натиснути на елемент «Шорткод» в інспекторі. Відкриється спливаюче вікно зі списком усіх шорткодів, доступних на вашому сайті. Виберіть потрібний або двічі клацніть на будь-якому з них, щоб вставити його.
Редагувати шорткоди можна двома способами:
Атрибути шорткоду не можуть бути виявлені Page Builder Sandwich. Тому вам доведеться вводити їх вручну. Ми працюємо над способом зіставлення шорткодів у системі, щоб спростити цей процес для всіх. Слідкуйте за оновленнями.
Ви можете вбудовувати вміст із різних сайтів, як-от відео YouTube, відео Vimeo, фотографії Instagram, фотографії Flickr, твіти та навіть коментарі Reddit, просто вставивши прямі посилання на них.
https://www.youtube.com/watch?v=dQw4w9WgXcQ
Список підтримуваних URL-адрес для вбудовування можна знайти в кодексі WordPress: https://codex.wordpress.org/Embeds
Ви також можете встановити інші плагіни, які додають підтримку додаткових URL-адрес для вбудовування. Наприклад, URL-адреси Wistia не підтримуються у WordPress за замовчуванням; ви можете встановити їхній плагін, щоб увімкнути вбудовування, після чого PB Sandwich також зможе з ними працювати.
Зверніть увагу: щоб це спрацювало, окремий рядок тексту має містити лише URL-адресу.
Ви також можете вставляти коди для вбудовування безпосередньо.
Коди для вбудовування виглядають так:
<iframe width="420" height="315" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen></iframe>
Зверніть увагу: щоб це спрацювало, окремий рядок тексту має містити лише код для вбудовування.
Натисніть на інструмент «Додати медіафайл», а потім вставте URL-адресу на вкладці «Вставити з URL-адреси».
За допомогою Page Builder Sandwich ви можете редагувати лише вміст сторінок, дописів та користувацьких типів дописів.
Однак ви не можете редагувати файли шаблонів тем, такі як:
Погляньте на це так: якщо на вашій панелі адміністрування на сайті є кнопка «Редагувати допис» або «Редагувати сторінку», то сторінка має бути доступною для редагування.
Ви можете вбудовувати вміст із різних сайтів, таких як відео YouTube, відео Vimeo, твіти та навіть коментарі Reddit, вставляючи їхні постійні URL-посилання в Page Builder Sandwich.
Зверніть увагу, що весь рядок тексту має містити лише URL-адресу
Page Builder Sandwich працює разом із функцією oEmbed у WordPress. Тому URL-адреси, які можна вбудовувати в панелі керування, мають підтримуватися. Плагіни, які додають підтримку додаткових провайдерів oEmbed, також повинні працювати.
Список провайдерів oEmbed можна знайти в кодексі: https://codex.wordpress.org/Embeds
У версії premium Page Builder Sandwich ви можете використовувати власні SVG / векторні іконки. Ось як це зробити:
Завантажені іконки також можна використовувати як маркери у маркованих списках та як іконки на кнопках.
Примітка: якщо ваша іконка не з’являється у результатах пошуку, можливо, назва файлу не була належним чином розпізнана PBS. У таких випадках ви можете використовувати терміни “custom” або “upload”, щоб знайти завантажені іконки.
Page Builder Sandwich створювався так, щоб бути якомога менш нав’язливим, тому інші плагіни мають без проблем співіснувати з нашим.
Однак іноді бувають винятки. Нижче наведено список плагінів, які мають певні особливості під час роботи разом із Page Builder Sandwich. Це не обов’язково означає, що вони не працюють або є несумісними, а лише те, що деяка поведінка може відрізнятися.
Ми продовжимо оновлювати цей список. Якщо ви щось помітили, не соромтеся надіслати тікет у службу підтримки на [email protected]
Перевірити, чи ввімкнено PBS та чи перебуває він у режимі редагування.
if ( PBSEditor.isEditing() ) {
// Зробити щось під час редагування.
}
Немає.
Boolean. True, якщо наразі триває редагування, false, коли редагування не відбувається.
Використовується всередині iframe, який застосовується PBS для відображення адаптивного вигляду під час редагування. Викликається безпосередньо перед закриттям тегу <head> і може використовуватися для додавання скриптів і стилів.
Немає.
add_action( 'pbs_iframe_header', 'change_bg_color' );
function change_bg_color() {
?>
<style>
body {
background-color: hotpink;
}
</style>
<?php
}
Якщо у вас виникли труднощі, ми тут, щоб допомогти! Але спершу, будь ласка, перегляньте сторінки документації — можливо, ви знайдете відповідь там і заощадите час.
Надсилайте ваші запити до служби підтримки на [email protected]
Ви можете запобігти відображенню PB Sandwich у фронтенді за допомогою фільтра pbs_is_editable_by_user.
Наприклад, щоб зупинити відображення PB Sandwich у довільному типі записів із ярликом slider, ви можете додати цей фрагмент коду до свого functions.php
add_filter( 'pbs_is_editable_by_user', 'stop_pbs_in_sliders' );
function stop_pbs_in_sliders( $editable ) {
if ( is_singular( 'slider' ) ) {
return false;
}
return $editable;
}
Щоб зупинити PB Sandwich для конкретної сторінки/запису, ви можете використати ID запису для перевірки:
add_filter( 'pbs_is_editable_by_user', 'stop_pbs_for_123' );
function stop_pbs_for_123( $editable ) {
global $post;
if ( is_singular() && ! empty( $post ) ) {
if ( '123' === $post->ID ) {
return false;
}
}
return $editable;
}
PBS надсилає статистику використання для користувачів, які дали згоду, щоразу, коли вони зберігають зміни в редакторі PBS. Цей фільтр можна використовувати, щоб припинити надсилання даних.
$true
Boolean. Це завжди true.
Спрацьовує, коли користувач перемикається між різними адаптивними режимами перегляду.
Немає.
Якщо у вас виникли труднощі, ми тут, щоб допомогти! Але спершу, будь ласка, перегляньте сторінки документації, можливо, ви знайдете відповідь тут і заощадите час.
Надсилайте свої запити на підтримку на електронну пошту [email protected]
$all_shortcodes = PageBuilderSandwich::get_all_shortcodes()
Немає.
Array. Масив усіх виявлених тегів шорткодів.
PBS >= 4.3
PBS додає обгортку для визначення області вмісту публікації. Це викликається до розміщення обгортки.
$content
String. Вміст публікації із застосованою обгорткою.
Використовується всередині iframe, який застосовується PBS для рендерингу адаптивного вигляду під час редагування. Викликається безпосередньо перед закриттям тегу <body> і може використовуватися для додавання скриптів та стилів.
Немає.
PBS >= 4.3
Перевизначає рішення про те, чи завантажувати PBS у фронтенді та чи дозволяти користувачеві використовувати PBS для редагування публікації.
$is_editable
Boolean. True, якщо публікація має бути доступною для редагування за допомогою PBS. В іншому випадку — False
Заборонити редагування типів публікацій portfolio за допомогою PBS
add_filter( 'pbs_is_editable_by_user', 'disallow_portfolios' );
function disallow_portfolios( $is_editable ) {
global $post;
if ( $post ) {
if ( 'portfolio' === get_post_type( $post ) ) {
return false;
}
}
return $is_editable;
}
PBS >= 4.3
Отримує екземпляр PageBuilderSandwich
$pbs = PageBuilderSandwich::instance()
Немає.
Об’єкт PageBuilderSandwich. Поточний екземпляр класу PBS.
PBS додає обгортку для визначення області вмісту публікації. Це викликається після того, як обгортка була розміщена.
$content
Рядок. Вміст публікації із застосованою обгорткою.
PageBuilderSandwich::is_editable_by_user()
Немає.
Boolean. True, якщо PBS може редагувати запис, інакше false.
Фільтр для зміни стилів CSS, що зберігаються для допису. Викликається, коли збереження було ініційовано з редактора PBS.
$style
Рядок. Стилі CSS, надіслані для збереження.
$post_id
Ціле число. ID допису, який ми зберігаємо.
Викликається, коли редактор PBS завершує завантаження (не викликається, коли користувач натискає кнопку початку редагування)
Зробити щось після завантаження PBS
wp.hooks.addAction( 'pbs.init', function() {
console.log( 'PBS is ready!' );
}
Список тегів шорткодів, які слід приховати у засобі вибору шорткодів PBS. Використовуйте це, якщо у вас є шорткоди, які відображаються у спливаючому вікні вибору, але ви їх уже застаріли або просто хочете приховати від користувачів.
$shortcodes
Array. Масив тегів шорткодів.
Приховати шорткод із засобу вибору.
add_filter( 'pbs_shortcodes_to_hide_in_picker, 'hide_embed_shortcode' );
function hide_embed_shortcode( $shortcodes ) {
$shortcodes[] = 'embed';
return $shortcodes;
}
Додає властивості Javascript до об’єкта pbsFrontendParams на фронтенді. Об’єкт pbsFrontendParams доступний на фронтенді незалежно від того, коли користувач увійшов у систему та редагує.
$params
Array. Масив ключів і значень, які стануть доступними у змінній Javascript рівня вікна pbsFrontendParams
Зробити змінну доступною на фронтенді
add_filter( 'pbs_localize_frontend_scripts, 'add_my_property' );
function add_my_property( $params ) {
// This will be available in Javascript under pbsFrontendParams.myProperty
$params['myProperty'] = 'My Property';
return $params;
}
Основна частина Page Builder Sandwich написана на Javascript, і ми додали безліч методів, щоб розробники могли розширювати та додавати більше функціональності до нашого конструктора сторінок.
Щоб полегшити роботу розробникам, ми організували все за зразком WordPress — через хуки!
У WordPress для зміни чи розширення поведінки WP зазвичай використовуються функції add_filter() та add_action(). Аналогічно в PBS ви можете використовувати wp.hooks.addFilter() та wp.hooks.addAction().
Спосіб їх використання також однаковий: використовуйте фільтри для зміни даних, а дії — для виконання додаткових операцій. Ці два виклики функцій по суті такі ж самі, як і їхні аналоги в PHP, за винятком того, що вони працюють у Javascript.
Щоб уникнути плутанини між хуками PHP та Javascript, ми назвали хуки Javascript у стилі «period-case» (вигаданий термін). Усі хуки PHP використовують snake case:
Зверніться до категорій Javascript Actions та Javascript Filters у лівому меню, щоб переглянути всі хуки.
Для тих, кому цікаво: ми використовуємо https://github.com/carldanley/WP-JS-Hooks, щоб додати ці зручні виклики хуків у Javascript
Викликається безпосередньо перед тим, як редактор зберігає вміст. Ви можете використовувати це, щоб розмістити додаткові дані для надсилання під час збереження (це не зберігає дані, а лише надсилає їх через Ajax на бекенд)
payload
Об’єкт FormData. Дані, надіслані через Ajax для збереження.
wp.hooks.addAction( 'pbs.save.payload', function( payload ) {
// Додайте дані для надсилання під час збереження.
payload.append( 'my_data', 'My Data' );
}
Додає властивості Javascript до об’єкта pbsParams у фронтенді. Об’єкт pbsParams доступний у фронтенді, коли користувач авторизований та має права на редагування сторінки.
Ця змінна також містить багато властивостей, які використовуються PBS під час редагування, таких як nonces (одноразові числа), список усіх завантажених шорткодів та рядки перекладу.
$params
Array. Масив ключів і значень, які стануть доступними у змінній Javascript рівня вікна pbsParams
Додати невиявлений шорткод до редактора
add_filter( 'pbs_frontend_scripts, 'add_my_shortcode' );
function add_my_shortcode( $params ) {
$params['shortcodes'][] = 'my_shortcode';
return $params;
}
Додати скрипт або стиль у чергу разом із PBS. Це викликається лише тоді, коли запис доступний для редагування за допомогою PBS. Якщо сторінка не доступна для редагування за допомогою PBS, це взагалі не використовується.
Немає.
Коли завантажується PBS, також додати в чергу my-script.js
add_action( 'pbs_enqueue_scripts, 'add_my_script' );
function add_my_script() {
wp_enqueue_script( 'my-script' , plugins_url( 'js/my-script.js', __FILE__ ) );
}
Якщо ви не можете знайти, куди зберегли свою копію преміум-плагіна, ви можете перейти сюди та ввести свою адресу електронної пошти, щоб відновити його. Плагін буде надіслано вам електронною поштою.
https://dashboard.freemius.com/license-recovery/203/page-builder-sandwich/
Це преміум-функція, доступна у версії 4.0.1+
Якірні посилання з прокручуванням на тій самій сторінці — це посилання, які вказують на певне місце на тій самій сторінці. Коли ви натискаєте на посилання на тій самій сторінці, ваш браузер прокручуватиметься до вказаної ділянки.
Щоб створити якірне посилання на тій самій сторінці, вам знадобляться дві речі:
Виберіть будь-який елемент унизу вашої сторінки та відкрийте його властивості. У розділі додаткових параметрів додайте користувацький клас або користувацький ID із назвою ” go_here“
Тепер створіть посилання або додайте елемент кнопки десь угорі вашої сторінки. Замість додавання URL-адреси як посилання використовуйте ” .go_here” (з крапкою), якщо ви додали “go_here” як користувацький клас; або використовуйте “#go_here” (зі знаком решітки), якщо ви додали його як користувацький ID.
Після того як ви збережете сторінку, під час натискання на посилання/кнопку вона має плавно прокручуватися до елемента внизу вашої сторінки.
До іменованих якорів, таких як
<a name="go_here"></a>
також можна переходити, додавши посилання на “#go_here” (зі знаком решітки)
Ви також можете націлюватися на будь-які інші ділянки вашої сторінки, навіть за межами області редактора, якщо ви звертаєтеся до них за назвами їхніх класів або ID.
Викликається після збереження вмісту. Це викликається, коли збереження було ініційовано з редактора PBS.
Немає
Фільтр для модифікації даних допису, які зберігаються. Викликається, коли збереження було ініційовано з редактора PBS.
$post_data
Масив. Остаточні дані допису для збереження, які після цього передаються безпосередньо у wp_update_post().
$_POST
Масив. Необроблені дані допису, надіслані з редактора для збереження. Перевірку nonce для них уже пройдено.
$post_id
Int. ID допису, який зберігається.
add_filter( 'pbs_save_content_data', 'save_always_as_draft', 10, 3 );
function save_always_as_draft( $post_data, $_post, $post_id ) {
// З певної причини ми завжди хочемо, щоб допис був чернеткою.
$post_data['post_status'] = 'draft';
return $post_data;
}
Починаючи з версії 4.0, тепер під час редагування ви можете перемикатися між режимами перегляду для комп’ютера, планшета та мобільного телефону! Ми називаємо це адаптивним режимом. В адаптивному режимі розмір вашого сайту зменшується для імітації того, як він виглядатиме на менших екранах.
Під час перегляду сайту у режимах планшета або мобільного телефону ви матимете обмежені можливості редагування. У цих режимах ви можете ТІЛЬКИ:
* PBS застосовує деякі адаптивні стилі до ваших елементів і рядків, тому деякі відступи не можна буде налаштувати.
Ось деякі речі, які ви не можете робити:
Якщо ви переглядаєте свій сайт у режимі планшета або мобільного телефону, будь-які налаштування відступів застосовуються лише до поточного режиму перегляду та до меншого розміру. Це дозволяє вдосконалювати ваші дизайни, щоб вони виглядали краще на менших екранах, окремо від повної версії для комп’ютера.
Ось приклад для більшої ясності.
Це стосується лише налаштувань відступів; зміни тексту або зміни стилів тексту застосовуються для всіх розмірів екрана.
Під час перегляду на планшеті чи мобільному телефоні ваші рядки матимуть нову кнопку на панелі інструментів у вигляді “ока”, яка з’являтиметься під час наведення на них курсора. Натискання цієї кнопки дозволить показати/приховати рядок для поточного розміру екрана.
Приховані рядки стануть дещо прозорими під час редагування, щоб показати, що вони будуть приховані після завершення редагування.
Зверніть увагу, що ця функція доступна лише для рядків.
Якщо ви розробник тем, включення PBS до вашої теми може значно підвищити цінність вашого продукту.
Зв’яжіться з нами за адресою [email protected], співпрацюймо!
CloudFlare — це широко використовуваний безкоштовний сервіс DNS CDN. Він чудовий, проте у PBS наразі є проблеми з функцією Rocket Loader. Rocket Loader покращує час завантаження файлів Javascript, але порушує залежності та порядок виклику скриптів PBS. Якщо у вас увімкнено Rocket Loader, кнопка редагування для Page Builder Sandwich не відображатиметься (при цьому жодних помилок у консолі Javascript не з’являється).
Щоб вимкнути Rocket Loader, увійдіть у свій обліковий запис CloudFlare і перейдіть до налаштувань вашого домену. Перейдіть до налаштувань Speed:
Потім прокрутіть униз до налаштувань Rocket Loader і переконайтеся, що цей параметр вимкнено:
Після вимкнення обов’язково очистіть кеш усього вашого сайту в налаштуваннях Cache:
Після повного очищення кешу ви можете оновити сторінку, і тепер кнопка редагування Page Builder Sandwich має з’явитися.
Викликається безпосередньо перед збереженням вмісту. Це викликається, коли збереження було ініційовано з редактора PBS.
Немає
Фільтр для зміни вмісту публікації, що зберігається. Викликається, коли збереження було ініційовано з редактора PBS.
$content
String. Остаточний вміст публікації, що зберігається.
$post_id
Int. Ідентифікатор публікації, яку ми зберігаємо.
Markdown — це, по суті, синтаксис, який ви вводите під час редагування, щоб додати або змінити форматування вашого тексту. Це схоже на гарячі клавіші, але замість натискання комбінації ви вводите символи вручну.
Нижче наведено список усіх підтримуваних синтаксисів Markdown у Page Builder Sandwich.
(Звертайте увагу на пробіли)
# Заголовок1
## Заголовок2
до:
###### Заголовок6
> Цитата
(4 пробіли)Попередньо відформатований текст/код
* Маркований список - Маркований список
1. Нумерований список 1) Нумерований список
- ------------------------------(або кілька дефісів)
Введення URL-адрес автоматично перетворює їх на посилання:
Перейдіть на https://pagebuildersandwich.com
Введіть «lorem» і натисніть tab, щоб створити макетний текстовий вміст.
Якщо під час використання Varnish Cache після збереження змін ви все ще бачите старий вміст, можливо, Varnish Cache не очистився автоматично.
Існують деякі плагіни WordPress, які дозволяють очистити кеш: https://wordpress.org/plugins/search/varnish+cache/
Якщо це не допомогло, ви також можете вручну очистити Varnish Cache, виконавши таку команду в терміналі:
curl -X PURGE http://mysite.com/my-page/
Щоб деактивувати PBS, спершу увійдіть у свою консоль / панель керування, а потім перейдіть до розділу Плагіни > Встановлені плагіни:
Перебуваючи на сторінці плагінів, прокрутіть список плагінів униз і знайдіть Page Builder Sandwich. Одразу під назвою ви побачите посилання деактивувати разом з іншими посиланнями, такими як «Редагувати» або «Змінити ліцензію» (це може відрізнятися на вашому сайті). Натисніть посилання деактивації, щоб вимкнути плагін.
Якщо ви зберегли зміни на своїй сторінці й…
це може означати, що збереження не призвело до очищення збережених даних у вашому рішенні для кешування.
Якщо ви використовуєте певне рішення для кешування — наприклад, плагін кешування на кшталт W3 Total Cache, серверне програмне забезпечення для кешування, як-от Memcached чи Redis, або DNS-кешування, як-от CloudFlare, — можливо, воно не очистило ваш збережений вміст.
Один зі способів перевірити, чи це так, — відредагувати сторінку в панелі керування (звичайним способом), а потім переглянути її на сайті. Якщо вміст не змінився, можливо, ваш кеш не очистився автоматично.
Деякі рішення для кешування поза межами WordPress мають супутній плагін WordPress, який може допомогти скинути або очистити поточний кеш, а рішення для WordPress зазвичай мають для цього відповідні кнопки чи налаштування.
Також можливо, що під час збереження сталася певна помилка PHP.
Щоб перевірити, чи це відбувається, відкрийте консоль розробника (бажано в Chrome), а потім перейдіть на вкладку Network. Опинившись там, збережіть свої зміни в PBS, після чого ви маєте побачити кілька записів до admin-ajax.php. Якщо вони виділені червоним, це вказує на те, що сталася помилка. Перевірте, чи бачите ви щось подібне:
Якщо це так, будь ласка, напишіть нам на адресу [email protected], надавши необхідні облікові дані для входу, щоб ми могли перевірити та виправити це для вас.
Будь ласка, ознайомтеся зі статтею про сумісність із Wordfence тут: http://docs.pagebuildersandwich.com/article/214-wordfence-firewall-setup-compatibility
Примітка: це не стосується клієнтів Envato
Якщо під час активації ліцензії виникають помилки, ось кілька кроків, які варто спробувати..
Здебільшого це трапляється під час оновлення до новішої версії. Якщо ви напряму оновили файли плагіна вручну й пропустили стандартне оновлення або кроки деактивації-активації, деякі процеси могли не виконатися належним чином. Будь ласка, деактивуйте плагін, потім знову активуйте його та спробуйте ввести свою ліцензію ще раз.
Починаючи з версії 3.2, Page Builder Sandwich інтегровано з Freemius. Були випадки, коли очищення даних Freemius усувало помилки активації ліцензії. Ось як це виправити.
Перейдіть до панелі керування та змініть свою URL-адресу на http://yoursite.com/wp-admin/admin.php?page=freemius (не забудьте змінити URL-адресу відповідно до вашого сайту). Якщо ви потрапили на сторінку, показану нижче, отже, ви в потрібному місці.
Натисніть кнопку Delete All Accounts, а потім також натисніть кнопку Clear API Cache. Після цього спробуйте ввести свій ліцензійний ключ знову.
Якщо це не спрацювало, будь ласка, зв’яжіться з нами за адресою [email protected] та повідомте деталі проблеми та інформацію про ваш сайт.
У більшості елементів (проте не в шорткодах) ви можете налаштувати анімацію появи, яка відтворюється, коли елемент стає видимим на екрані.
Для цього наведіть курсор на елемент, щоб з’явилася панель інструментів, а потім натисніть кнопку із зображенням шестірні.
Це відкриє інспектор. Перейдіть до розділу Animations (Анімації), розгорніть його та оберіть анімацію.
Після вибору анімації вона відтвориться для попереднього перегляду. Ви можете додатково налаштувати анімацію за допомогою інших доступних параметрів.
Анімації відтворюються лише тоді, коли користувач прокручує сторінку й елемент потрапляє в поле зору. Якщо елемент уже видимий під час завантаження сторінки, він не анімуватиметься.
Ні, не втратите! Усі ваші сторінки та вміст залишаться на вашому сайті. Це означає, що ви можете безпечно деактивувати PBS під час оновлення з безкоштовної версії до преміум-версії або коли ви просто щось тестуєте.
Однак не все виглядатиме однаково. Ви помітите, що деякі елементи на вашій сторінці зміняться, оскільки PBS містить додаткові стилі та скрипти, необхідні для деяких більш складних елементів.
Ось деякі речі, які залишаться після деактивації PBS:
Ось деякі речі, які зникнуть після деактивації PBS:
Ось я додав рядок із кольором фону, а потім додав у нього зображення. Ось як це виглядає:
Щоб змусити його «визирати» над контейнером, наведіть курсор миші на елемент, який ви хочете перемістити. Потім, коли з’явиться контур, перемістіть мишу за межі верхньої лінії контуру. Має відобразитися поточне значення верхнього відступу (margin):
Натисніть і перетягніть верхній відступ угору, щоб зменшити його, зробивши значення від’ємним:
Тепер зображення «визирає» за межі рядка!
Якщо елемент обрізається, коли він виходить за межі рядка, відкрийте інспектор властивостей для цього рядка та вимкніть параметр overflow hidden у розділі Advanced:
Щоб швидко додати фіктивний текст, введіть слово “lorem” і натисніть tab або enter, щоб швидко додати текст-заповнювач lorem ipsum :
Lorem ipsum dolor sit amet, consectetur adipisicing elit. At dolor sed numquam? Sapiente autem adipisci, minus expedita enim, suscipit laboriosam deleniti possimus sequi pariatur explicabo numquam alias atque officia sit.
Page Builder Sandwich працює з усіма плагінами кешування. Однак у вас можуть виникнути проблеми, якщо увімкнути їхню функцію мініфікації або кешування.
Просто переконайтеся, що мініфікацію вимкнено для авторизованих користувачів, і все має працювати належним чином.
Тут ми показуємо лише налаштування W3 Total Cache, але інші плагіни кешування та мініфікації також повинні мати схожі налаштування.
Переконайтеся, що позначено пункт Don’t cache pages for logged in users у розділі Performance > Page Cache
Якщо ви використовуєте мініфікацію, переконайтеся, що позначено пункт Disable minify for logged in users у розділі Performance > Minify
Якщо ви намагаєтеся перетягувати маркери верхнього чи нижнього зовнішнього або внутрішнього відступу, а відступи елемента не змінюються, можливо, існують інші стилі, які примусово перевизначають будь-які зміни стилю. Це також може траплятися, коли ви не можете змінити фон, межі або коли прозорі зображення завжди отримують колір фону.
Щоб знайти проблему, відкрийте інспектор вашого браузера та перевірте елемент. Перегляньте стилі для цього елемента. Якщо ви бачите щось подібне до цього:
Тоді ви можете бути впевнені, що або ваша тема, або плагін перешкоджає застосуванню будь-яких інших стилів до цього елемента. Наведіть курсор миші на таблицю стилів, щоб дізнатися, з якої теми/плагіна вона походить.
Щоб виправити це, видаліть частину стилю «! important», і ви знову зможете застосовувати стилі. Можливо, вам доведеться звернутися до автора теми чи плагіна, щоб вирішити цю проблему.
Щоб вбудувати вміст із зовнішніх вебсайтів, просто вставте URL-адресу та натисніть Enter. Наприклад, ви можете скопіювати та вставити цю URL-адресу з YouTube:
https://www.youtube.com/watch?v=dQw4w9WgXcQ
Вбудовування через Iframe також можливе шляхом вставлення кодів вбудовування <iframe>. Наприклад, скопіюйте та вставте цей рядок вбудовування:
<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/dQw4w9WgXcQ?rel=0″ frameborder=”0″ allowfullscreen></iframe>
Ви можете вбудовувати URL-адреси із сайтів, перелічених у WordPress Codex: https://codex.wordpress.org/Embeds, а також з будь-якого сайту з підтримкою oEmbed.
Page Builder Sandwich регулярно перевіряє, чи ви все ще авторизовані у WordPress. Це робиться для того, щоб гарантувати збереження ваших змін, коли ви натиснете кнопку збереження. Це також використовується для блокування записів та автозбережень.
Ми покладаємося на WordPress Heartbeat API для виконання наших перевірок, а він, у свою чергу, залежить від файлів cookie та сесій браузера. Тому, якщо під час редагування постійно з’являються ці спливаючі вікна «термін дії сесії минув», можливо, щось заважає WordPress коректно відстежувати вашу сесію. Ось кілька кроків, які допоможуть це вирішити:
Якщо у вас встановлені плагіни кешування, є DNS-кешування або будь-яка інша форма кешу, очистіть їх. Також очистіть кеш браузера. Цілком можливо, що ви отримуєте застарілі скрипти для свого сайту.
Також можливо, що ваші файли cookie були пошкоджені; це легко вирішується очищенням файлів cookie браузера в його налаштуваннях. Зазвичай цей пункт розташований поруч із опцією очищення кешу браузера.
Перейдіть до розділу Налаштування > Загальні та перевірте параметри. Знайдіть налаштування для Адреса WordPress (URL) та Адреса сайту (URL). Домени та протоколи в цих полях мають збігатися з вашим фактичним доменом. Наприклад, якщо в одному вказано «http://», але ви заходите на сайт через «https://», то в налаштуваннях має бути зазначено «https://». Інша поширена проблема полягає в тому, що одна з цих адрес містить «www», а інша — ні.
Вони повинні збігатися:
або:
Щоб це виправити, ви можете змінити параметри в меню Налаштування > Загальні. Якщо ви не можете редагувати ці налаштування, ви можете підключитися через FTP, відкрити файл wp-config.php і додати такі рядки:
define( 'WP_HOME', 'http://example.com' ); define( 'WP_SITEURL', 'http://example.com' );
Примітка: за замовчуванням шапка видаляється лише з головної сторінки.
Щоб видалити шапку або меню з будь-якої зі своїх сторінок, вам знадобиться плагін, який дозволяє додавати власний CSS, наприклад Jetpack.
Щоб видалити шапку, вам знадобиться ID публікації вашого запису, після чого додайте цей власний CSS (замініть тут 9999 на ваш ID публікації):
body.page-id-9999 #masthead {
display: none;
}
Щоб видалити меню зі сторінки (замініть тут 9999 на ваш ID публікації):
body.page-id-9999 #header-wrapper {
display: none;
}
або щоб видалити меню лише з головної сторінки:
body.page-id-9999 #header-wrapper {
display: none;
}
Ви можете додавати фонові зображення до своїх рядків і фонів. Крім того, ви також можете надати фоновому зображенню відтінок певного кольору, щоб воно краще пасувало до вашого дизайну.
Наприклад, тут у мене є рядок із фоновим зображенням і накладеним білим текстом. Зараз цей текст досить важко прочитати через вибране фонове зображення.
Щоб покращити вигляд, ми можемо додати колір до нашого фонового зображення. Для цього наведіть курсор миші на рядок, а потім натисніть значок шестірні рядка, щоб відкрити його властивості. Перейдіть до параметрів Background, а потім увімкніть Background Image Tint.
Після ввімкнення змініть колір фону, і до вашого фонового зображення додасться кольоровий відтінок. Ви також можете змінити насиченість або непрозорість відтінку. Ось мій фон із зеленим відтінком, завдяки чому текст став помітнішим:
| Версія Lite | Недоступно |
| Версія Premium | Доступні всі функції
|
Каруселі — це оригінальний спосіб додавання вмісту, який циклічно з’являється на екрані. Page Builder Sandwich має вбудований елемент каруселі, який можна використовувати без потреби в сторонніх плагінах для каруселей.
Натискання кнопки з шестірнею для елемента каруселі дозволяє налаштувати її поведінку, таку як анімація слайдів, затримка тощо. Під час створення вам надається три слайди каруселі для роботи, з можливістю додавати або видаляти слайди. Усі ці слайди підтримують стандартні елементи, такі як текст, зображення та певні шорткоди.
Перемикатися між слайдами так само просто, як натискати самі кнопки навігації. Порядок слайдів також можна змінити за допомогою властивостей (значок шестірні).
Щоб змінити статус вашої публікації, наведіть курсор миші на стрілку випадного меню на кнопці збереження у верхньому лівому кутку екрана. Це відкриє додаткові параметри збереження.
Якщо ви користуєтеся версією lite, ви могли помітити жовті трикутні прапорці. Вони вказують на те, чи є певна кнопка, елемент або опція преміум-функцією.
Якщо ви хочете приховати їх, перейдіть до консолі, відкрийте сторінку налаштувань у PBSandwich > Settings і позначте опцію Hide Premium Feature Flags
| Версія Lite | Доступні всі функції |
| Версія Premium | Доступні всі функції |
Натисніть на елемент HTML в Інспекторі, щоб додати новий елемент HTML, після чого має з’явитися модальне вікно. Введіть або вставте туди свій HTML-код, а потім натисніть «Зберегти HTML». Тепер ваш HTML має відобразитися всередині редактора.
Наведіть курсор миші на елемент HTML, щоб показати панель інструментів. Ви можете редагувати свій HTML, натиснувши на іконку олівця на панелі інструментів або двічі клацнувши по самому елементу.
Ми не хочемо захаращеного інтерфейсу та прагнули, щоб усе було інтуїтивно зрозумілим і легким для виявлення. Тому, хоча інтерфейс користувача Page Builder Sandwich виглядає просто, він досить потужний, і ви можете робити багато речей під час редагування.
Ви також можете робити багато корисних речей за допомогою курсора миші. Інтерактивні накладення та панелі інструментів з’являються, коли ви наводите курсор миші на різні елементи. Кожен із них виконує різні дії, як-от:
Щойно ви почнете редагувати за допомогою PBS, наведіть курсор миші на заголовок вашої сторінки/допису — навколо нього має з’явитися контур. Натисніть на заголовок, щоб встановити курсор і змінити його.
Інструменти форматування недоступні в області заголовка, ви не можете змінювати його стилі або додавати елементи до заголовка.
Якщо ви не бачите кнопки «Edit with Page Builder Sandwich» на фронтенді свого сайту, ось кілька речей, які ви можете спробувати:
Кнопка редагування для PB Sandwich доступна на панелі адміністратора у вашому фронтенді. Переконайтеся, що панель адміністратора відображається, перейшовши до панелі керування та відкривши розділ Користувачі > Ваш профіль і перевіривши, чи позначено пункт Показувати панель під час перегляду сайту.
Лише дописи, сторінки та власні типи дописів можна редагувати на фронтенді. Ви можете редагувати елементи на фронтенді лише тоді, коли можете редагувати їх за допомогою редактора вмісту WordPress у бекенді. Інші розділи вашого сайту (наприклад, список дописів блогу на головній сторінці, список усіх дописів, списки категорій, сторінки 404, сторінки пошуку) є динамічними сторінками, створеними WordPress разом із темою, яку ви використовуєте, і їх не можна редагувати за допомогою PB Sandwich.
Однією з ознак того, що поточну вебсторінку можна редагувати, є наявність пункту «Редагувати допис» або «Редагувати сторінку» на панелі адміністратора.
Якщо ваша сторінка/допис динамічно генерується темою або плагіном, її не можна буде редагувати за допомогою Page Builder Sandwich (і, найімовірніше, в інших конструкторах сторінок також). Якщо ви помітили, що редактор вмісту в бекенді порожній, але під час перегляду сторінки на фронтенді вона заповнена вмістом, це явна ознака того, що ваша сторінка згенерована динамічно.
Щоб перевірити, чи ваша сторінка генерується динамічно, перегляньте вихідний код вашої вебсторінки (клацніть правою кнопкою миші та виберіть «Переглянути джерело сторінки»). Знайдіть текст «pbs-main-wrapper»: якщо ви ніде не бачите цього тексту, отже, ваша сторінка генерується динамічно.
Ось кілька прикладів динамічно згенерованого вмісту:
Були випадки, коли тема взагалі не відображала вміст, якщо він порожній, і через це PBS помилково вважав, що сторінку не можна редагувати. Щоб перевірити, чи це так, відредагуйте свою сторінку/допис у бекенд-редакторі, спробуйте додати будь-який текст у свій вміст (наприклад, «hello»), а потім натисніть кнопку «Edit with Page Builder Sandwich» звідти.
Дякуємо Mathias Hellquist за цю підказку!
Деякі конструктори сторінок змушують обирати між стандартним редактором вмісту WordPress та власним редактором конструктора. Якщо ви вже редагували свою сторінку за допомогою іншого конструктора сторінок, можливо, цей конструктор уже «привласнив» вміст, і інші хуки/фільтри вмісту більше не можуть виконуватися. Через це іноді Page Builder Sandwich не може визначити, де знаходиться ваш вміст, і не показує кнопку редагування, оскільки немає чого редагувати.
Щоб це виправити, просто відмовтеся від використання цього конструктора сторінок для цієї конкретної сторінки/допису та виберіть використання стандартного редактора вмісту WordPress.
Переконайтеся, що ви маєте права на редагування сторінки
Кнопка редагування не з’явиться, якщо ви не можете редагувати сторінку. Наприклад, якщо ви є редактором або автором і можете писати дописи блогу та статті на сайті, це не обов’язково означає, що ви можете редагувати головну сторінку або сторінку контактів. Якщо ви бачите кнопку «Редагувати допис» на панелі адміністратора, ви також повинні мати можливість редагувати його за допомогою PB Sandwich. Зверніться до адміністратора сайту за правами редагування, якщо вони вам потрібні.
PB Sandwich активно використовує Javascript. Якщо виникають помилки Javascript через інші скрипти на вашому сайті, це може перешкоджати роботі PB Sandwich. Щоб перевірити, чи це так, ви можете відкрити консоль розробника у своєму браузері та перевірити наявність помилок.
Я рекомендую використовувати для цього Chrome. Клацніть правою кнопкою миші на будь-якому місці сторінки, а потім виберіть пункт «Перевірити». Це відкриє нову панель у нижній частині вашого браузера; перейдіть на вкладку «Console». Якщо у вас є помилки, ви побачите щось на зразок цього:
Якщо у вас справді є помилка, ви також можете дізнатися, звідки вона походить, натиснувши або навівши курсор миші на назву скрипту:
Ці помилки можуть походити з вашої теми або інших плагінів, які ви використовуєте. Виправлення цих помилок може відновити роботу PB Sandwich.
Якщо ваша тема чи один із ваших плагінів викликає помилку Javascript, будь ласка, повідомте нам про це електронною поштою на адресу [email protected], і ми зробимо все можливе, щоб вирішити цю проблему 🙂
CloudFlare — це широко використовуваний безкоштовний DNS CDN. Це чудовий сервіс, але наразі PBS має проблеми, коли йдеться про функцію Rocket Loader. Rocket Loader покращує час завантаження файлів Javascript, але порушує залежності та порядок виклику скриптів PBS. Якщо у вас увімкнено Rocket Loader, кнопка редагування для Page Builder Sandwich не з’явиться (і жодних помилок у консолі Javascript не відображатиметься).
Щоб перевірити, чи використовує ваш сайт Rocket Loader від CloudFlare, перегляньте вихідний код вашої вебсторінки (клацніть правою кнопкою миші та виберіть «Переглянути джерело сторінки»), а потім виконайте пошук за текстом «rocketscript»: якщо ви знайдете цей текст, отже, Rocket Loader увімкнено.
Прочитайте статтю про сумісність із CloudFlare та Rocket Loader, щоб отримати повні інструкції щодо того, як його вимкнути.
Гаразд, на цьому етапі, якщо жодне з наведених вище рішень не допомогло, можливо, настав час пояснити, чому вона не відображається та що із цим робити. Готові? Поїхали!
Page Builder Sandwich повинен знати, де розміщено вміст вашої сторінки/допису. Ми робимо це, відстежуючи, коли WordPress завантажує вміст допису, і «позначаючи» цю область, щоб після завантаження всього ми могли знайти потрібний вміст.
Іноді деякі плагіни перевизначають або обходять цей процес і натомість намагаються завантажити вміст у свій спосіб. Іноді це нормально, але в певних ситуаціях, особливо коли йдеться про завантаження вмісту основного допису, це може призвести до того, що деякі плагіни перестануть працювати. Коли інший плагін обходить цей процес завантаження, зроблені нами «позначки» можуть бути втрачені, і коли надходить час активації редактора, він більше не може знайти ваш вміст. Тому кнопка редагування не з’являється! Ви також можете виявити, що деякі плагіни, які додають вміст на вашу сторінку (наприклад, плагіни для поширення в соціальних мережах), також можуть перестати працювати саме через це.
Page Builder Sandwich повинен знати де розміщено вміст вашої сторінки/допису, і він робить це, підключаючись до фільтра the_content і додаючи обгортку навколо вашого основного вмісту. Деякі плагіни можуть перевизначати це та замінювати вміст функцією get_the_content() далі за ходом виконання. На жаль, це перешкоджає виклику ВСІХ фільтрів the_content, і тому обгортка PBS губиться. Зміни будь-яких інших плагінів також будуть втрачені.
У використанні get_the_content() як такої немає нічого поганого, але можуть виникнути небажані наслідки, якщо це використовується в основному запиті та всередині шаблону окремого допису замість звичайного виклику the_content(), де запускаються всі фільтри the_content.
Ви можете перевірити відсутність «позначок» Page Builder Sandwich, відвідавши свою сторінку/допис на фронтенді та переглянувши вихідний код сторінки, увійшовши в систему. Пошукайте в коді, чи зможете ви знайти рядок:
data-name="main-content"
Якщо ви можете його знайти, можливо, десь виникла проблема із Javascript; просто повідомте нам тему та плагіни, які ви використовуєте, і ми зможемо це виправити.
Але якщо ви не можете його знайти, цілком можливо, що ваша тема (або плагін, але якщо це сторінка чи допис блогу, то найімовірніше тема) щось робить із вмістом допису. Якщо це так, вам слід зв’язатися з автором теми та повідомити йому про проблему! Ви також можете показати йому наведене вище технічне пояснення «чому», це може допомогти в налагодженні 🙂
Якщо ви впевнено почуваєтеся у роботі з PHP, ви можете спробувати виправити це, знайшовши файл шаблону, який обробляє вміст допису. Одне з рішень, з якими ми стикалися, полягає в заміні викликів:
$content = get_the_content();
на:
ob_start(); the_content(); $content = ob_get_clean();<br>
Примітка: змінна PHP у вас може відрізнятися, але концепція повинна бути такою самою. Якщо це спрацює, також буде краще створити дочірню тему замість внесення цієї зміни безпосередньо у вашу тему. Крім того, через цю зміну можуть виникнути побічні ефекти, тому краще проконсультуватися з автором теми з цього приводу.
Рядки та колонки — це інструменти, які ви можете використовувати для створення розділеного на секції вмісту.
Під час редагування за допомогою Page Builder Sandwich на щойно створеній сторінці/дописі вміст, який ви вводите, розміщуватиметься в одній колонці. Це зручно для написання дописів у блозі, але якщо вам потрібні спеціальні макети для цільових сторінок або сторінок контактів, вам, імовірно, знадобиться макет із 2 колонок або навіть поєднання різних колонок на всій сторінці.
Ви можете додавати рядки та колонки за допомогою цих кнопок в інспекторі:
Після додавання ваш новий рядок буде виділено контуром:
Усередину ваших рядків і колонок можна помістити що завгодно: текст, шорткоди, віджети та навіть додати ще більше рядків і колонок.
Коли рядок (або елемент усередині вашого рядка) вибрано, в інспекторі з’являться додаткові параметри. Ви можете використовувати ці кнопки для подальшої стилізації вашої секції:
Нижче в інспекторі також є додаткові параметри для стилізації ваших колонок.
Ви можете переміщувати рядки в різні місця, натиснувши й утримуючи сам рядок (якщо ви натиснете й утримуватимете елемент усередині нього, перетягуватиметься елемент, а не рядок).
| Версія Lite | Недоступно |
| Версія Premium | Доступні всі функції
|
За бажанням виділіть текст, а потім натисніть на елемент кнопки в інспекторі. Це має відкрити модальне вікно, де ви можете ввести URL-адресу для посилання вашої кнопки. Звідти ви також можете виконати пошук будь-якої наявної вебсторінки вашого сайту.
На відміну від інших елементів, кнопки розміщуються вбудовано (inline), тобто вони розташовуватимуться поруч з іншим текстом (або іншими кнопками). Ви не можете перетягувати окремі кнопки в інші місця, натомість перетягуйте кнопку разом із текстом навколо неї.
Під час редагування, натиснувши на кнопку, ви зможете побачити додаткові параметри стилю в інспекторі. Ви також можете навести курсор миші на кнопки, щоб переглянути URL-адресу, на яку вони посилаються, та інші команди.
Примітка: робіть це, якщо PBS вже встановлено та активовано, і ви бажаєте оновити його за допомогою zip-файлу, завантаженого з сайту або отриманого у вкладенні електронного листа від нас.
Примітка: ми використовуємо інший плагін для виконання оновлень, що дозволяє нам оновити PBS одразу, без необхідності спершу видаляти його.
Перейдіть до Плагіни > Додати новий, а потім у полі пошуку знайдіть плагін «Easy Theme and Plugin Upgrades»
Знайшовши плагін, встановіть та активуйте його.
Після активації плагіна Easy Theme and Plugin Upgrades знову перейдіть до Плагіни > Додати новий, а потім натисніть кнопку Завантажити плагін угорі:
Виберіть і встановіть zip-файл Page Builder Sandwich,
Ось і все. Тепер у вас має бути нова версія PBS.
| Версія Lite | Доступно з обмеженими можливостями стилізації |
| Версія Premium | Доступні всі функції
|
Натисніть на елемент карти, щоб додати карту на свою сторінку. Коли вибрано елемент карти, в інспекторі мають з’явитися налаштування карти. Ви можете ввести координати широти й довготи або адресу в полі розташування в інспекторі, щоб відцентрувати карту на цій області. Там також доступні інші параметри стилізації.
Ви можете додатково взаємодіяти з елементом карти, переміщуючи або масштабуючи (збільшуючи/зменшуючи) карту. Зверніть увагу, що ваші зміни на карті будуть застосовані до елемента.
Користувачі преміум-версії можуть стилізувати карту, вибравши колір для її тонування; інший варіант — скористатися сайтом snazzymaps.com, щоб згенерувати колірні схеми та використовувати їх. SnazzyMaps можна використовувати для створення колірних схем, подібних до цієї: https://snazzymaps.com/style/20053/papuportal-dark. Щоб використати ці колірні схеми, скопіюйте масив стилів Javascript в інспектор.
Висоту карти можна налаштувати, проте ширину карти змінити не можна — вона завжди підлаштовується під максимально доступну ширину. Щоб змінити її розмір, розміщуйте карти всередині рядків і стовпців. Ви також можете налаштувати карти так, щоб вони займали всю ширину вікна браузера.
Page Builder Sandwich не схожий на звичайний конструктор сторінок, він нескладний і простий у використанні.
Ви можете переглянути відео нижче для швидкого ознайомлення.
Спочатку створіть нову сторінку, запис або CPT. Потім відкрийте новий запис або будь-який наявний у фронтенді. PBS — це на 100% фронтенд, вам не доведеться поратися в бекенді.
У верхній частині сторінки (на панелі адміністратора) має бути кнопка «Page Builder Sandwich», натисніть її, щоб розпочати редагування. Зверху з’явиться панель форматування тексту, а збоку — панель додавання елементів. Область вмісту вашої теми тепер є вашим редактором!
За допомогою PBS можна редагувати лише окремі сторінки. Ви не можете редагувати список публікацій блогу або сторінку 404, оскільки вони створюються вашою темою. Записи, сторінки та користувацькі типи записів підтримуються.
А тепер найцікавіше… опинившись у фронтенді всередині редактора, клацніть будь-який текст у своєму вмісті або всередині області вмісту і почніть вводити текст! На відміну від інших конструкторів сторінок, PBS дозволяє редагувати вміст напряму, без потреби відкривати спливаючі діалогові вікна.
Під час редагування область угорі називається Панель форматування тексту. Ця панель містить усі інструменти форматування, які ви використовуватимете для стилізації тексту, як-от: кольори, жирний шрифт, курсив, вирівнювання, додавання посилань, списки та багато іншого. Наведіть курсор на кожну кнопку, щоб дізнатися, що робить цей інструмент.
Наведіть курсор миші на кнопку «Add Elements» у верхньому лівому куті екрана, щоб відобразити Панель додавання елементів. Ви також можете просто перемістити курсор миші до лівого краю екрана, щоб вона з’явилася.
Щоб вставити будь-який елемент, затисніть його кнопкою миші, а потім перетягніть в область вмісту. Область, куди буде розміщено елемент, підсвітиться. Відпустіть кнопку миші, щоб розташувати елемент.
Наведіть курсор миші на будь-який елемент у вашому вмісті, і над ним з’являться контури та панелі інструментів.
Ви можете навести курсор миші на краї контурів, щоб збільшити або зменшити відступи між елементами.
Ви також можете натиснути кнопку на панелі інструментів для виконання швидких дій над елементом. Натискання на піктограму шестірні на панелі інструментів відкриє Інспектор властивостей, який містить додаткові параметри.
Інспектор властивостей надає вам більше контролю над виглядом ваших елементів. Ви можете додавати багато параметрів, як-от тіні, анімації, змінювати кольори карт, радіус меж та багато іншого.
Ви також можете отримати доступ до властивостей батьківських елементів. Наприклад, якщо ви розмістили зображення всередині колонки та відкрили інспектор властивостей, ви можете отримати доступ до властивостей зображення, колонки, в якій воно міститься, і рядка, в якому міститься колонка.
Інспектор властивостей містить безліч різноманітних налаштувань для різних елементів, тому обов’язково ознайомтеся з ними всіма.
Page Builder Sandwich відображає реальні шорткоди у фронтенді, і ви також можете легко їх редагувати!
Якщо ви пам’ятаєте свої шорткоди напам’ять, ви можете вставляти їх, вводячи безпосередньо у вмісті. Але якщо ви не пам’ятаєте їх усі (хто їх узагалі запам’ятовує?), інспектор містить список усіх доступних шорткодів на вашому сайті. Перетягніть кнопку Shortcode з інспектора в область вмісту, знайдіть потрібний і клацніть його, щоб вставити.
Шорткоди перетворюються на реальний вміст у фронтенді; щоб відредагувати їх, ви можете вибрати елемент і переглянути його атрибути в інспекторі. Або для більшого контролю двічі клацніть на шорткоді, щоб відредагувати його у вихідному вигляді. Після внесення змін шорткод оновиться, відображаючи їх.
За допомогою PBS ви можете перетягувати будь-що і переміщати куди завгодно. Коли ви щось перетягуєте, наведіть це на інший елемент сторінки: ви можете розташувати його вище або нижче будь-якого іншого вмісту.
Збереження вашої роботи
Коли ви будете задоволені результатом, просто натисніть кнопку збереження у верхньому лівому куті сторінки. Ось і все!
Ви можете використовувати мишу, щоб швидко переміщати курсор у різні місця вмісту або вибирати різні елементи.
Ви також можете використовувати клавіші зі стрілками на клавіатурі для переміщення курсора по вмісту. Це можна використовувати для переходу вище або нижче рядків.
Працюючи з рядками та стовпцями, ви можете клацати по краях рядків, щоб додавати вміст безпосередньо після або перед рядком. Це особливо корисно, якщо ви маєте кілька вкладених рядків і хочете додати вміст між ними.
Page Builder Sandwich не схожий на типовий конструктор сторінок — він нескладний і простий у використанні.
Ви можете переглянути відео нижче для швидкого ознайомлення.
Спочатку створіть нову сторінку, публікацію або CPT. Потім відкрийте нову або будь-яку наявну публікацію у фронтенді. PBS повністю працює на фронтенді, тому вам не доведеться порпатися в бекенді.
У верхній частині сторінки (на панелі адміністратора) має бути кнопка «Page Builder Sandwich», натисніть її, щоб розпочати редагування. Зверху з’явиться область форматування тексту, а збоку — панель додавання елементів. Тепер область вмісту вашої теми стала вашим редактором!
За допомогою PBS можна редагувати лише окремі сторінки. Ви не можете редагувати список публікацій блогу або сторінку 404, оскільки вони створюються вашою темою. Публікації, сторінки та користувацькі типи записів підтримуються.
А тепер найцікавіше… опинившись у фронтенді всередині редактора, клацніть будь-який текст у вашому контенті або клацніть всередині області контенту та починайте вводити текст! На відміну від інших конструкторів сторінок, PBS дозволяє безпосередньо редагувати вміст без потреби відкривати спливаючі діалогові вікна.
Під час редагування область угорі називається панеллю форматування тексту. Ця панель містить усі інструменти форматування, які ви використовуватимете для оформлення тексту: кольори, жирний, курсив, вирівнювання, додавання посилань, списки тощо. Наведіть курсор на кожну кнопку, щоб дізнатися, що робить цей інструмент.
Наведіть курсор миші на кнопку «Додати елементи» у верхньому лівому куті екрана, щоб відкрити панель додавання елементів. Також ви можете просто перемістити курсор до лівого краю екрана, щоб вона з’явилася.
Щоб вставити будь-який елемент, затисніть його лівою кнопкою миші та перетягніть в область контенту. Область, куди буде розміщено елемент, підсвітиться. Відпустіть кнопку миші, щоб розташувати елемент.
Наведіть курсор миші на будь-який елемент у вашому контенті, і над ним з’являться контури та панелі інструментів.
Ви можете навести курсор миші на краї контурів, щоб збільшити або зменшити відступи між елементами.
Ви також можете натиснути кнопку на панелі інструментів для виконання швидких дій над елементом. Натискання на піктограму шестерні на панелі інструментів відкриє інспектор властивостей, який містить додаткові параметри.
Інспектор властивостей надає більший контроль над зовнішнім виглядом ваших елементів. Ви можете додавати безліч параметрів, таких як тіні, анімація, зміна кольорів карти, радіус заокруглення кутів і багато іншого.
Ви також можете отримати доступ до властивостей батьківських елементів. Наприклад, якщо ви розмістили зображення всередині колонки та відкрили інспектор властивостей, ви зможете отримати доступ до властивостей зображення, колонки, в якій воно міститься, і рядка, в якому розміщена ця колонка.
Інспектор властивостей містить багато різноманітних налаштувань для різних елементів, тому обов’язково ознайомтеся з ними всіма.
Page Builder Sandwich відображає справжні шорткоди у фронтенді, і ви також можете легко їх редагувати!
Якщо ви пам’ятаєте свої шорткоди, ви можете вставити їх, ввівши безпосередньо у свій вміст. Але якщо ви не пам’ятаєте їх усі (та й хто взагалі це робить?), інспектор містить список усіх шорткодів, доступних на вашому сайті. Перетягніть кнопку Шорткод з інспектора у вашу область вмісту, знайдіть потрібний і клацніть по ньому, щоб вставити.
Шорткоди відтворюються як реальний вміст на фронтенді; щоб відредагувати їх, виберіть потрібний і перегляньте його атрибути в інспекторі. Або ж, для більшого контролю, двічі клацніть на шорткод, щоб відредагувати його у вихідному вигляді. Після внесення змін ваш шорткод оновиться відповідно до них.
За допомогою PBS ви можете перетягувати будь-що і куди завгодно. Перетягуючи елемент, наведіть його на інший елемент сторінки: ви можете розмістити його вище або нижче від будь-якого іншого вмісту.
Збереження вашої роботи
Коли результат вас влаштує, просто натисніть кнопку збереження у верхньому лівому куті сторінки. Ось і все!
Плагін Lite та плагін Premium — це два різних плагіни. Щоб користуватися преміум-функціями, вам потрібно буде деактивувати (або видалити) версію Lite, потім установити та активувати плагін Premium, а потім ввести свій ліцензійний ключ.
Примітка: якщо ви активуєте обидва плагіни Lite та Premium одночасно, плагін запропонує вам спочатку деактивувати той, який у вас є, перш ніж продовжити.
Примітка для клієнтів, які придбали PBS на сайті pagebuildersandwich.com: ви також можете завантажити плагін із сайту, ваш поточний ліцензійний ключ все одно має працювати. Якщо це не так, будь ласка, зв’яжіться з нами, і ми видамо вам новий.
Після покупки PBS ви маєте отримати електронний лист, що містить дві речі:
Установіть та активуйте преміум плагін, після чого перед вами має з’явитися цей екран:
Введіть сюди свій ліцензійний ключ і натисніть Agree & Activate License. Тепер преміум-функції стануть доступними.
Крім того, ви також можете перейти на сторінку своїх плагінів і знайти плагін Page Builder Sandwich у списку:
Натисніть на посилання Activate License , і звідти ви зможете ввести свою ліцензію.
Нещодавно ми внесли кілька виправлень, пов’язаних із проблемою сумісності, коли плагіни Page Builder Sandwich та IMPress for IDX Broker активовані разом. Це спричиняло збій на фронтенді для авторизованих користувачів.
Виправлення відновило роботу PBS, але нам довелося вилучити можливість вставляти віджет IDX Broker усередині редактора. Попри це, віджет IDX Broker усе ще можна використовувати в меню Вигляд > Віджети.
Щоб працювати швидше, ви можете використовувати різноманітні гарячі клавіші, доступні в Page Builder Sandwich.
Це комбінації клавіш для команд, що не стосуються форматування чи інструментів. Щоб дізнатися про гарячі клавіші для форматування/інструментів, наведіть курсор миші на відповідну кнопку на панелі форматування тексту, щоб переглянути їхню комбінацію клавіш.
| Гаряча клавіша | Опис |
| CTRL+E (коли редагування не активне) | Почати редагування |
| CTRL+SHIFT+R (під час редагування) | Оновити сторінку (оскільки CTRL+R використовується для вирівнювання за правим краєм) |
| CTRL+S | Зберегти зміни |
| CTRL+ESC | Скасувати зміни та завершити редагування |
| CTRL+C | Копіювати |
| CTRL+V | Вставити |
| CTRL+X | Вирізати |
| CTRL+ENTER | Розрив рядка / наступний рядок |
| CTRL+Z | Скасувати |
| CTRL+SHIFT+Z (Mac) CTRL+Y (PC) |
Повторити |
За допомогою Page Builder Sandwich ви можете редагувати лише окремі сторінки або дописи. Сприймайте це так: якщо в панелі керування для цього є область «Новий допис» із редактором вмісту, тоді ви можете редагувати це за допомогою Page Builder Sandwich.
Ви зможете редагувати вміст будь-якого користувацького типу дописів.
Ми подбали про те, щоб Page Builder Sandwich мав практично нульовий вплив на продуктивність вашого вебсайту. Для неавторизованих користувачів у чергу додаються щонайменше лише стилі CSS для рядків і стовпців, а також необхідні скрипти JS і CSS для шорткодів, які ви використали.
Для відвідувачів вашого вебсайту в чергу додаються щонайменше лише стилі CSS для рядків і стовпців, а також включаються необхідні скрипти JS і CSS для шорткодів, які ви використали.