Бесплатный строитель — Page Builder by SiteOrigin. Как создать макеты с пользовательских страниц на WordPress Beaver Builder

Для создания страницы в WordPress, где нужны колонки или встроенные блоки с виджетами, мы раньше использовали шорткоды. Это давало нам возможность делать правильную расстановку блоков с разным типом контента, на всем протяжении страницы. При этом, нас почти ничего не ограничивало, но все же это было крайне не удобно, не смотря на прекрасные результаты и красиво оформленные страницы сайта, а также занимало много времени.

Теперь появился удобный инструмент - плагин Page Builder , который взял на себя организацию данного процесса и сильно упростил нам работу с созданием новых материалов в WordPress.

Бесплатных плагинов Page Builder не так много, но и их достаточно, чтобы выбрать тот, который нам более всего покажется удобным. Стоит отметить, что в большинстве премиум шаблонов WordPress, есть свой собственный плагин Page Builder. Но мы будем рассматривать сегодня только бесплатные.

Бесплатные плагины Page Builder

Список плагинов, как я уже сообщал, довольно короткий:

Принцип устройства и работы с любым плагином Page Builder очень схожи, поэтому останавливаться на особенностях каждого плагина в отдельности я не стану. В примере же будет фигурировать плагин Page Builder by SiteOrigin.

Начало работы с плагином Page Builder by SiteOrigin

Вверху слева - две кнопки-иконки (1-плюс и 2-три вертикальные полоски).

  • Нажав на плюс - можно выбрать виджет (текст, картинку, видео, табы, галерею и т.д.).
  • Нажав полоски - можно выбрать количество колонок.

Начинать нужно с выбора количества колонок. Выбрав - мы получим поле, в которое можно теперь добавлять виджеты. В плагине Page Builder by SiteOrigin, по умолчанию стоит две колонки, поэтому мне не редко приходиться исправлять 2 на 1.

Если вы добавили две или три колонки, необходимо нажать на голубое поле, в которое вы собираетесь добавить виджет (оно станет чуть ярче, активируется) и после этого выбирать виджет, нажатием на плюсик. Если вы случайно забыли выбрать поле, то ваш виджет добавится в самое верхнее поле. Просто перетащите его оттуда, куда вам нужно.

Вы можете не нажимать каждый раз на плюсик, если у вас рядом есть блок с аналогичным типом контента. На каждом блоке виджета, есть три ссылки справа: Edit - Duplicate - Delete.

Нажмите Duplicate (копирование) и вы получите копию блока. После этого перетащите в нужное вам поле, нажмите - Edit и отредактируйте содержимое блока. Нажатием Delete, вы удалите не нужный блок.

Выводы

Конечно, по началу нужно будет привыкнуть к Page Builder, но потом..., вы ни секунды не пожалеете, что установили этот плагин и научились им пользоваться. Вы по прежнему сможете пользоваться любым типом создания контента - текстовый, визуальный и Page Builder. Однако, для каждой конкретной страницы (поста), нужно будет выбирать или первые два способа создания страницы или Page Builder, это единственное "неудобство".

Остались вопросы, посмотрите обзор обновленного плагина в статье:

или задавайте в комментах.

Мы изучим Beaver Builder и покажем вам, как создавать пользовательские макеты в WordPress с помощью этого плагина.

Почему и когда вам нужны пользовательские макеты

После ввода вашего лицензионного ключа вы будете готовы создать свои макеты.

Создайте свой первый собственный макет с Beaver Builder

Просто создайте новую страницу в WordPress, зайдя на Страницы »Добавить , Вы увидите новую вкладку «Page Builder» в редакторе WordPress.

Нажмите на вкладку "Page Builder "запустить" Beaver Builder ». Если вы впервые используете Beaver Builder, вы увидите приветственное окно, предлагающее экскурсию.

На данный момент, вы можете нажать на кнопку "Нет Пожалуйста, пропустите шаг , После этого вам нужно нажать на кнопку Шаблоны в верхнем меню.

Beaver Builder предлагает профессионально разработанные шаблоны, чтобы вы сразу начали работать.

Не беспокойтесь, вы можете настроить шаблон столько, сколько хотите. Это просто быстрый способ начать работу с макета.

Когда вы выбираете макет, Beaver Builder загружает его в окне предварительного просмотра. Наведите указатель мыши на элемент, и Beaver Builder выделит его.

Вы можете просто нажать на значок гаечного ключа на выделенный элемент для редактирования.

