Divi Builder Review: create your website without touching a line of code

Looking for a visual content editor for WordPress by Drag & Drop? Divi Builder is a plugin designed by Elegant Themes, a company dedicated to developing premium WordPress plugins and themes. This company is known worldwide for its Divi theme. a multipurpose WordPress template.

Thanks to the launch of the Divi Builder plugin, you can now add this powerful visual content editor to any WordPress website. The Divi Builder plugin now also includes a visual version (Front end) apart from the traditional backend type. The new unified Divi builder lets you toggle between backend and visual modes instantly. In addition, the builder interface has been optimized to make it much faster.

In this post we are going to talk in depth and in detail about the Divi Builder plugin, what features it has, advantages, how it is installed, we will do a tutorial, give our opinion, explain the prices and much more.

Divi Builder plugin Step by Step Guide in 2022

In this guide of 2022 we will talk in depth and in detail about Divi Builder, it offers us millions of facilities to build your entire website.

Divi Builder plugin for WordPress Review: What Is Divi Builder?

Divi Builder is an Elegant Themes plugin to be able to integrate the Divi Builder on websites that are using the Divi template or another. Divi Builder is one of the best plugins in the field of visual editors for WordPress, competing with the prestigious Visual Composer and Thrive Content Builder.

Divi Builder offers us the ability to create multi-row and column layouts for your pages and posts. It also includes a selection of ready-made page layouts that you can use as is or customize.

Divi Builder was created to make the design and layout process as easy as possible without the need to know anything about code, in an intuitive and easy way. The Divi company has designed more than 80 themes and other products, among which we have to highlight:

  • Monarch: Social Media plugin through which you can make them follow you on social networks and share your content.
  • Bloom: a plugin to create Opt-In Forms, very important to attract subscribers.

Advantages offered by Divi Builder

  • Divi Builder is a multi-pluign
  • One of the best drag and drop page builders (Drag and Drop) with multiple modules, layouts and predesigned sections
  • Does not require knowledge of HTML / CSS
  • Excellent graphics and aesthetic design
  • Divi Builder fits seamlessly with your Divi theme
  • Compatible with Aweber, WooCommerce, Google Maps and MailChimp

Divi is For Everyone

  • Self-employed
  • Agencies
  • Website owners

General features of Divi Builder

Divi Builder have a lot of different features and options. Next we will talk about the most important ones to highlight:

Easy to use

divi website builder

Designing your website with Divi Builder is quite easy with just a few clicks. You will be able to copy, paste, duplicate, change the size of the fonts and much more in a totally visual and fast way. It also works with Drag & Drop, so we will move the elements wherever we want. You just have to click on the item, hold down the button and move it to a new place.

Variety of designs

Divi Templates Layouts Library

Divi Builder is very versatile thanks to all the design elements such as rows, sections and modules. The plugin has 20 types of rows, with 3 types of sections, and more than 40 modules that, together with their advanced configuration options that it offers, you can create completely custom designs.

Insert Module in Divi Builder

The modules are basic blocks of the design, each one of them will provide you with a different functionality: map, images, text, advertisements and much more.

Configuration options

Design Settings and Configuration Options in Divi Builder

Divi Builder allows us to customize and configure each section, row and module that is made up of a series of advanced, general and special settings via CSS.

Editing modes

image settings on divi builder

The plugin offers you two ways to edit your content:

  • Frontend: To design each entry and page of your blog in the visible part of your website and see how your website is going.
  • Backend: it is the layout mode that has been used from the beginning. It is found in each entry and page of your WordPress administrator blog.

Customization via CSS

Custom CSS with Section Style Manager Pro in Divi Builder

Each element of the Divi Builder has a section dedicated to CSS. If you have knowledge of CSS, you can customize your website in a modular way and without limits, without affecting other parts of the web. You can also give it identifiers and classes to style it through a child theme.

Responsive Design

Responsive Design with Divi Builder

Divi Builder makes it very easy for you, so your project will be visible on tablets and mobile devices. It has many settings and configuration options, so you can set specific values in properties such as padding, margin, font size and much more.

Divi Library

Load Layout from Library in Divi Builder

Divi Library allows us to save the complete design of each page and each element of your website. With this we will save a lot of time, simply save each element that interests you, export it in a file and import it on another website where you have Divi Builder installed. So that your projects never start from scratch, Elegant Themes offers a wide variety of downloadable designs.

Divi Role Editor

User roles in Divi Builder

Divi Builder includes the Divi Role function, it is a configuration panel to grant permissions based on the type of user, be it editor, administrator, author or collaborator. Having control over each of the elements of your website is essential when you need help. of more people who collaborate in your project.

Divi Leads

Divi Leads Headlines in Divi Builder

Divi Leads allows us to have a system to evaluate the conversion potential of certain elements of your website.

How To Install Your Divi Builder WordPress Plugin

Installation is pretty straightforward with the WordPress dashboard plugin installer.

1. You must first upload it to your WordPress website through the WordPress control panel to update your new plugin.

2. When you download Divi Builder from the Elegant Themes Members Area, a file called divi-builder.zip will be downloaded.

3. Once you have located your divi-builder.zip file, you can upload it to your WordPress website.

4. Log in to your WordPress dashboard and click on the “Plugins” link and then “Add New”. It will take you directly to the WordPress plugins page.

add new plugin in wordpress

5. Once you have the add-ons page loaded in your dashboard, click on the “Load add-on” button at the top of the screen. Click this button to proceed to the next step.

