How to build an WordPress site using Bricks Builder (r)

-sidebar-toc>        -language-notice>

Making your own WordPress website doesn't need to seem daunting, even for those who are just starting out. If you have the right tools and guidance and guidance, you'll be able to have a sleek, fully functioning website online in no time.

The Brick Builder's Overview

The application offers a live front-end editing experience This means that you will see your changes immediately while you edit designs and layouts.

It provides a comprehensive set of templates that are pre-designed, a vast array of design elements, and advanced customization options for more detailed web design.

Additionally, Bricks Builder supports dynamic data, allowing users to build data-driven websites easily and incorporate content in a dynamic way across their templates.

Benefits of the use of Bricks for WordPress

Bricks Builder stands out for its efficiency and versatility. It's a fresher, but more durable alternative to the other builders, offering:

• Speed -- Bricks is extremely quick and light.
• Easy to use The user interface is easy to use and easy to use to learn for professionals as well as beginners.
• Customization -- Bricks allows for extensive customization via customized CSS and JavaScript and is compatible with an array of WordPress plugins.

Starting by using Bricks

In order to activate the license head to the dashboard, click Activate License and then enter the license key that you have received from your Bricks account, and click Activate. This will enable full functionality for your Bricks theme.

If you like to try Bricks before committing to a purchase, you can set up a trial account at try.bricksbuilder.io. This platform provides the ability to access the pre-configured WordPress website with Bricks installed, allowing users to test its capabilities and capabilities for free. fee.

How to launch this page? Bricks page builder

For creating a page with the Bricks page creator, go to Pages > Add New or click an already existing page. You can launch the Bricks editor by clicking on Edit in Bricks.

It is now possible to drag elements from to the Panel of Elements to design your page.

Understanding the Bricks interface

The Bricks interface allows seamless integration with WordPress. WordPress environment.

Here's a breakdown of its core interface:

• Builder workspace -- The main part of Bricks is the workspace for builders that is a graphic illustration of your website. Here, you can communicate directly with your website webpages, by moving elements into position, moving them around, and rearranging components.
• Toolbar located at the very top of your workspace The toolbar gives quick access to essential functionalities such as saving your work, previewing your site while also using the settings menu as well as the responsive controls.
• Elements panel The panel is located on the left side of your interface is the element panel functions as your toolbox. It houses all the components you could use on your site, such as images, text boxes, buttons, and more. You can drag these elements directly from the panel onto your page.
• View of the structure is often placed next to or in the elements panel, structure view provides a hierarchical sketch of the page. It is especially useful for understanding the layout and the depth of your elements, allowing you to modify and select nested elements quickly.

Using custom fonts in Bricks

The section allows you to download your font files in a variety of formats, such as WOFF2, WOFF, and TTF. You can also upload different variants of font, including regular, thin, semi-bold, and bold.

For adding a font that you have created to your account, simply click "Add New". Then, enter a name for the font in the Add title field. After that, you must select the variant of font you would like to upload, then select the font's style and click to edit.

A dropdown appears with fields for uploading your font files. Pick your font file, and then upload it. It is possible to repeat the process when you click Add a font variant for as many variants as is possible. After that, press publish.

In order to add your newly customized font uploaded to the text on your WordPress website, you must take these steps:

1. Go to the page where you wish to install the new font. Click Edit with Bricks.
2. Select the text you wish to edit.
3. The information about the text you have selected is displayed on the left panel. Simply click on STYLE.
4. Expand the TYPOGRAPHY dropdown to explore other options.
5. Within the Font family section, you can browse through the fonts available, including Google fonts, as well as custom uploads.
6. Choose your font of choice from the drop-down menu to change your text instantly.

The text you typed will display using your custom typeface, bringing your site to life with a an individual look.

By using templates within Bricks

Templates are the most important aspect of Bricks and are available in a variety of styles, like headers, footers, as well as blog post designs. These templates can range from a single section, like a website header or a hero section, up to full-page pages, including blogs post layouts, archive pages, Search results, as well as error pages.

Making a template

Create a template