Beaver Builder отображает всплывающее окно с различными настройками, которые можно изменять. Вы можете изменить цвет текста, фона, шрифт, поле и т.д.

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

Макеты Beaver Builder разработаны в рядах. Вы можете перетащить переставить строки. Вы также можете удалить или добавить новую строку.

Просто нажмите кнопку макеты строк И выбрать количество Вы хотите в своей строке.

Beaver Builder добавит строку в предварительный просмотр на вашем сайте.

Вы можете добавлять элементы в свои строки, используя базовые или расширенные модули и виджеты. Эти модули позволяют добавлять наиболее часто используемые элементы, такие как кнопки, заголовки, тексты, изображения, слайд-шоу, аудио, видео и т. Д.

Просто выберите элемент и перетащите его в строку, которую вы только что добавили. Щелкните элемент, чтобы изменить его свойства.

Нажмите кнопку " Готовые Когда вы закончите редактирование своей страницы. Beaver Builder отображает всплывающее окно с кнопками для " публиковать "Или" Сохранить страницу как черновик ».

Вы также можете повторно использовать весь макет для других страниц вашего сайта WordPress. Просто откройте страницу с помощью Page Designer, затем нажмите кнопку «Инструменты» на верхней панели.

Beaver Builder покажет вам всплывающее окно. Вы можете сохранить страницу в качестве шаблона или быстро создать дублируемую страницу с тем же макетом.

Управление шаблонами макетов в Beaver Builder

Каждая лицензия Beaver Builder дает вам право использовать ее на неограниченных веб-сайтах. Но как вы перемещаете свои шаблоны страниц с одного сайта WordPress на другой?

Beaver Builder хранит созданные пользователем шаблоны в специальном типе публикации, называемом шаблонами. Он по умолчанию скрыт, но вы можете сделать это видимым, перейдя к Настройки «Page Builder и нажав на вкладке Шаблоны.

Просто установите флажок рядом с параметром "Включение шаблонов администратора И нажмите Сохранение настроек шаблона .

Вы увидите новый пункт меню под названием Шаблоны появляется на панели инструментов WordPress. Все макеты, которые вы сохраняете в качестве шаблонов, появятся на этой странице.

Поскольку это настраиваемый тип публикации, вы можете легко экспортировать свои шаблоны Beaver Builder, используя встроенную функцию экспорта WordPress.

Посетите страницу Инструменты »Экспорт и выберите «Шаблоны». Нажмите на кнопку Скачать файл экспорта И WordPress отправит XML-файл, который вы можете скачать.

Теперь подключитесь к сайту WordPress, где вы хотите импортировать шаблоны. Продолжайте Настройки «Импорт и нажмите на WordPress.

Вам будет предложено загрузить и установить плагин импортер. После этого, вы сможете просто загрузить файл templates.xml и импортировать его.

Вот и все! Мы надеемся, что этот учебник поможет вам создать пользовательские макеты WordPress с помощью Beaver Builder. Если у вас есть какие-либо комментарии или предложения, сообщите нам об этом в специальном разделе.

Создавать объемные модели в домашних условиях можно с помощью встроенного приложения в новой версии ОС от Microsoft. Для этого предназначена утилита 3D Builder Windows 10. Что это за приложение вы узнаете в этой статье.

Описание

Программа 3D Builder позволяет просматривать трехмерные изображения со всех сторон, прокручивая их во всех плоскостях рабочей среды, и готовит их к печати на 3D принтере (также прочитайте « »). Поддержка утилиты появилась в Windows 8.1, а в новой сборке ОС от Microsoft это стандартное приложение.

Вместе с приложением в ОС поставляются драйвера для подключения оборудования. Пользователю не нужно скачивать и устанавливать непроверенные приложения из сомнительных источников для распечатки проекта. Нативная поддержка 3D печати в Windows 10 должна вывести этот рынок на новый доступный уровень.

Зачем нужна и как пользоваться?

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


Утилита предназначена для минимального редактирования 3D изображений. В 3D Builder отсутствуют сложные функции, поэтому каждый пользователь сможет разобраться в настройках программы.

  1. Запустите программу → откройте нужный объект.
  2. Справа вверху расположена основная панель настроек макета (в каждом пункте присутствую поднастройки):
  3. В левой верхней части окна выберите любую часть сложного объекта.
  4. Укажите нужные цвета, оттенки, насыщенность, яркость для каждой части в пункте «Применить материалы» справа внизу.
  5. Отредактировав макет, нажмите «Объемная печать».
  6. Выберите принтер.
  7. Можно заказать печать модели через интернет.

