In this article we are going to review one of the newest WordPress page builders called Bricks Builder. This theme recently burst on to the market, taking it by storm, seeming to position itself in the realm of website speed, ease of use, while still offering features for developers.

While still in Version 1, Bricks now has support for WooCommerce, and most major kinks have been worked out since launching. Let's take a look at the features, usability, pricing, competition, and applications of Bricks builder to see if it is a good choice for you.

This modern builder has a massive focus on making it easy to build websites. You don't need to be a professional developer to use this plugin. In many regards, it is similar to Elementor in the ease of use. However, where it differs is the speed of the front end website. This builder outputs incredibly clean code, so if you are worried about your Google core web vitals, this tool should have you covered (just like Oxygen Builder). Additionally, the backend builder loads very rapidly.

Before we continue with our review, it's worth noting that this is a relatively new entry to the market, so you likely won't be building massive, complex websites like directories, large WooCommerce shops, and more. However, it is perfectly suitable for creating smaller brochure, corporate, and smaller WooCommerce websites in its current version, and it is getting better with every release.

We will continuously update this review as new features are launched (and they are launched with relative speed as the developers behind the tool are very involved and talented).

Bricks Builder Features

If you have ever used a WordPress page builder before, you will be familiar with the features and layout that Bricks Builder has to offer. You create a standard post or page on the WordPress back end, and then initialize the builder from there. You can also create templates, such as a single blog post template, or a home page template.

Once you click to initialize the builder, it loads incredibly rapidly (under 2 seconds). you are then greeted with your main settings, panels, and interfaces. On the left is your elements panel. We will discuss the elements in more detail at a later section in the article. In the center, is a visual preview of what you are building. The top bar contains several buttons, such as a save button, responsive toggles, back button, history toggle, and more. On the right, we have a structure panel.

As mentioned, the center of your page is your canvas. You can build pages by utilizing structural elements, and then adding content such as images and text. You can also get a head start by utilizing pre built templates.

Clicking the help button, which is the last of the three buttons that will display on the blank canvas will toggle an in builder popup that allows you to search the entire documentation of the tool. This is well written, and easily digestible meaning that you don't need technical knowledge to understand it.

The Page Builder Elements (50+!)

When building your website, you drag and drop specific elements on to the canvas. Let's take a look at what each of these elements are. There are several main sections/classifications of element:

• Structure
• Standard
• Components
• Media
• Dynamic

Please note, these are not the official categories of elements, instead we grouped them into these ourselves. Let's talk about some of the elements and what you can do with them, alongside some of these groups.

The main structural element is the container. The container can be set to be either a section, div, a, or other. It’s job is to be a container to visual content. With it, you can utilize flex to position elements within it. It's relatively robust in terms of what you can do with it. The best part about this container element is that you don't need to understand HTML or CSS to use it. It makes it easy to visually align content within it, and position itself in larger container groups.

Within the container, you will typically place image elements, text, and other components. There are many unique components that take the work out of creating them. For example, there is animated text, something that would take a bit of time to code in pure JavaScript. This element already exists, and all you need to do is place it on the website and fill out what you wanted to display. There are many elements like this, taking the busywork out of creating a website.

You can also incorporate dynamic depending on the page type - for example if you are working on a single post page, you can easily place the date of publication, title, and additional information like that.

Dynamic data can also be used to create conditions for visibility of individual elements, sections, and containers, as well as populate directly into images and text. What this means is that you can use a custom fields plugin like MetaBox or ACF (read: ACF Vs. Meta Box Comparison - 2024) to set up back end fields, and populate whatever data is imputed into them on the front end template of your website created in Bricks Builder. this is a relatively standard feature of many popular page builders like Oxygen and Elementor.

WooCommerce Support and Elements

WooCommerce also has a robust collection of elements that were recently added in a new version update of Bricks. For example, you can add product image galleries, add to cart buttons, and more. This essentially offers you everything that you need to create a small to medium sized ecommerce website using Bricks, WordPress and WooCommerce.

What If You Don't See An Element That You Need? - Create Your Own

This builder has managed to do something that many on the market have failed at. The developers behind the page builder have created an incredibly fast loading, easy to use interface that can be adopted by beginners, agencies, and professional developers alike. Let's say you don't see any element that you need. It is incredibly easy with basic knowledge of PHP, HTML, CSS, and JavaScript, to create a custom element for use in all your bricks websites.

