Divi Essential is a plugin that adds over 60 new modules to the Divi Builder, expanding the possibilities for the designs you can build. With this plugin, you can add advanced tabs, content toggles, dynamic sliders, unique image and content modules, team sections, social modules, and much more. Each module comes with powerful functionality and extensive design options that make designing complex layouts a breeze.
Divi Essential also comes with access to 600+ premade section layouts that utilize the modules, 30 starter layouts, and 6 full templates with multiple pages. These layouts can all be downloaded from the Divi Essential website and can help you speed up the design process. In this post, we’ll take a closer look at Divi Essential to help you decide if it’s the right product for you.
Let’s get started!
Installing Divi Essential
Divi Essential comes as a .ZIP plugin file. To install the plugin, open the plugin page in your WordPress dashboard and click Add New. Click Choose File and select the plugin file from your computer, then click Install Now.
Once the plugin is installed, activate the plugin.
Divi Essential adds 65 new modules to the Divi Builder. You can access the added modules by clicking the Divi Essential module button in the Insert Module menu, or by searching “nextâ€, which will bring up all of the Divi Essential modules.
Divi Essential Modules
The 60+ new modules add lots of functionality to the Divi Builder. Each of the modules comes with content, design, and advanced options to fully customize the look and function. Let’s take a closer look at some of these modules using the premade layouts from Divi Essential.
Creative Modules
There are 10 different creative modules you can add to your page. Each module adds some unique functionality or design to your layout. In addition to the modules I’ll highlight below, Divi Essential comes with modules to add a floating element, a unique divider, a promo box, a Lottie animation, and a step flow section to demonstrate a process.
Next Advanced Tab
The advanced tab module allows you to create horizontal and vertical tabbed content sections. You can set the title, subtitle, and icon/image for each tab. This example is advanced tab layout 1.
Within the body of each tab, you can select a Divi Library layout to display, or you can add content by editing the title, description, image/icon, and button.
The module comes with extensive design settings for the entire module as well as the individual tabs. You can customize every aspect of the design, select different hover effects for the elements, set active styles for the selected tab, and much more.
Next Business Hour
This module makes it easy to display your business hours on your website. The example pictured is design layout 2. You can add each day of the week as an item within the module. Each item can be customized on its own, or you can use the module design options to apply styling to each item.
Next Content Toggle
The content toggle module adds a toggle to your page which you can use to switch between content. In this example (layout 2), the toggle is used to switch between displaying details of a single or lifetime license.
You can choose to add a Divi Library item to the toggle section, or you can add your content within the module settings. You can customize the design of each section as well as the design for the toggle.
Next Image Hotspot
With this module, you can add hotspots to an image that reveals content on hover. You can add text and an image that will be revealed, and you can customize each element with design options. The hotspot icon and color can be easily changed, and the hotspot position can be set by changing the horizontal and vertical positions in the design settings. The example below is layout 1.
Next Timeline
The timeline module can be used to visually represent events, the history of an organization, processes, and much more. Within the timeline module you can add individual timeline elements, which comprise each timeline section. You can add text, an image, a button, and an icon to each timeline element. Each element can be customized in the design tab, allowing you to create unique timeline designs. Pictured below is timeline layout 11.
Slider Modules
There are six different slider modules you can add to your site with Divi Essential. You can add a logo carousel, an image and text carousel, a 3D cube slider, a gallery slider, a testimonial carousel, and a post carousel. Let’s take a closer look at a couple of the slider modules.
3D Cube Slider
The 3D cube slider module adds a slider that flips with a 3d cube effect. You can customize each slide with an image, text, and background. Within the slider settings you can change the autoplay, navigation, and effect settings, as well as any of the design options. The example pictured is layout 4.
Next Divi Carousel
This is carousel layout 17. There are four layouts you can select: image, text, text inside image, or text below image. This allows for many versatile layouts.
You have full control over the layout and design of each carousel item as well as the carousel module itself. You can change the carousel autoplay settings, change the navigation settings, modify the effect, add a lightbox function, and more.
Image Modules
With 12 different image modules, Divi Essential gives you many ways to creatively display images on your website. You can add an image magnifier, a masonry layout, modules that add different loading and hover effects to the images, an image hover box, a before and after slider, and more. Let’s take a look at a couple of the image modules.
Next Before After
The Before and After module allows you to display a before and after photo that is revealed with a slider that you can drag. This layout is before after layout 4.
You can set the before and after images, modify the labels, change the slider direction and function, and customize the design.
Next Circular Image Hover
With the circular image hover module you can create a circular image that reveals content with a hover effect.
There are 19 different hover effects and 4 different hover directions you can choose from, giving you lots of flexibility in the design.
Next Image Accordion
The image accordion module adds an interactive image accordion to your design. When you hover over one of the images in the accordion, it will expand and reveal content. You can choose to add an icon, title, description, and button to each image. In this example, the third image is set to open when the page loads. If you hover on another image, it expands and stays expanded.
You can set the accordion to move on hover or on click, and you can set it to open vertically or horizontally.
Content Modules
There are 19 modules in the content category. All of these can be used to dynamically display your content and create captivating layouts. You can add boxes and blurbs, modules with different text effects, buttons, blog post sliders, and more. Let’s take a look at some of the modules.
Next 3D Flip Box
The 3D Flip Box module allows you to have a dynamic box that flips with a 3D effect on hover. You can have a different design on the back side of the box. This example is layout 7.
In the module settings, you can customize the elements that are on the front and back. You can add an icon, an image, heading text, body text, and buttons. In the design tab, you can customize the look of every element.
Next Blurb
The blurb module is very versatile and offers many content and design options you can use to create unique layouts. The example blurb used here is layout 11. It features a tilt effect on hover that moves with your mouse.
In the module settings you can enable a pre-heading, set the heading text and heading tag, enable a post-heading text, add a description, add an image and icon, and add a button. You can add an image mask, unique hover effects to the blurb or buttons, and so much more with the extensive design options available.
Next Button
The button module includes many options to add engaging effects to your button. You can add background transitions, hover effects, icon hover effects, stroke effects, 2d effects, set a background image, add a background gif, and more. In this example, I am using a collection of buttons with 2d effects. You can see how the Grow Rotate button has increased in size and rotated slightly on hover.
Next Text Animation
With the text animation module, you can add all kinds of animation effects to your text. This is example layout 10, and it features a typing effect. You can set the before and after text, add the text that gets animated, and select the animation effect. The text styling can be further customized in the design tab.
Next Text Color Motion
The text color motion module allows you to animate the text color. This example is layout 9.
You can select from several different animation styles and select four different text colors that create an eye-catching gradient effect.
Team Modules
There are 5 different team modules that come with Divi Essential, allowing you to show off your team members with unique sections and effects.
Next Team Overlay Card
With the team overlay card module, you can show off your team members with an overlay that appears on hover and reveals additional content, such as a description or social media icons. The example shown is layout 1, which features a curved border that adds a unique touch.
Next Team Social Reveal
With this module, social media icons are revealed beneath the team member description section on hover. This example is layout 1.
Social Modules
Divi Essential adds ways to connect social media to your website. For Facebook, you can add the following modules: share, like, embedded video, comment, embedded comment, embedded post, and embedded page. For Twitter, you can add a timeline, tweet, Twitter button, or follow button.
Next FB Comment
Here is the Facebook Comment module. You can use this module to allow users to comment on your site content with their Facebook account. The design can be customized with options in the design tab.
Next Twitter Timeline
This module allows you to add a Twitter timeline to your page. All you need to set is the Twitter account username, and the timeline will appear. You can customize the timeline with the design settings.
Review Modules
There are three review modules you can use to display customer reviews and testimonials on your website.
Next Divi Review
The review module allows you to add customer reviews to your page. You can add a name, position, and description, and you can set the star review for each module. This is layout example 1.
Next Testimonial Slider
With this module, you can add a slider to show off your customer testimonials and reviews. This is layout 11. Each testimonial slide is added as an item to the module, meaning you can customize the design of each slide individually and you can customize the slide design as a whole. You can add a rating, text, and image to each slide. In the slider settings, you can choose to have the slider auto-play, adjust the slider transition settings, and change the navigation settings. The options in the design tab allow you to customize the look of the slider to your liking.
Divi Essential Starter Layouts
In addition to the modules and the module layouts we explored above, Divi Essential also comes with 30 starter one-page layouts that you can use. Let’s take a closer look at one.
Tour Layout
This is the tour layout. The design is full of animations and interactive elements. The heading uses the multi-heading module and comes in with a reveal effect. Below is a logo carousel, three blurbs, and a carousel displaying destinations. Next is a section with a floating image and some content and number counters on the right. The map section utilizes the hotspot module to pinpoint destinations and reveal information on hover. Finally, there is a testimonial slider, a newsletter sign-up, and a footer.
Divi Essential Prebuilt Websites
Divi Essential also comes with access to 6 full website templates that include multiple pages.
Gardener Template
Let’s take a look at the home page for the gardener template. In addition to this page, the template includes the following pages: about us, services, gallery, project, project details, and contact.
The page opens with a hero section with multiple headings, a large image, a floating element, buttons, and several background graphics. The next section features four blurb modules that highlight services. Following this is another section with some text and images that have a floating effect. The heading content has a reveal animation. The services section below also utilizes the Divi Essential blurb modules and is followed by a floating element with a rotating animation and an image accordion that expands and reveals content on hover.
Next is another section that has blurb modules, followed by a section with a fullwidth background image and a floating graphic. There is a pricing table section below this,
Continuing with the home page, there is a logo slider and a before/after slider, followed by a testimonial slider. Finally, the page ends with a newsletter sign-up form.
Where to Purchase Divi Essential
Divi Essential is available in the Divi Marketplace. It costs $79 for unlimited website usage and 1 year of support and updates. The price also includes a 30-day money-back guarantee.
Final Thoughts
Divi Essential is packed with modules that add new features and dynamic layouts to your website. I was impressed with the customizability and the extensive options that come with each module. The demo layouts, the starter one-page layouts, and the prebuilt website templates that come with Divi Essential all seem to be high-quality designs that you can easily use and modify for your own design purposes. If you are looking for an all-in-one plugin that will expand the possibilities of what you can design with Divi, Divi Essential is a great option.
We would love to hear from you! Have you tried Divi Essential? Let us know what you think about it in the comments!
The post Divi Product Highlight: Divi Essential appeared first on Elegant Themes Blog.