Мнения пользователей

Пользователи отмечают простоту программы, а также возможность настроить огромное количество параметров модели. Но из-за малого распространения оборудования для 3D печати используется утилита 3D Builder редко.

Видео

Видео наглядно продемонстрирует работу с программой.

Вывод

Приложение 3D Builder создает и обрабатывает 3D модели объектов для их последующей распечатки. В нем нет сложных функций, что упрощает работу с программой. При отсутствии оборудования можно заказать распечатку проекта через интернет.

Как напечатать трехмерный объект? Изобретению трехмерной печати уже более 30 лет, вместе с ней возможности проектировщиков, медиков, изобретателей намного расширились – всего за несколько часов на специальном принтере можно «создать» практически любой объект. Представьте себе, что медики могут напечатать новый орган, вместо пораженного болезнью, и сделать успешную пересадку, а инженеры смогут воплотить в жизнь созданные ими изобретения всего за несколько часов! Не нужно ждать решение комиссии, донора, все напечатает современный принтер 3D печати!

Принцип работы принтера. Вместо чернил в него заправляют жидкие полимеры, а встроенное оборудование с ультрафиолетовым лучом обрабатывает полимер и делает его жестким, но чтобы все получилось, необходимо и программное обеспечение, например, 3D Builder Windows 10, программа специально была разработана под WindFows 10.

Первые пробные версии были еще в 8 версии ОС, но она успешно прошла адаптацию под новую и улучшенную Windows 10.

Особенность приложения – в формате, вместо привычного формата STL все созданные трехмерные изображения сохраняются с расширением 3MF. Как заявляют разработчики, это обеспечивает лучшую совместимость с оборудованием и сохранением изображения.

Найти программу можно в Меню, в списке всех приложений, поставляемых вместе с ОС Windows 10. При старте можно увидеть начальное окно:

Это ознакомительный ролик, из него можно понять принцип загрузки и обработки изображений, затем можно перейти к основному функционалу:

Это стартовое окно, здесь можно загрузить имеющиеся шаблоны или загрузить свое уникальное фото – все удобно сгруппировано по рубрикам, присутствует большая библиотека самых различных образов.

Работа с изображением начинается с его загрузки – выберите любой объект, и вставьте в рабочее окно. Как уже было сказано, 3D Builder Windows 10 может работать с файлами любых расширений, то есть загрузить можно то, что есть, но вот сохраняться они будут в формате 3MF.

Обратите внимание! 3D Builder Windows 10 должна найти ваш принтер! И только после этого можно заняться обработкой в окне, которое будет соответствовать рабочей области принтера – здесь можно увидеть сетку, с квадратами со сторонами в 1 см по горизонтальной плоскости, и линейкой по вертикали. В синем окне будет проходить выделения объекта по осям X и Y, и если вы загрузили только один, то все будет сделано в автоматическом режиме.

Панель управления

Редактура производится при помощи боковой панели управления – либо по кругу, либо увеличивая масштабирования линейкой. Они свободно перемещаются по экрану, и можно задать практически любые размеры при помощи мыши за вертикальные ограничители. Линейкой изменяется размер рамки с изображением. На экране программы видны разноцветные стрелки – ими удобно перемещать объект ближе или дальше по экрану. Стрелка указывает на опции, которыми можно трансформировать объект.

Но редактировать нужно с осторожностью – порой картинка может выйти из параметров рабочей области 3D принтера – программа 3D Builder Windows 10 обязательно выведет на экран сообщение с предупреждением, а область, которая вышла за допустимые пределы, будет выделена красным цветом.

Панель с линейными параметрами может работать в двух режимах – редактуры и управления. На картинке видны доступные параметры, которые можно изменить в любой момент:

  • Можно упростить открытое изображение – убрать ненужные части объекта при наведении на него мышью;
  • Разделить на части, если все изображение не умещается в заданные параметры рабочей плоскости принтера;
  • Создание рельефного изображения, если нужно сделать объект объемным.

Если все, что сделали, вам не понравилось, то можно вернуть все назад из боковой панели управления кнопкой «Вернуть все назад».

Кнопками можно разворачивать объект под нужным углом, приблизить или отдалить, а можно сделать предельно допустимые принтером размеры – все находится в боковой и верхней панели управления.

Для печати нажмите кнопку, чтобы вывести изображение на принтер.

Итог

