Monday, December 10, 2018
Divi

The Divi WordPress theme complete guide

divi load

The Divi WordPress theme is a bestseller theme. At this time more than 500,000 websites uses Divi around the world.

Even if the handling of Divi WordPress theme is relatively simple, it has so many designing and customization options that makes it hard to master it completely.

If you want to learn all about Divi WordPress theme and be able to control each area of ​​one of the most popular theme of the moment, you are in the right place. You’ve just found a complete guide to learn how to use Divi like a professional.

Index

Why Divi

If so many people chose Divi for their projects, it must be for something. So many people can’t be wrong.

Main reasons why Divi is so popular.
  1. It’s very flexible. With multiple options of customization and configuration that allow you to do almost anything in a very easy and practical way. Ideal for those who do not want to delve into technical issues.
  2. Provides quality support against any possible issue. There will always be someone well trained willing to give a solution to any doubt or problem.
  3. Unlike rest of themes and thanks to its great flexibility, many things can be done without using plugins.
  4. It’s google friendly. Optimized for all types of devices and for search engines.
  5. It lets you create, save, import and export your page layouts so you can use them in different pages in same site or even in other website.

Divi theme licence

The author of Divi wordpress theme is elegant themes, and they offer two kinds of packs for purchasing Divi.

Both plans include not only Divi, but also all of the themes and plugins created by elegant themes and something that few offers: you can use them in all the websites you want.
This is such an advantage over the rest of themes that generally limits use to only one or a limited number of websites.

One year subscription

With a price of 89 USD, this is the most popular package. If you chose not to renew the subscription after a year, your themes and plugins will be no more updated and you’ll lose access to premium support.

Lifetime subscription

An unique payment of 249 USD that will ensure you to get updates and premium support forever. Also you will get any other plugin or theme that elegant themes releases in future.

Divi features

There are so many features Divi offers. After reading this guide you will be able to dig deeply into Divi options and discover many new surprising features .

This the main reason why Divi WordPress theme has achieved such big success, its incredible flexibility for customization and configuration.

Let’s see main features of Divi:

The Divi wordpress theme complete guide - Main features

When installing Divi you’ll have five submenus within Divi tab in dashboard.

  • Theme options
  • Theme customizer
  • Module customizer
  • Role editor
  • Divi library

Role editor lets you restrict some of the Divi functions depending on users roles.

And in Divi library you can store your layout settings for further uses. Import and export layout settings options can be done from here also.

Theme Options

When clicking on teme options, the Divi panel shows up. This is the main section from where you control most of the configuration options of your website, here is where the magic of Divi lives.

The Divi wordpress theme complete guide

General Settings
There are more than 30 options here. Some of them are uploading icon and favicon, number of posts shown in each page, activate Google Fonts or google map, woocommerce integration, social media configurations and much more.

For advanced users, there is a custom CSS box that allows to style directly by coding. Also you can minify and combine Javascript and CSS files to optimize speed of page loads.

Navigation
The navigation panel allows to easily exclude pages from menu, adjust dropdown menu settings and order by name, date, last updated, post ID or author.

You can also set different configurations for categories navigation like hiding empty categories or excluding any category you want.

Builder
This tab allows to set some advanced features for the page builder.
You can tell Divi to generate a static CSS file so it will be served from cache when possible. In many cases, this can enhance performance of website.

Layout
Here you can set what to show in post and pages. Author, date, comments and category can be turned off or on from here.

Ads
In this tab it is possible to set google Adsense key to show ads in posts. Also you can set a banner that will be placed in every post.

SEO

The SEO section allows to control every aspect of SEO for pages, posts and homepage separately.

You can enable and set custom title, description and keywords. Also there are some other interesting options that allows to take advantage of SEO like a pro.

Integration
For more advanced users, this tab allows to enter scripts in different sections of pages and posts.

You can paste scripts in header or body of your website. Also it is possible to add some code in top of posts and before comments, at the end of posts.