Not only is this great for individuals, but plugin creators have already capitalized on this ease of element creation. For example, WSForm (our review) was one of the first to add a native form element to Bricks.

Easy, Yet Robust Styling

Specific elements will vary in the settings that apply to them. However, you have access to relatively every single property that CSS has to offer in a helpful comment easy to use graphical user interface. You don't even need to have any knowledge of CSS to create a beautiful website using Bricks!

You can see that you can set the background color, background image, layout options, border styles, shadows, and more via the styling tab within a specific element. This is relatively consistent regardless what the element is.

Attributes - Accessible Sites, Easy JS

Bricks allows you to assign custom attributes to specific elements of your website. This means that you can make it completely accessible to all website users, as well as tie in JavaScript to HTML with ease.

Right Click Menu

While building, you have an integrated right click menu that allows you to copy and paste elements and styles, duplicate, delete and more.

As you drag elements on to the canvas, populate data, and build a website, there is a robust history, undo/redo, and autosave setup integrated into the builder. You can create websites with confidence that you will never lose them if your computer crashes or dies. You can also revert back to previous versions of the page with ease.

When creating a website, designers and developers typically get into a flow state. Many popular builders have no way for you to switch between pages unless you go back to the WordPress admin back end. This means you have to leave the builder to get to a new page. However, Bricks has a solution for that. You can switch between pages within the builder.

Easy Way To Make Pages Responsive

When building your pages, you can assign different styles to different breakpoints. There are three primary breakpoints hardcoded into the builder, which encompass mobile, tablet, and desktop screen sizes. You can also add your own custom breakpoints.

Global Styles

Bricks has a large collection of global options. This makes it easy to create centralized styling rules, and change them globally throughout the website instead of having to go through each individual page and element, changing them there. Each element has a collection of global styles that can be manipulated, you can also easily incorporate a CSS stylesheet, and page/global rules.

Ease Of Use

The ease of use of the Bricks Builder really surprised us as we reviewed this theme.

As you can tell from the screenshots in this article, this is a high quality builder that has obviously been thought out and created by a professional UX/UI designer. Not only does it look pretty, but dragging and dropping works as it should, the structure panel is easy to manipulate, clicking on individual icons brings you to where you would expect to end up, and it simply works.

Actually creating pages is a very simple method of dragging and dropping, and manipulating the styling of each element. If you have a knowledge of CSS, JavaScript, and PHP this builder becomes even more powerful, but you do not need it whatsoever. You can be somebody with absolutely no technical knowledge at all, and easily pick this builder up.

If you ever get stuck on basic to advanced topics, the documentation which is called Bricks Academy is incredibly well written and easy to follow. There's also a Facebook group which is very helpful and has a ton of members actively creating websites with this platform.

Pricing

The pricing for Bricks Builder really separates it from anything else on the market today. There are only two tiers, both offering lifetime access meaning updates, support, and access. The first tier comes in at a $59 purchase for use on a single website. The second tier comes in at $149 purchase for use on up to 1000 websites for the life of the product.

If that wasn't good enough, check out the refund policy.

Roadmap

The pricing and value of this builder is cemented even further because of the public road map. With it, users can understand exactly what they can expect in future releases of the tool. You should never buy a product for its future potential, but this should give you Peace of Mind when making your purchase today.

This road map, captured in early October 2021, shows several useful features on the horizon that users of Bricks Builder can look forward to.

Final Thoughts

A consideration that one should have before purchasing this tool is that 1, they are a new product and there are bound to be bugs and features that are missing (but will be added in the future) and 2, this is a theme. Because this builder is a theme, that means that you cannot use a theme underneath it like Elementor. However, if you are building a website with a page builder, we suggest doing it completely from scratch, and that is the mentality of Bricks!

However, if you are looking for a user friendly builder that loads very quickly on both the back end and the front end, is easy to use rivaling the simplicity of Elementor, and offers expansion capabilities for developers who understand PHP, this may very well be the best product on the market even in its early version. Getting in on the lifetime deal for Bricks Builder before they switch over to annual subscriptions may prove to be an incredible purchase in the coming years.