Frontend Builder - редагуємо контент WordPress за допомогою drag'n'drop

Сьогодні ми представимо ще один огляд, присвячений плагіну Front End Page Builder для редагування контенту WordPress за допомогою drag'n'drop. Він створений розробниками із сербської компанії Shindiri Studioяка публікує свої теми та плагіни для ThemeForest.

У цьому огляді ми розглянемо функціональність та налаштування плагіна та дізнаємось, наскільки просто створювати сторінки на WordPress за його допомогою.

Дивіться також:

• MotoPress - drag&drop плагін WordPress для керування контентом
• WordPress плагіни для створення сторінок за допомогою Drag and Drop

Завантажити | демо | Ціна: $22

Встановлення та налаштування плагіна

Після завантаження та активації плагіна ви побачите нове меню «Frontend Builder», в якому збережено основні налаштування плагіна. Перейшовши за посиланням, ви побачите три вкладки: Загальні настройки, Друкарня, Налаштування кольору.

Загальні параметри дозволяють вставити каскадні таблиці стилів (CSS), вибрати розширення екранів різних пристроїв, інше:

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

І нарешті, у вкладці з налаштуваннями кольорів вибирається колір тла, тексту, заголовка, інше:

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

Створення сторінки

Зайдіть до розділу "Сторінки", натисніть "Додати нову", після чого з'явиться нова вкладка під назвою "Frontend Builder" поруч із вкладками "Візуально" та "Текст". Спочатку дайте назву новій сторінці, збережіть зміни та можете продовжувати роботу з нею, натиснувши на вкладку.

Якщо ви натиснете на червону кнопку "Редагувати сторінку", на екрані з'явиться нове вікно, в якому ви можете розпочати створення сторінки.

Спочатку це вікно може здатися трохи громіздким, але ознайомившись з усіма функціями, ви переконаєтеся у зручності роботи в ньому. Зліва по вертикалі розташований ряд іконок та шорткодів, які ви додаватимете на сторінку. При наведенні курсору мишки на кожен з них з'явиться спливаюче вікно з назвою.

Угорі по горизонталі розташовані функції, за допомогою яких можна зберегти, завантажити сторінку, приховати панель інструментів редактора, а також іконки для налаштування розміру екрана.

У самому центрі екрана відображається попередній перегляд створеної сторінки та кнопка з можливостями «Додати новий ряд», натиснувши яку ви зможете додати контент на ваш сайт.

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

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

Тепер можна натиснути на «Зберегти сторінку», а потім на «Попередній перегляд», щоб побачити, як створена сторінка виглядає на сайті.

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

Доступні елементи

Нижче наведено список елементів, доступних у цій плагіні:

• Заголовок – введіть простий заголовок, встановивши його значення у тегу < H >, колір, вирівнювання, нижнє підкреслення.
• Зображення – додавайте зображення на сторінку за допомогою URL-адреси або завантаживши його з комп'ютера.
• акордеон – елемент сортування з великою кількістю параметрів для редагування.
• Навігаційне меню - Відображає меню WordPress, яке ви обираєте. Вам доступно 9 опцій для відображення вашого WP меню.
• роздільник – стандартний роздільник у вигляді лінії, подвійної лінії, пунктирної лінії та з простими налаштуваннями.
• Текст/HTML – стандартне текстове поле, яке підтримує формат HTML контенту. За допомогою цього елемента можна вставити шорткод.
• Відгуки – додавання відгуку з відображенням вашої фотографії, імені, родом занять та цитатою.
• Тогл – це практично те саме, що й акордеон, але при цьому він залишається відкритим, якщо ви його відкриваєте одного разу.
• Значок меню – відображає одну або більше іконок у формі меню з посиланням та відображенням налаштувань при наведенні курсором.
• Маркер списку – відображення стандартного списку з великою кількістю опцій та налаштувань.
• Вкладки – стандартний елемент із великою кількістю опцій для змін.
• Код - Створення стандартного HTML тега в коді. Опцію оформлення для цього елемента взято із шаблону.
• Сайдбар - Імпортує сайдбар WordPress. Опції оформлення цього елемента розміщені у параметрах шаблону.
• Кнопка - дозволяє вставити просту або складну кнопку, повноекранний елемент.
• Бокс оповіщень - можливість додати бокс сповіщень до сторінки або створити його за допомогою фронтенд редактора.
• Пошуковий бокс - Додавання функціонального пошукового боксу з безліччю опцій для редагування елемента.
• Відео – розміщення відео на сторінці. Підтримуються формати відео з різних ресурсів: YouTube, Vimeo, Dailymotion та інше.
• слайдер – перетворення галереї фотографій або тексту на слайдери.
• Аудіо - Додавання файлів в аудіоформаті: mp3 або ogg формату.
• Креативні слайдери записів - Переміщення постів за допомогою цього елемента. Допустимо додавання великої кількості елементів.
• Особливості - Елемент, який поєднує Title > Icon > Text.
• Пости в мініатюрах – створюйте та виводьте стандартні записи з бекенду WordPress та публікуйте їх.
• Контактна форма - Розташування контактної форми з потрібними додатковими полями.
• Останні записи – цей елемент завжди відображає останні записи з бекенду сайту.

Джерело: wplift.com

Олексій Шевченко

редактор wpcafe

Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, який спеціалізується на створенні сайтів на WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/