1. Navigate to the Bricks >> Templates on your dashboard.
2. You can choose to add a new template or import an existing one.
3. Click      Add New     , select the template type first, and then select      Editing with Bricks     .

Utilizing templates

A template can be applied to the page:

1. Navigate to the page where you would like to apply the template.
2. Click here to      Templates     (folder) icon on the toolbar for builders that opens the templates section.

1. On this page, you will be able to access both the templates you created as well as those from Community templates.
2. Choose the template you want and check it out.

1. Clicking is the final step.      Insert     to apply it.

Remote templates

Bricks' templates are unique in that they offer capabilities not found in other site builders. Remote templates are templates that have been created by Bricks and then used on other websites you want to use in your own site.

If you want to allow other websites to use Your Bricks templates, visit Bricks Settings > Settings Settings Templates within your WordPress dashboard, and then enable your My Templates Access checkbox.

Use whitelisting URLs as well as Protecting Passwords to limit access to templates only to those who have the right password.

To use templates from other sites, go to Bricks > Settings > Templates, scroll to the Remote template section and paste your URL from the Bricks site you want to download templates from into the Remote template URL field.

If you have set the password, make sure that you write it under the Remote template Password. Then click Save Settings.

To access these templates visit the page builder, and then click Templates like before; a new section of Templates from Remote will open that contains all the templates on the remote website.

Using dynamic data in Bricks

Bricks allows you to incorporate dynamic data into templates and pages, making it a versatile tool for building dynamic websites.

You are able to add dynamic elements such as posts with titles, featured images publications dates, author names, categories, tags, site titles, and all your customized fields.

Dynamic data can be extremely useful when creating specific templates in Bricks, such as your blog templates or templates to create custom post types, such as the single property listing.

