Більше результатів...

Загальні селектори
Тільки точні збіги
Шукати у заголовках
Шукати у контенті
Вибір типів постів
Фільтрувати за категоріями
FAQ
Hostenko
Натхнення
Відео уроки
Новини
Плагіни
теми
Уроки
Хакі

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  • Заголовок – введіть простий заголовок, встановивши його значення у тегу < 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/

Коментарі до запису: 1

chumachkin_m:

Не забувайте, що вам доведеться навчитися користуватися ним.

ЗИ.
Для простого сайту надто складно – для складного дуже просто.
ІМХО

Додати коментар або відгук