Конструктор Bricks наступает на пятки Elementor. Обзор Bricks 2023

Bricks — это визуальный конструктор веб-сайтов на WordPress, который помогает создавать профессиональные сайты без необходимости знать программирование.

Bricks — объединил в себе готовую тему WordPress и плагин конструктора. Этим он отличается от других конструкторов, которые требуют предварительно установленной темы.

Сайт Bricks

Возможности Bricks

Дизайн с нуля

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

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

Я считаю, что Bricks прекрасно подойдет для веб-разработчиков, фронтенд-разработчиков, верстальщиков, а также дизайнеров у которых есть понимание и опыт работы с CSS. В руках этих специалистов он становится мощным и гибким инструментом, так как совмещает в себе не только визуальный интерфейс, но и возможность гибкого использования классов CSS.

Динамические сайты

В Bricks по умолчанию есть поддержка динамических данных, что позволяет использовать его вместе с др. плагинами (CPT, ACF, Pods, Meta Box, Carbon Fields) для создания и вывода на сайте произвольных типов записей и произвольных полей. Кроме популярных типов сайтов, вроде сайта-визитки или корпоративного сайта, вы сможете создать сайт недвижимости с объявлениями, туристический сайт, образовательный сайт и т.д. Конечно, для расширения функционала личного кабинета пользователя вы должны будете установить дополнительные плагины.

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

Gutenberg

Очень положительным и сильным моментом является то, что Bricks поддерживает и совместим с редактором Gutenberg. Вы можете вставлять блоки Bricks внутри редактора Gutenberg и редактировать в них содержимое, без вмешательства в дизайн. Присутствует обратная совместимость.

А где хранить свой код?

А где хранить свой код PHP, JS и CSS, если Bricks это готовая тема?

Здесь можно использовать/совмещать два подхода: дочерняя тема Bricks и/или плагины для вставки сниппетов кода. Я рекомендую использовать плагин WPCodeBox, он позволяет задавать условия подключения кастомного кода для оптимизации загрузки страниц сайта. См. его описание и примеры использования в видео.

А что насчет совместимости Bricks с плагином WooCommerce?

Можно ли создать полноценный интернет-магазин на базе Bricks и WooCommerce? На сегодняшний день, с помощью Bricks можно создать простой, нетребовательный по функционалу интернет-магазин. Bricks предоставляет набор готовых темплейтов для создания и настройки страниц магазина.

Но, Bricks пока еще не содержит в себе возможностей для гибкой настройки цикла товаров, создания фильтров товаров и др. Мы надеемся, что в скором времени, команда Bricks предложит нам широкие возможности для создания интернет-магазина. А пока, отсутствие гибкости частично можно закрыть использованием сторонних, платных плагинов WordPress.

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

Документация

Кроме того, Bricks предоставляет пользователю обширную документацию и видеоуроки, которые помогают новым пользователям быстро начать работу с конструктором. Бесплатная пробная версия позволяет оценить возможности Bricks до покупки полной версии. В целом, Bricks — это мощный и удобный инструмент для создания профессиональных и современных веб-сайтов на WordPress.

Популярные плагины для расширения возможностей Bricks

BricksExtras — это расширяющаяся библиотека готовых элементов и функций, с основным фокусом на доступности, гибкости и расширении возможностей Bricks. Позволяет использовать и настроить динамические данные и циклы, запускать кастомные события и функции JS и др. Перейти на сайт

OxyProps — современный фреймворк CSS в виде плагина WordPress для использования с Bricks и Oxygen Builder. Добавляет коллекцию настраиваемых свойств CSS, фреймворк утилитарных классов, пользовательские компоненты и функции конструктора для быстрого доступа к настраиваемым свойствам. OxyProps позволяет создавать согласованный дизайн, использовать светлые, темные и цветовые схемы, а также экономить время в процессе разработки. Перейти на сайт

Bricksforge — это плагин для Bricks, который содержит в себе набор готовых элементов, блоков и страниц для создания и оформления страниц сайта. Также, Bricksforge позволяет гибко настроить доступы для разных ролей пользователей. Перейти на сайт

Доступные языки

В настоящее время Bricks доступен на следующих языках: английском, немецком, португальском, испанском, русском, японском, французском, итальянском, голландском, польском, болгарском, упрощенном китайском, традиционном китайском, румынском, малайзийском, шведском и хорватском.

Но, я рекомендую включить и использовать английский язык. Потому что «Margin» — это кратко, понятно и знакомо.

Обзор Bricks 2023

Участники нашего WordPress-сообщества 10-03-2023 провели телеграм-конференцию на которой рассказали о возможностях Bricks, поделились своим практическим опытом и дали советы веб-разработчикам.

В это видео не вошла часть с разбором реальных кейсов (по просьбе спикеров эта часть была представлена только на конференции и в запись не вошла).

Содержание:

00:00 Введение.
00:52 Общие настройки Bricks.
12:13 Интерфейс конструктора: панели, виджеты, брекпоинты, темплейты и др.
23:08 Пример верстки страницы.
1:22:30 Верстка шапки сайта и поддержка WooCommerce.
1:33:44 Страница Оформление заказа.
1:46:51 Плагины для Bricks: BricksExtras, Bricksforge и OxyProps.
2:09:01 Bricks и Gutenberg — поддержка и совмещение при разработке сайта.
2:11:53 Советы новичкам.
2:17:45 Завершение.

А почему в названии статьи вы упоминаете конструктор Elementor?

Не секрет, что визуальный конструктор Elementor на сегодняшний день, является самым популярным инструментом для создания и оформления сайтов на WordPress. Его по умолчанию интегрируют в бесплатные и платные темы WordPress.

На маркетплейсе Envato большинство платных тем WordPress, наверное около 80%, используют в качестве инструмента для оформления внешнего вида конструктор Elementor. Elementor держит уверенное лидерство среди конструкторов страниц для WordPress. Но, недавно мне попала в руки одна выборка по западным агентствам, которые занимаются веб-разработкой. В статистику попало более 600 компаний (не фрилансеры, а именно компании со средними и высокими чеками на рынке). Среди вопросов был вопрос использования конструкторов. Проанализировав статистику можно заметить некую тенденцию снижения популярности Elementor и повышения интереса к Gutenberg и Bricks.

Я не буду сейчас анализировать причины смены трендов, но скажу только одно: тренды и мода на Западе через некоторое время приходят к нам. Поэтому, если вы используете только один инструмент, например тот же Elementor, то я рекомендую вам начинать сегодня изучать и др. конструкторы (а лучше копать еще глубже, изучая PHP, CSS и JS). Игнорируя тренды, вы можете оказаться вне рынка. Потом вам будет сложнее догнать своих конкурентов, которые освоили различные инструменты и предлагают своим клиентам лучшие возможности и условия.

Вообще, веб-технологии постоянно развиваются и это развитие постоянно ускоряется. То что раньше считалось показателем опыта и восстребованности, сегодня — это уже само собой разумеющееся. Но, завтра это может быть устаревшим и неоптимизированным подходом. Наша задача, как веб-разработчиков и веб-мастеров постоянно следить за трендами и совершенствовать свои навыки. Или, веб-разработка это не ваше!