Урок WP: Вёрстка красивых страниц с Page Builder

Как вы наверное могли заметить веб сайты давно уже переросли стадию старинного концепта «Две колонки и меняющийся текст по середине». Более того ни один уважающий свою честь веб дизайнер не станет даже браться за создание чего либо подобного.

Но вот проблема, если для среднестатистического контент менеджера сверстать нетипичную страничку не составит никакого труда, то вот с сайтом который будут администрировать ваши клиенты самостоятельно такая штука уже не прокатит. Так было до недавнего времени, пока не появились они — конструкторы страниц.

На большинстве своих проектов, которые приходиться разрабатывать на WordPress я использую плагин Elementor. Сегодня я немного вам о нём расскажу.

2-elementor-page-builder-interface-1-1024x602

Что делает конструктор страниц? Если вкратце — предоставляет графический интерфес для размещения контентных блоков на странице. Позволяет интуитивно создавать гриды, размещать различные блоки в колонках грида, такие как: текстовые блоки, изображения, карусели изображений, вставку видео и карт из google и многое другое. Так же к некоторым  конструкторам страниц можно найти плагины расширяющие их наборы контейнеров и дополнительного функционала.

В этой демонстрации вы можете увидеть базовый принцип работы с конструктором страниц Elementor:

Управление свойствами

layout

Вы получаете полный контроль над поведением ширины и высоты ваших разделов на страницах. Все изменения будут тут-же визуально отображаться в реальном времени на редактируемой странице в уже созданном вами дизайне.

Редактирование сетки

resize-web

Вы можете легко изменять пропорции ячеек вашей сетки. Нужно просто потянуть за край ячейки и перетащить её влево или вправо. Даже самые консервативные из ваших клиентов справятся с этой нетривиальной задачей.

Настройка колонок

position_web

Всего парой кликов вы можете отцентровать содержимое колонки, прибить к верхнему или нижнему краю, а так же растянуть колонки на высоту всей секции.

Надеюсь этот небольшой обзор поможет вам в повседневной работе.

Комментарии

  1. Под «Вёрстка красивых страниц с Page Builder» имеется ввиду то что сайт сначала написан на html, css, js и затем перенесен на wordpress или же вы верстаете сразу на wordpress?

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *