Divi is a WordPress theme with page building functionalities built into it. It’s Elegant Themes’ premier WordPress theme. The company released it at the end of 2013, and it continues to be a powerhouse in the page builder industry to this day.
Divi is a premium-only product, so you’ll need an active membership with Elegant Themes to install and receive updates for it.
It’s also a WordPress theme first and foremost, so you don’t need to worry about finding a theme that’s compatible with it. However, Elegant Themes has exported Divi’s page building functionalities into a plugin called the Divi Builder if you already have a theme. The plugin is bundled into Elegant Themes’ membership.
As for the theme, let’s go over some of its most notable features.
Key Features of Divi
- Theme Options + Builder – Divi is a WordPress theme with page building functionalities built into it. This negates the need for you to install and manage a separate theme on top of a page builder plugin. It also gives you access to customizable theme templates (404 page, archive pages, etc.), headers, footers and global theme options.
- Drag-and-Drop Frontend Editor – Build and edit your pages in real time and without a single line of code with Divi’s drag-and-drop frontend visual editor.
- 40+ Content Modules – Divi has over 40 content modules you can use to fill your pages with various web design elements. A few examples include styled text, images, forms, calls to action and buttons.
- 1,100+ Premade Templates – From full landing pages and complete website packs, you can build websites quicker with a library filled with premade designs.
- Customization – Customize backgrounds, colors, fonts, font sizes, padding, hover effects, animation styles and more with simple point-and-click maneuvers.
- Developer Features – Divi comes with a fully-featured code editor complete with syntax highlighting alongside the ability to add custom CSS to any module. You can even lock specific parts of the builder to prevent clients from making drastic changes.
- Find & Replace Tool – Change colors and fonts across an entire page in a few quick seconds with Divi’s built-in find and replace feature.
- Color Manager – The editor remembers your recent and most used colors and stores them for quick access. It also generates a unique color pallet for you based on your most used colors.
- Split Testing – Test two different variations of a design or content against one another to see which one performs best. Divi will display one design to half of your audience and the second design to the other half automatically.
- WooBuilder – Add products, including prices and Add to Cart buttons, to any page with a built-in modules for WooCommerce.
- Divi Library – Save your own page and module templates and import them for quick use later on. You can even export your entire library and import it on an entirely different Divi site.
- Elegant Themes Membership – When you purchase Divi, you gain access to ET’s entire collection of products. These include ET’s email opt-in plugin Bloom and their social sharing plugin Monarch.
Getting Started with Divi
Divi is a premium WordPress theme, so you'll need to download a copy of its ZIP folder through your Elegant Themes account and upload it to your site as you would with any other premium theme. The Divi Builder is integrated into the theme seamlessly, so you won't need to install anything else.
It's just a matter of adjusting Divi's theme options to suit your needs after that.
They're divided into the following tabs:
There are quite a few settings to go through, but they're simple to adjust and require little to no technical knowledge. There are dozens of style settings you can configure in the live theme customizer.
These settings affect styles across your entire site, but you can override them when you build pages and posts from scratch with the Divi Builder.
How Does Divi Handle Page Building?
You can use the Divi Builder plugin with any theme, including MH Magazine Pro, but Divi works as an all-in-one solution. Even so, the builder is disabled by default, and you'll have a choice between it and WordPress' default editor when you create a new post or page.
The builder will use the default page layout you chose in the theme option and customizer sections, but you can override this by choosing the Blank Page template. This template has no header, footer or sidebar.
If you choose to use the Divi Builder, you'll be redirected to the frontend editor automatically and will have the option of choosing between one of three starting points: building from scratch, choosing a premade layout or cloning an existing page.
Divi will use the theme's default header and footer layouts if you don't choose the Blank Page template. You can change the layout for each in the Theme Builder section located within Divi's settings.
We're mostly concerned with Divi's page building capabilities in this review, so let's switch gears and focus on the editor for a while.
The Divi Builder
A Divi page is comprised of sections made up of rows/columns that are filled with content modules. There are 20 premade row layouts by default, but you can resize any module area at will by dragging its size to your desired width.
Unfortunately, ET removed the Make Row Fullwidth setting, but you can still make rows fullwidth by navigating to the Design settings and adjusting Width and Max Width to 100% under the Sizing section.
Speaking of settings, let's talk about the way you can customize sections and rows in Divi. Sections, rows and modules all have their settings arranged in the same three sets of tabs.
We'll get to modules in a bit, but sections and rows have the same set of settings in the Content tab. You can assign links, add background colors or images, and assign admin labels.
The Design tab is much more comprehensive. You can start by adjusting widths, heights, padding and margins in the Sizing and Spacing sections, as mentioned before. You can then move on to borders and box shadows, many of which appear to be inspired by Google's Material Design.
There are also a number of different style settings you can adjust under the Filters, Transform and Animation tabs.
The Advanced tab is mainly intended for developers as it has sections for CSS IDs and classes as well as custom CSS. However, it's also where you can configure Visibility settings if you need to hide certain sections, rows and modules for specific devices.
Let's dive deeper into Divi's content modules.
Divi's Content Modules
Divi's 40+ content modules are arranged alphabetically. This collection is more than enough for you to build well-designed landing pages that suit any purpose.
You can combine or customize certain modules to transform them to your liking if a specific design isn't available by default. You can also save section, row and module designs to the Divi Library if you feel you'll need them in the future.
Source: Owned by the author
Module settings differ per module. All of the settings available for sections and rows are there, but there are plenty more available. For instance, you can configure text and alignment settings for buttons as well as layout settings for pricing tables.
If you don't want to build from scratch, you can choose from over 1,100 premade layouts made by ET themselves. These are arranged in over 150 website packs, giving you the ability to build an entire website with a uniform design on the fly. ET requires you to authenticate your membership API key in order to import its own templates into pages.
Source: Owned by the author
Unfortunately, Divi doesn't have premade modules. You'll need to create your own and save them to your library or save individual sections, rows and modules from premade page layouts.
Thankfully, saving designs to the library and using them later is easy, so you should really only have trouble with your first design.
Divi is undoubtedly one of the most powerful WordPress themes in existence. It allows you to customize various sections of your theme and utilize key marketing tools, including split testing and opt-in forms.
Most importantly, and certainly most notably, it has the Divi Builder, a tool that changed the page builder industry when the theme launched in 2013. This tool gives anyone the ability to build stunning web designs on the fly. It's easy to use and has numerous features that make it possible to tweak, not only posts and pages, but your entire theme to your liking.
Despite what it's done for the WordPress page builder community, Divi does have a few drawbacks when compared to other page builders that have entered and innovated the scene.
The user interface has an intuitive layout, but using it feels slow and clunky at times when compared to other page builders. Some things also take a few more steps than they should. The lack of premade modules is also disappointing, especially given the fact that ET has put forth the effort to release over 1,100 full page templates for Divi in its 6+ years of existence.
Even so, Divi is still one of the most powerful themes available for WordPress, and it's available at a fantastic price. For $89/year or $249 for a lifetime license, you can get access to Divi alongside the standalone Divi Builder plugin, the Extra magazine theme, Bloom, Monarch and ET's entire theme collection.
A 30-day, money-back guarantee is available on all purchases.
- Divi – Edit Content Module: Owned by the author
- Divi Templates: Owned by the author