Divi is now sporting a brand-new background options interface, where you can see at a glance what options you’ve set for your background colours, videos, images and gradients.

The interface has lots of new settings and these settings have been added to nearly all Modules.

New settings include background gradients plus size, position and blend mode features for background images.

In this post I’ll take a look at the new background options interface and point out some of the cool new settings and styles.

My Affiliate Links Disclosure

Hi everyone. Just to let you know that many of the links on this site are my affiliate links. What that means is that if you click one of them and buy something… I get a commission. It doesn’t cost you anything extra and I only recommend things that I’ve tried and tested, so please, please, please… use my links.

An overview of Divi’s New Background Options Interface and new features

The new Background Options interface make it much easier to manage your background settings, it provides additional options and it has been added to lots of Divi’s Modules.

This short video by Nick Roach of Elegant Themes, runs you through the new interface and points out a few of the new settings.


Just to refresh your memory, the main points to note are:

  • The Background Options Interface – takes all of Divi’s background settings and organizes them into a sleek new tabbed system.
  • More Options for more Modules – the new background options interface and all of its new options have been added to all Modules, which have background settings.
  • Gradient Backgrounds – a brand-new background style, Background Gradients, has been added to the background options interface.
  • New Background Image Controls – background images now have controls for: Size, Position and Repeat plus Image Blend Modes.

The new Divi Background Options Interface

 
new divi background options interface

Most Divi Elements (sections, rows, columns and modules) already have background options, but the new interface provides easier background management, improved options organization and more options for lots more Modules.

Easier Background Management

Divi’s background options were previously displayed in one long list under the Design tab.
The number of settings made it difficult to navigate, which in turn made it unclear what background styles you had enabled and the visual priority of those styles.

The new background options interface takes all of Divi’s background settings and organizes them into a sleek new tabbed system.

This new interface gives you a preview of each background style and makes it clear which styles you have enabled and how they interact with each other.

Improved Options Organization

The new interface organizes the options under four new tabs: Background Color, Background Image, Background Gradient and Background Video.

Under each tab you can enable the background style and configure relevant settings for that particular style.

This second layer of organization makes life much easier and saves you both time and effort when dealing with background settings.

More Options for lots more Modules

The new background options interface, and all of its new options, have been added to every Module that used to have background color, background image or background video options.

This makes the Divi Module set even more versatile and gives you lots of new ways that you can use background styles to get creative with your pages and posts.

The Background Options Interface – Divi’s background options have been expanded and re-organized into a sleek new tabbed interface that is super easy to use.
Elegant Themes

A new Divi background option – Gradient Backgrounds

 
divi's new gradient backgrounds

One of the background styles, which has been added to the new Interface is Background Gradients.

All you have to do to create beautiful gradient effects is: pick your colours, choose your gradient style, adjust its angle and you’re all done!

Note – you can create some pretty cool effects when you combine Gradient Backgrounds with Image Blend Modes, which I discuss later in this post.

Gradient Backgrounds – Creating gradients in Divi is easier than ever using the new background gradient options.
Elegant Themes

New Divi Background Image Controls

 
new divi background image controls

The new Background Options interface also provides you with a new set of image controls including: background size, position and repeat plus Image Blend Modes.

Background Size, Position and Repeat Style

Under the background image tab of the new interface are a new set of image options, which allow you to control the size, position and repeat style of your background images.

Background image Blend Modes

The new interface also supports CSS blend modes, which allows your background images to interact with the background colours and gradients behind them.

You can switch between different blend modes to control this interaction and create some truly stunning effects.

 
divi's new background image blend modes

New Background Image Controls – New background image options give you more control over the size, position and style of your background images.
Elegant Themes

Get creative with your pages and posts with Divi’s New Background Options Interface with fabulous new features

The new Background Options interface make it much easier to manage your background settings, it provides additional options and it has been added to lots of Divi’s Modules.

The additional options, Gradient Backgrounds and Image Blend Modes, give you two tools that you can use to add extra interest to your pages and posts and make them really stand out from the crowd.

Why not use Divi on your next project?

If you’d like to use Divi’s new Gradient Backgrounds and Image Blend Modes on your next project, then please feel free to use my Divi theme 10% discount link below.

401,632 Customers Are Already Building Amazing Websites With Divi. Join The Most Empowered WordPress Community On The Web
We offer a 30 Day Money Back Guarantee, so joining is Risk-Free!
Elegant Themes

Join Elegant Themes and download the Divi theme today.
Complete with a 10% discount!

Credits:
My thanks and gratitude to Elegant Themes for the graphics and video of the New Background Options Interface used in this post.
 

Pin It on Pinterest

Share This