Обязательно установите драйвер из Центра Обновлений вашего оборудования – его можно найти вручную на сайте корпорации, или дождаться автоматической установки. Если модель создана, и она срочно нужна, то можно заказать печать по предлагаемой программой ссылке. Если выставлен параметр печати на 3D принтере по умолчанию, но эта опция не нужна в дальнейшем, то удаление проводится из контекстного меню по клику по ярлыку программы правой кнопкой мыши.

Зачем вообще связываться со строителями кастомных страниц (Page Builder)?

Сегодня WordPress Page Builder является самым популярным выбором среди разработчиков по всему миру. Его удобно использовать для создания разных страниц, начиная от самых элементарных и заканчивая очень сложными. Помимо WP Page Builder доступны и другие бесплатные инструменты. Однако разработчики выбирают именно WordPress из-за следующих характерных особенностей:

  • Легко установить
  • Легко настроить
  • Легко пользоваться

Согласно мнению большинства разработчиков, WordPress может похвастаться своим понятным и удобным интерфейсом. Для создания стандартного сайта знание программирования не является обязательным условием. Функции и внешний вид сайта можно легко изменить, используя различные темы. Существует огромное количество плагинов, и найти нужный можно прямо из консоли администратора.

Сегодня мы бы хотели провести сравнение 3 самых популярных строителей страниц в WordPress: Visual Composer , Beaver Builder и Velocity Page .

1. Visual Composer


Описание | Демо | Купить за $34

Особенности

Visual Composer позволяет вам вносить изменения во фронтэнде и в бекэнде. Многие выбирают именно этот вариант, поскольку другие инструменты позволяют создавать страницы, используя либо только бекэнд, либо только фронтэнд. В Visual Composer вы также найдете огромное количество разных элементов контента, включая мультимедийные компоненты для изображений и видео, кнопки для социальных сетей, слайдеры, сетки и т.д. Есть также поддержка кнопок действий.

Удобство использования

Интерфейс Visual Composer очень прост и удобен. После установки, вы потратите максимум 15 минут, чтобы разобраться в нем и понять, как все работает. Но, несмотря на всю практичность этого плагина, разработчику понадобится несколько часов, чтобы создать кастомизированные страницы, которые бы отвечали всем требованиям и запросам. Вам нужно понимать, как работать с каждым элементом и что произойдет после его установки. Некоторые шаблоны поставляются вместе плагинами, которые будут увеличивать скорость загрузки. Желательно загружать такие шаблоны в самом начале и начинать работу с них. Таким образом, вы быстрее разберетесь в рабочем процессе.

Поддержка

Visual Composer представлен на рынке уже много лет. Плагин постоянно обновляется, к нему добавляются новые функции. Система поддержки очень достойная. Запросы клиентов обрабатываются постоянно (используется система тикетов), разработчики также активно отвечают на комментарии. Вы приобретаете Visual Composer одним платежом, без ежегодной платы, поэтому получаете качественную поддержку на всю жизнь. Стоит добавить, что на сайте WP Bakery вы найдете отличную "базу знаний", которая поможет вам лучше разобраться в работе с плагином.

Аддоны

Ultimate ” - самый популярный аддон на CodeCanyon. Каждый элемент в этом пакете создавался очень кропотливо, с особым вниманием к деталям. В него входят Info Box, иконки, Info List, Counter, Flip Box, Modal Popup Box, интерактивный баннер, расширенные Google Maps и Timeline. Есть функция вертикального и горизонтального параллакса, фиксированные фоновые изображения, видео фон, Hover-параллакс и многослойный Hover-параллакс. С помощью WordPress Icon Fonts Manager вы можете изменять шрифты вашей собственной иконки.

Встроенные блоки

Visual Composer поставляется с более чем 40 загруженными блоками контента. В них водит Text Block, Text Separators, Facebook Like, Pinterest, Single Image, Call to Action, Video Player, Google Maps, Pie Chart, Media Grid и так далее. Только файлы JavaScript.

Итог

Visual Composer легко можно рассматривать как наиболее удачный выбор среди всех доступных подобных инструментов на WordPress. При покупке данного плагина, пользователь получает удобный интерфейс и огромное количество разных элементов контента, что явно выводит плагин на первое место. Однако в Visual Composer нет никакого варианта для добавления виджета на страницу, в отличие от некоторых других бесплатных плагинов.

2. Beaver Builder


Особенности