upload plugin zip file

6. After clicking “Upload Plugin”, we will install the divi-builder.zip file that was downloaded earlier. Click the “Choose File” button to open a local browser window.

choose plugin zip file

7. Once you have located the file, select it and click the “Open” button. Then click the “Install” button. Once the plug-in has loaded perfectly, you can click the “Activate” button.

select plugin zip file

Building Your First Page with Divi Builder

If you want to build your page with Divi Builder you will only have to use the three basic building blocks: Sections, Rows and Modules.

Building Your First Page with divi visual builder

Adding Your First Section

You will need to add a section first before you can add anything to your page. Sections can be added by clicking the blue button (+). When you hover over a section that already exists on the page, a blue (+) button will appear below it. Clicking will add a new section below the section you are currently on. If you are starting a new page, you should know that your first section will be added automatically.

Adding Your First Section with visual Divi builder

Adding Your First Row

Once you have added your first section, you can now add rows of columns within it. A section can and can mix and match rows of different types of columns to create different layouts. Click the green (+) button within any section that is empty, or click the green (+) button that appears when hovering over any row to add a new row below it. Once you’ve clicked the green (+) button, a list of the available column types will appear.

adding your first row with divi builder visual

Adding Your First Module

Click the gray (+) button to add a new module that exists on the page when hovering over a module or click the gray (+) button to add a module that exists within any empty column. Once you have clicked the button, a list of modules will appear. Choose the module you want and it will be added to your page and the module configuration panel will appear.

Modules are the content elements of your page, and Divi comes with over 40 different elements that you can use to build. Modules can be added within rows, and each row can host different modules. You can use more advanced modules like Sliders, Portfolio Galleries and eCommerce Shops or more basic modules like Text, Images and Buttons.

adding your first module in visual divi builder

Configuring And Customizing Sections, Rows And Module

Each section, row and module can be customized in different ways. You can access an item’s settings panel by clicking on the gear icon that appears when hovering over any item on the page.

Configuring And Customizing Sections in Divi Builder

When you open the configuration panel for the item, you will see that each configuration panel is divided into three tabs: Content, Design, and Advanced. Each tab is designed to make adjusting and accessing the variety of Divi Builder settings quick and easy.

  • The Content tab: allows you to add content such as videos, images, links, and admin tags.
  • The Design tab: allows us to control a wide variety of design settings with one click such as: spacing (padding / margin), typography, button styles and much more.
  • The Advanced tab: allows you to adjust the visibility according to the device and where custom CSS can be applied.

The best plugins to use with Divi Builder

  • Yoast: is a search engine optimization plugin for WordPress. The plugin has five million active installs All in one SEO: it is the original WordPress SEO plugin.
  • Woocommerce: is an open source e-commerce plugin for WordPress.
  • WPML: it is the plugin that converts more than a million WordPress sites in multilingual
  • Aweber: allows you to grow your email list quickly and easily.
  • Google Maps: Create custom Google Maps with high-quality markers containing descriptions, locations, images, categories, links, and directions.
  • MailChimp: allows us to send commercial emails, notices of publication of a new post, content bulletins, welcome emails.

Divi Builder Tutorial

Divi Builder is one of the best plugins in the field of visual editors for WordPress, here you have a complete Divi Builder tutorial so you can see step by step how everything works.

Support and Documentation for Divi Builder

You have access to the forum if you purchase some Elegant Themes plans so that you can post problems and questions and be answered by the technical support staff. The team is available 24 hours a day, 7 days a week. They usually respond in less than an hour and we are often available for instant live chat.

divi support

Elegant Themes offers extensive documentation of all its products to quickly resolve questions or problems. Here are the direct links where you can find all the support information they offer:

Frequent Asked Questions

Why choose Elegant Themes?

Elegant Themes is a leader in WordPress development for 12 years. They have creating WordPress themes and plugins. Divi has become the world’s most popular WordPress theme and includes the most advanced page builder on the market.

Can I use themes and plugins on multiple websites?

Yes, you can use all the themes on the websites you need. There is no restriction on the number of times you can download or use a theme.

What if I change my mind and want a refund?

Within 30 days of your purchase a refund can be made.

Plans and Pricing

You have two plans: Yearly Access and Lifetime Access

  • Yearly Access: It costs $89 per year.
  • Lifetime Access: You pay $249 one time.
Elegant Themes Price Plans

Opinion

Divi Builder is one of the best WordPress builders that currently exist on the market. It is quite easy to use, versatile and is constantly being updated thanks to the team behind Elegant Theme.

Divi Builder is a visual Drag & Drop builder that allows you to add any type of element, drag and drop it wherever you see fit on the page you are designing. Now it is compatible with WooCommerce.

👉 Click here to Buy the Divi Page Builder on their website Now

What do you think of the Divi Builder plugin for WordPress? Have you used them for any of your website projects yet? Feel free to add a comment below.

Photo of author

Editorial Staff

The Editorial Staff at O3Magazine is a team of WordPress experts and enthusiasts who work hard every day to report on the best that is currently in the world of WordPress and web development. We want you to achieve the objectives of your project with total success. With our website we also want to share our experience and our knowledge after years of experience in this sector.

Disclosure: This post may contain affiliate links, which means that if you click on one of the product links and then purchase the product, we may receive a commission (at no additional cost to you). The opinions on this page are our own and we do not accept payments for positive reviews.

Leave a Comment

O3Magazine