[Update] Since the release of Divi 2.0, many new updates has been released, you may want to check out latest post about Divi 2.5. Plus we were also able to secure an exclusive 20% discount for WPKube readers.
For the past 5 years, Elegant Themes Inc. has been pumping one WordPress theme after another with each one topping the other.
Over the past year or so, the team at Elegant Themes designed, built and released their newest theme named Divi to go along with their other 86 themes that they have available in their theme club.
In recent months, they began to tweak things in the Divi theme and in May of 2014 they released Divi 2.0.
With this release, they’ve packed in a few other features to their new theme to give what they have called “Countless Possibilities” to the design capabilities of the site.
For this review, I wanted to give you guys an overview of the newest features in Divi, and then, take you through a brief walkthrough of the process of building and editing a page using one of the predesigned layouts to see if this theme is in fact all it’s cracked up to be.
Let’s get started with the features. (Note: There’s a surprise at the end of the article!)
Divi 2.0 Features
The main feature in Divi, besides it being a Responsive Theme, is the Page Builder that allows you to design all of your pages in the backend on your site without ever writing a line of code.
To build on a page using the Page Builder, you have to follow these steps:
- You start with a Section (choose from: from a full width or speciality section)
- Add a Row
- Instert a Column and choose from the layouts there
- Add a Module of choice
- Add content to your Modules
With the 2.0 update, the team at ET has added a few more features to the options given in the page builder that are worth taking a quick glance through.
It gives you ability to quickly and easily copy all the features of a certain element with a single click of the mouse. This can save quite a bit of time in your designing of a page which I quite like.
Now not only do you have the 11 original section options to choose from, you have an additional 9 options of layouts to toy with and give your pages a fresh look.
Some additional designing features to the new Divi Theme were the Updated Header Options.
Now you have the choice of:
- A Centered Logo
- An Accent Bar at the very top of the page where you can place contact info or Social Media icons
- The options of Vertical Navigation
- Boxed Layout with the option of adding a background to add some depth to your site
As well as:
- New blog post formats. You can add video, audio, quote, gallery or link post format types to add variety to your blog.
- Fullwidth and Filter Portfolios. Create fluid portfolios, or a horizontal carousel with the fullwidth option or a filtered layout for a nice user experience.
- Thirteen New Modules and Updated Look To Old Modules. Some of the new Modules include Map, Fullwidth map, Member Login, Team Member to name a few.
It’s clear that Nick Roach and his team have put serious work and thought into the new features and elements now available in Divi 2.0.
But the real question is, how easy is it to actually use?
There are other drag-and-drop WordPress themes and plugins around (including one plugin by Elegant Themes) and so I wanted to to take things for a spin myself to show you guys if this was an actual theme worth using.
Building A Page in Divi 2.0
So why would I spend my time showing you guys how I built a page with the Divi Theme?
Because, for the most part, all reviews that I’ve come across thus far show very little about actually building and designing with Divi.
This way I felt you guys will have a better understanding of the product, but I’ll also try not to drag it out as to give you too much information at once.
As that is my goal I am just going to use the pre-designed Homepage Basic Layout and design it to my specifications and briefly walk you through how I did it.
Let’s get started.
After uploading the theme to my WordPress Dashboard, I navigated over to Homepage and clicked on the “+ Load Layout” option for the Page Builder. To keep things simple I choose the Homepage Basic layout at the very top.
This it the backend output of that layout.
And this is what the page, or frontend, now looks like without any customizing from me.
Visually, you can see the contrast from what the backend looks like compared to the actual page.
It’s pretty simple and rather clean looking; everything you see here are the default settings that come with the Divi theme.
However, you can even make some of the major change to your entire design without using the page builder.
To make some of these changes, use the Customize option from the drop down menu in your WordPress menu at the top of your page.
Using the options available there, I changed the look from the above picture to the one below. (Most of those changes affected the header and background, so I didn’t do a ful screenshot.)
From the Customize option, I was able to:
- Add a Boxed Layout to the site
- Change the Site and Header background color
- Center the Logo
- Add a Top Accent Bar with phone number, email and social media icons while adjusting to desired color
- Change the Body, Menu and Header font and Header font color
How much time did that take?
Under 5 minutes. (Yeah… I was surprised too!) And I never touched a line of code or the backend page builder for those edits.
Now it’s time to edit the page content using the Divi Page Builder.
Without touching the layout or adding to any further sections, I spent some time and tweaked things within the Sections and Modules to change the look of the Homepage.
It takes some time to get a real feel for the page builder, but after toying with things, I finally came up with a decent rough draft.
Though I didn’t change the original layout or add any Sections to it, you can see that the overall look of things has changed.
Editing something like the background color in a Section can take some time to figure out, mostly because it’s hard to find the correct button.
Click the 3 Link symbol to access and edit that particular Section’s settings.
Here you can change the background color, add a background image or even insert a video as the background.
And honestly, that really just brushes the surface of how far you can go with even that. But what’s nice is that what would have taken me 10 minutes in writing code took 3 clicks of a mouse.
To edit the content in a Module, like I did with this Fullwidth Header Module, I simply had to click the same 3 Line Symbol of that designated module and a make my edits as needed.
I quickly did this to all the Modules on my site and was able to pump out a clean but colorful design.
How long did those edits take? Well, this process was longer than my previous edits. This took about 45 minutes to get to just this and I think if I were to make it perfect, it would take me another hour on the Homepage alone.
Most of my time though was first spent on getting a feel for how the page builder worked and then tweaking my edits till they got to a presentable standard.
Even still, (perfectionist that I am) there are still many things I could/would do to turn this into something that could really stand out.
However, I really just wanted to show you guys how the layouts worked and how you can use this page builder to build you web pages.
Overall Thoughts On Divi 2.0
After spending some time and digging into Divi, I certainly the possibilities of this theme.
When they say countless possibilities, they really mean it.
Now that I’ve spent the time and used the theme, and especially with this new update, I’m fairly certain that you can use this theme to recreate just about every other WordPress theme.
With that being said, the price of $69 (this is an annual fee) is an amazing deal considering you get all the other themes at Elegant Themes at that price.
As great of a theme that Divi is, the idea behind it really isn’t that new. However, the modules and layouts are rather extensive and do, in my personal opinion, put it above all the others I’ve tested and used in the past.
I really like the theme and flexibility of Divi, but it still came with a couple downsides worth mentioning.
The biggest issue that I think most people will run into is actually designing with the Divi page builder. It takes some time to really get an idea of how to use it.
And because you don’t get a visual feel from your edits until you Preview your page, there is going to be a lot of editing needed until you get your pages to where you’d like it to be.
There are so many options when it comes to Modules and Layouts, I felt it could be overwhelming to anyone trying to design from scratch. The layouts are nice to eliminate some of that, but even all the options within each of the 33 modules can be a bit much.
This isn’t bad as you can really do quite a lot without touching code to get a unique look, but with so many options, you are going to spend time testing your designs before you happy, and that was the most time consuming for me.
Though these really aren’t large downsides to the product, I still feel it was worth saying.
Hand coding all the edits that I would need to make something like I did above, would have taken much more time than I did by simply using the Divi page builder, but it still took time.
My suggestion when using Divi is to not design your site without a clear idea of exactly what you want it to look like.
Either use one of the layouts, or find another sites layout that you like, and work from there. If you’re design will need multiple pages designed and landing pages designed, plan for a few days of straight designing at the very least before you create a site your happy with.
Overall, it’s truly an amazing product. I won a Developer package from Elegant Themes in a recent giveaway and plan to use it on sites of my own in months to come.
Speaking of giveaways… WP Kube has patterned up with Elegant Themes to giveaway 3 developer memberships worth $267 to 3 luck readers.
Win 1 of 3 Developer Memberships to ElegantThemes!
You can enter using the widget below – winners will be drawn at random in 7 days time once the competition is over.
Update – The contest is Over.
Any thoughts on Divi that you feel is worth mentioning? Comment below!