Beaver Builder совместим с любыми типами WordPress тем. Он позволяет создавать страницы через фронтэнд. Основное преимущество этого способа - вы сразу будете видеть внешний вид вашего сайта и у вас не возникнут какие-то ложные представления. Beaver Builder поставляется с 11 встроенными конструкциями страниц и 12 вариантами домашних страниц. Есть шаблоны для страниц Услуги, Про нас, Контакты, Портфолио и т.д. В отличие от многих других строителей страниц, которые вы можете использовать только на одном сайте, Beaver Builder можно установить на всех сайтах, которые вы ведете.

Удобство использования

После запуска плагина Beaver Builder на вашем сайте, вы можете приступать к работе. В меню настроек вы не найдете слишком много разных параметров, поэтому весь процесс не займет у вас много времени. Здесь вы сможете выбрать шаблоны страниц, модули и типы постов.

Чтобы начать работу, вы должны создать новый пост или страницу. Затем нажмите на вкладку “Page Builder” или на линк “Page Builder” на экране списка постов.

После запуска Page Builder вы перейдете во фронтэнд сайта и сможете там выбрать любой из 12 предложенных шаблонов для домашней страницы или 11 конструкций страниц, которые содержат контент.

В Beaver Builder доступны три категории модулей: виджеты, продвинутые, базовые. В зависимости от системы управления модуля, вы сможете подключать изображения, форматировать компоненты и тексты различными способами.

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

Поддержка

Команда поддержки Beaver Builder работает очень хорошо и предоставляет решения в течение очень короткого времени. В случае каких-либо задержек, ответ будет предоставлен в течение максимум 24-48 часов. Кроме того, есть форум поддержки Beaver Builder, где вы можете оставить свой запрос или просмотреть запросы других пользователей.

Аддоны

К сожалению, на данный момент, в Beaver Builder нет поддержки аддонов.

Встроенные блоки

Beaver Builder поставляется с большим количеством встроенных блоков контента. Слайд-шоу, вкладки, страницы, кнопки, отзывы, формы, таблицы ценообразования - лишь некоторые из них.

Итог

Создание веб-страницы требует много усилий и времени, особенно, когда нужно запустить несколько проектов одновременно. Beaver Builder позволит вам упростить этот процесс и поможет создавать страницы без единой строчки кода. Отличный интерфейс поможет справится со всем быстро. Но в этом способе есть и свои недостатки.

3. Velocity Page


Особенности

Velocity Page - сравнительно новый WordPress плагин, который позволяет вам создавать страницы и менять их контент из фронтэнда. Velocity Page совместим со всеми типами WordPress страниц. Таким образом, вы можете разработать новую страницу или отредактировать уже существующую. Однако вы не можете редактировать существующие посты. После запуска Velocity Page существующий контент будет скрыт (или он просто будет игнорироваться). Можно использовать текущую тему или выбрать один из предложенных шаблонов.

Удобство использования

После включения Velocity Pagе вы сможете изменять контент только через фронтэнд. После входа в систему вы увидите кнопку “Edit”, кликните на нее и включите элементы управления модификациями. В редакторе вы сможете сделать предпросмотр доступных функций. Есть возможность менять строку в столбце, с помощью кнопки “Change item type”, но у вас не получится изменить ширину колонки.

Поддержка

После приобретения Velocity Page можете быть уверены в качестве их поддержки. Если вам не понравится их работа, то в течение 30 дней вы сможете получить свои деньги обратно. Используется система билетов (тикетов), которая уже давно доказала свою эффективность. Команда поддержки приложит максимальные усилия для того, чтобы быстро и качественно решить ваш вопрос.

Аддоны

К сожалению, Velocity Page не поддерживает внешние аддоны.

Встроенные блоки

В данном плагине есть много встроенных блоков, которые вы можете легко использовать для улучшения вашего дизайна страницы. Для добавления нового блока используется система “drag and drop”. Представлены следующие блоки: изображения, MailChimp, форум, медиа, Aweber форум, текст и т.д.

Итог

Velocity Page является хорошим вариантом для дизайнеров и владельцев сайтов, которые хотят легко добавлять новый контент на свои страницы. Вы действительно сможете без особых усилий добавить изображение или видео, при этом не изменяя основной дизайн сайта. Однако, в данном случае, очень многих потенциальных пользователей может смутить цена. К тому же он совместим не со всеми темами. Поэтому тот факт, что в случае неудовлетворенности результатом вы сможете вернуть свои деньги, очень радует. Несмотря на эти недостатки, Velocity Page - отличное решение для тех, кто не имеет ни малейшего представления о WordPress Dashboard и программировании в общем.