For dynamic data to be added, start typing {the letters on the canvas, or click on the "bolt" icon that is next to many fields of the settings panel.

Here's how to create an entire template of posts by using Bricks to generate dynamic data:

1. Navigate to Bricks and click Template to make a brand new template. Assign a title to your template, change its kind to single, and then either either publish the template or Save it as draft.
2. Click on Edit with Bricks to configure the template so that it uses the latest data.
3. Style the page as desired. Typically, you will want elements such as the title of your post, featured image, publication year, name of the writer and post's content to display in a dynamic manner.
4. On a blank piece of paper, add a title and content by inserting      post_title     In the form of      Heading     element as well as      post_content     within the context of      Textual basics      element.

Set this template to be the default template for any post:

1. The settings icon is located in the toolbar. Go to the Template Settings > Conditions Click the + ADD CONDITION button.
2. Select      Post Type     and specify      Posts     .

1. Ensure you save and update the template on WordPress. Then, navigate to the      Posts     The page will show each article that has been formatted using the updated template that does not have any styling.

For a simpler styling of this template, add a default post to use to reference the elemental elements that are dynamic:

1. The settings icon is located in the toolbar, and go to Template Settings and then POPULAR CONTENT.
2. Select      Single post/page     as the content type as the content type. You can also select a specific article as the template content. If there isn't one, be sure you look for one before clicking      APPLY PREVIEW     .

1. It is now possible to display things like the title of your post and content using the selected template post.

Additionally, Bricks supports using content taken from Advanced Custom Fields (ACF) that allows you to design custom, detailed pages.

Handling form submissions with Bricks

The form submission feature was added in Bricks 1.9.2 to allow users to record form submissions. This allows you to create a custom table named bricks_form_submissions in your database (plus your WP database prefix).

It is possible to enable the new Save form submissions in the database settings in Bricks Settings > General Miscellaneous.

Click save settings. Form Submissions will open ( Bricks > Form Submissions) that will hold your various form submission tables.

Collection of form submissions

Collecting form submissions in Bricks is not a requirement for an extra plugin. You just have to use Form element Form element to create a form and then set the required fields.

In the settings panel In the settings panel, select the Actions, then select the Save Submission Action.

Next, then click Next, click Save Submission settings. This will provide the form with the name you want it to be. The name is utilized to retrieve data from the form.

Now, when you save the form and launch it, you will be able to open the webpage. You can complete the form before returning the page to Bricks > Form submission to see the form data.

It is also possible to download the CSV file of various forms you can fill out. On the Bricks > Settings > General > Miscellaneous section, where you set up the feature, you are able to change or remove the table in the database.

Utilizing WooCommerce by integrating Bricks

Bricks work seamlessly with WooCommerce, providing a robust inside-theme editor to build your entire store, beginning with the shop's main page, to the individual pages for products and archives of products, carts, checkouts, and page for accounts.

Bricks provides specialized components as well as templates that are specifically designed to work with WooCommerce, allowing customers to customize their store's layout.

For the first time, you can use the WooCommerce Builder in Bricks, download and then enable your WooCommerce plugin. Once activated, you can utilize Bricks to design visually and personalize different WooCommerce templates like how you create single post designs.

To create a simple Shop page:

1. Navigate to Pages and then select to go to the Shop page.
2. Click here to      Editing with Bricks     . The Elements panel includes a variety of products' elements. This panel lets you display items, titles, descriptions price, descriptions, and much more making it easier to create dynamic templates.

Using these elements, you are able to arrange and style your page in the way you like.

Like creating a single post template, you could create a single product template and set its conditions to work with all products.

Query loops are present in Bricks

The Query Loop creator lets you query your database according to the parameters of your query and then renders the result of your query to display inside the loop. It's a good choice for layout elements like container as well as Accordion, Slider and.

It's possible to search for post types or taxonomy terms as well as users. You can, for instance, request a list or blog authors, community members, and team members.

To make use of the Query Loop create a container to the canvas. Set the Utilize the Query Loop setting to transform the container element into a looping element.

Once you've enabled the Use Query Loop option You'll be able to see a query Control (infinity symbol). Select the icon to launch the query control and set the parameters of your query to retrieve data from your database.

This container is now the repeater element. The elements within this container will be repeated as frequently as they have query results. This guide for the academy explains how it works.

Bricks pricing

Bricks doesn't have a free plan. They only create an account to allow you to try their themes, however they won't let you use the theme on your website unless you purchase.

Bricks offers simple plans as well as a lifetime plan. The lifetime plan is unlimited benefits, but the user can decide on what they want.

It is a great way to enjoy getting everything you'll need within the platform, contributing to a smooth and effective workflow, providing a great investment in those who are looking for a powerful and versatile web design solution.

Bricks review is it worth a try?

The main drawback could be one of the reasons Bricks does not offer a free version, unlike Elementor. However, Bricks Builder has been receiving attention from industry professionals because of its combination of ease and powerful features.

A 2024 survey that included 1,144 WordPress professionals carried out by The Admin Bar says that "Bricks was the only page builder to increase the number of users it has over the previous years, and raking in 32 percent from the overall" in the following table:

This shows how many WordPress experts are taking it up even though it is still an comparatively new option on the market.

Bricks is a fully-featured theme. It is not possible to mix and match features of other themes in the page builders. Also, in terms of speed, since it is a more recent page builder specifically designed for highly-performing sites, Bricks Builder is reputed to be faster that Elementor Pro.

Utilizing a web page builder built for speed isn't enough to guarantee the best quality of performance. Regardless of the type of website you are building, your hosting provider is a major factor in its performance.

Summary

The article focuses on what is known as the Bricks Builder, its workings as well as some of the capabilities, and the best way to utilize the features. The article has examined the extensive concept of theme-based programming, the ability to customize, and performance benefits.

While Bricks isn't a version that's free as Elementor, its integrated design and regularly updated features could offer greater efficiency in making their site more efficient.

    Have you got any queries regarding how you can use WordPress Bricks? WordPress Bricks theme builder? Please let us know by commenting below!

Joel Olawanle

Joel is a Frontend developer working at as a Technical Editor. He is a passionate teacher and enthusiast for open source and has published over 300 technical papers, mostly on JavaScript and it's frameworks.

•                   Website                                              
•                   LinkedIn                                              
•                   Twitter                                              
•                   YouTube