Build Anything Visually
Your site is powered by something called the Divi Builder. What that means is that you can visually create and manage your content with ease. No need for coding or experience.
Real Time Design
When you make a change to your page, everything is updated instantly right before your eyes. Design instantly!
Customize Everything
Each element is fully customizable. Adjust fonts, colors, sizing and spacing and even apply custom CSS.
Organize With Ease
Add a new row, choose between various column types and everything fits together perfectly automatically.
46 Content Elements
Divi comes with 46 different content elements. Mix, match and build just about anything you can imagine.
Little To No Loading
The Divi Builder is insanely fast. It requires no pages refreshes and almost zero loading of any kind.
Just Click & Type
No need to open up a settings panel to add text content. Just click onto your page and start typing!
Responsive Editing
Enjoy live responsive previews and apply custom changes to specific mobile breakpoints.
Global Elements
Sync global items across multiple pages. Update them once and they get updated everywhere. Great for footers!
Import & Export
Save layouts to your library for later use. Import, export, share and download layouts from the web.
Premade Layouts
Jump-start your design process by using one of the 20+ pre-made layouts that ship with the builder.
Tutorial Videos
Here are a few videos showing you how you can edit your site content via the backend of the website. You can always refer to these videos to help you make your site look exactly the way you want.
In-line Editing
Simply click into your page and start typing to add new text content. Highlight text and adjust its font, color, sizing, styling and more. It’s awesome!
Draggable Widths
Dragging widths and heights is such a wonderful experience in the visual builder. You are going to love how easy it is to create beautiful white space.
Customizable Interface
The Divi Builder is the first page builder to offer a truly customizable interface. Adjust interface elements to compliment your screen and your content.
Instant Content
Add new rows, columns and content elements with ease. Duplicate, delete, copy, paste and watch everything happen instantly. It’s pure magic!
Responsive Editing
Now it’s easier than ever to make your website responsive. Switch between mobile and tablet previews and adjust your design for each device independently.
Drag & Drop
It’s easier than ever to organize your content in the Divi Builder. Just drag and drop! You can even zoom out and re-arrange content from a bird’s eye view.
Customization Options Galore
Your website has hundreds of customization options, all of which are available with live previews in the Theme Customizer. You can play with design and customizations in real time and see what they look like before going live.
Tons Of Header & Footer Options
Your site comes with a plethora of header options that allow you build really unique looking websites. Choose between a left aligned or centered logo. Switch between vertical and horizontal navigation. Adjust colors, enable transparent headers or opt to hide your navigation before scrolling. There are even full screen and slide-in navigation styles that work great on mobile!
An Intuitive Theme Options Panel
Your site’s theme options are very easy to use thanks to its custom theme options panel. Here you can choose to enable the site’s various features, upload your logo, add third party scripts and custom CSS, adjust your website’s color palette and more!
Simple A/B Split Testing
Your site comes with an integrated split testing and conversion rate optimization system backed by powerful stats and insights, and it all works like magic inside the Divi Builder!
Smart Split Testing
Anything you build can be turned into a split test and Divi Leads will automatically track relevant user engagement stats depending on the unique goal you define. Change your content, design and positioning to figure out which combinations are most effective.
Powerful Stats & Insights
Your site gives you the insights you need to make meaningful design decisions that will skyrocket your conversion rates and increase your sales. Track sales, conversions, clicks and bounce rate.
Translated Into 32 Languages
Millions of pages are built on Divi Builder, and the community of people working with me for their websites have build some truly amazing things using these tools.
Arabic
Dutch
Hebrew
Korean
Romanian
Swedish
Vietnamese
Ukrainian
Bulgarian
English
Hungarian
Malay
Russian
Tagalog
Japanese
Spanish
Chinese
French
Indonesian
Norwegian
Serbian
Thai
Greek
Portuguese
Czech
German
Italian
Polish
Slovak
Turkish
Danish
Fully Translated Inside & Out
Not only are front-end elements translated, but we also expanded the theme’s localization to cover the Divi Builder interface, including all form fields and descriptions.
Right-To-Left (RTL) Support
When you enable an RTL language within your WordPress Dashboard, Divi will automatically switch to RTL mode. Not only is the front-end website adjusted, but even the Divi builder interface has been fully customized for RTL users.
Getting Started
Upon creating a new page, you will see the standard WordPress Pages window. When you are using Divi, you will see a [Use The Divi Builder] button in blue. Clicking this will enable the Divi Builder and you will be Presented with with the Builder Start screen.
Save To Library
At any time you can save a layout that you have built to your Divi Library to be used at a later time. This option is great for using a layout on another page, section of a page, or even another website built with Divi.
Load From Library
You can also load a layout that you have saved in the past from your Divi Library at any time. Divi also ships with dozens of pre-made layouts that get added to your library when you install the theme. Loading one of these pre-made layouts is a great place to start when first building a website with Divi. When loading a layout you have the option to select from an array of pre-made Divi Layouts or any layouts that you have saved/imported. See Using Pre-made Layouts and Saving and Loading Custom Layouts.
Clear Layout
If at anytime you feel the need to start from scratch, just click the Clear Layout button. Sometimes you just need a fresh start. This will delete everything you have built on the page and give you a clean slate.
Below these three buttons is your Divi Builder Layout. These is where you will be adding Sections, Rows and Modules to your page in order to construct your layout. When you free enable the Divi Builder, all you will see is the empty section shown above.
Sections Options
Every time you add a section you will need to define its properties. By clicking the section menu icon at the top of the blue side panel you will be taken to the Section Settings.
Adding and Defining a Row
After saving your section settings you will need to insert a row and define the row type. By clicking ‘Insert Columns’ you will be able to choose from a selection of row types. Rows also have lots of options that you can use to customize their appearance and alter the structure of the layout.
Adding a Module
Once you have selected a row type, you will be prompted to insert modules into that row. In the example below, we added a two column row.
Every Time you want to insert a module, you will need click ‘Insert Module’ and select one from the Divi module list. Once you have selected a module you will be brought to that modules specific options modal. Each module has a different purpose and a different set of options.
Adding Full Width & Specialty Sections
Below each section you have the option to ‘Add Standard Section/ Fullwidth Section / Specialty Section / Add From Library’. Full width sections are unique in that they do not have rows. Because of this, only full width modules will work inside of this type of section. Full width sections are visually defined by a purple side panel and can be placed anywhere in your layout. In the Example below, we have added a full with section, with a full width Slider to our design.
Specialty Sections are unique in that each specialty section has a horizontal row that expands the height of the entire section. This allows you to create classic “sidebar” layouts, where a single sidebar sits adjacent to more complex column structures. In this example, I have added a specialty section at the bottom of my page.
You can also load Sections that you have saved to your Library in the past by clicking the “Add From Library” link.
Modifying and Rearranging Your Layout
Editing your layout is very easy using the drag and drop builder features. If you want to move a section above or below another, simple drag and drop it in the desired location. Same goes for rows and modules. You can even move rows to different sections and modules to different columns. The only limitation to this is that you cannot drag Full Width Modules into regular sections and you cannot drag regular modules into Full Width Sections.
In the example below, you can see that moved our full width section to the top of our layout and moved our specialty section in between our existing sections.
Save and Publish!
Once you have finished building your layout, be use to click the Update/Publish button in your WordPress Dashboard. You will love the results.
Switching Back to Default Editor
If you Switch back to using the default page editor you will will be warned that all of the content you built with the builder will be lost and your previous contents made with the default editor will be restored. As a failsafe, WordPress versions all of your previously published updates and you can also save your layout before reverted if you ever want to restore a layout. See Saving and Loading Layouts
Rock Solid Security
We take security seriously, which is why we partnered with Sucuri.net to make sure Divi tighter than Fort Knox. Sucuri found zero issues with the theme, and you can rest easy knowing your precious website is safe.