Updates
Here you can update Divi WordPress Theme using your API key.

Theme customizer

Like any other theme, it is possible to customize many aspects of web site. But Divi beats any other theme, it has tons of customization options that lets you do almost anything.

Header settings and navigation, footer design, blog posts, styling for mobile devices, color schemes and general settings tabs are here. In each of them you will find lots of options to achieve whatever you want to do.

Module customizer

The module customizer can also be accessed from appearance>>customize. Here you can control the behavior of each type of module that is inserted in the page builder when editing a post or page.

Most of customizations are styling size of headings, fonts, colors, borders, padding and margins. Each module has its own set of customization options. For example the image module can be triggered with animations.

Divi page builder

This is the reason of why so many people loves Divi. Its page builder is extremely easy to use, and very versatile. It is possible to build any kind of content in posts, pages and the homepage.

You can choose from multiple preformatted designs or build your own, adding columns and rows in each block of content.

After finishing your sample you can also save the layout to library in order to use it in any other page or post of your website, or even export it to a file to use it in any other website with Divi WordPress Theme installed

The Divi wordpress theme complete guide

Each section is divided in rows, and each row can have up to 4 columns. There are different divisions of row to choose from. Enough to make any design imaginable.

You can divide row in 2, 3 or 4 columns with multiple choices for widths of columns.

Here we use four rows in the same section, each one with different column layout.

The Divi wordpress theme complete guide

Each section and row has its own settings options, that can be accessed through the three line button.

To be able of setting different customization to each section within the same page is great. It makes things a lot easier and expands the designing and customization possibilities.

When clicking the settings button you will see many options that changes the behavior and appearance of that specific section. Same happens with rows.

There are three options in there:

Content:
Here you can set color, image or even a video to be used as background in each column. It also allows to set gradient color

Design:
There are plenty of customization options in here. You can set margin and padding, customize borders, add shadow to it, adjust blur, opacity, brightness or contrast, and even a complete set of animations effect.

Here you can see what a powerful tool Divi builder is for web designing.

Advanced:
The advanced tab allows to customize CSS coding. Of course, it’s named “advanced” because you need to have advanced knowledge to use this section.

But it also has a very interesting option which is to hide section or row depending on type of device client uses. Smartphone, tablet or desktop computer.

After setting layout, you are ready to start adding modules to each column of rows.

Divi modules

At this moment there are 37 ready-to-use modules. Each one is optimized to each type of content and have its own setting options to customize it.

Everything has been made to fulfill any requirement webpage may have. And there is hardly one kind of module missing.

These are all the modules available to use:

Accordion Audio Bar Counters Blog
Blurb Button Call To Action Circle Counter
Code Comments Contact Form Countdown Timer
Divider Email Optin Filterable Portfolio Gallery
Image Login Map Number Counter
Person Portfolio Post Navigation Post Slider
Post Title Pricing Tables Search Shop
Sidebar Slider Social Media Follow Tabs
Testimonial Text Toggle Video
Video Slider

We are not going to get into each module because it will be very extensive to explain what is each one for. But you can image easily.

As you can see many of this modules offers same functionality of some plugins. So this is how Divi may be used in many ways without having to install any other plugin.

And this is one of the main advantages of using Divi WordPress theme. It has all you need, including some features that many other plugins offers.

Index

At this point you should know how to handle a website with Divi WordPress Theme active. Although creating with Divi can be a little more complex task that involves other advanced abilities.

This guide intends to be a road map for Divi beginners. If you feel ready to go further there are lots of tutorials and documentation out there to learn from.

But of course, the best ones can be found here in our blog. You will find a lot of Divi related content in our Divi category. Check it out.

Seba Rossi
the authorSeba Rossi
Experienced Web Editor with more than 1500 published articles. Passionate about Web development and with advanced knowledge of SEO, amateur guitarist and lover of tasty beer with the company of good and old friends.

Leave a Reply