Introducing Options Organization & Options Search

Improved Options Organization

Every Divi Builder option has been re-organized and similar options have been grouped together into easily-browsable categories.

Today we are releasing what has to be my favorite new Divi feature of the year. It’s my favorite new feature because I know what a huge impact it’s going to have on your productivity, and I love releasing updates that improve efficiency and make Divi and easier and more enjoyable tool to use.

Divi has had a long journey and with each evolution the builder has become more robust and rich with features. Every time we added new module option, however, the options tabs became just a bit more cluttered. For those just starting out with Divi, finding a desired module setting could take some time. It was often unclear if the setting existed, and if it did, under which tab the option could be found. Within each tab, the long list of unorganized options were difficult to sift through.

We have tackled this problem from several different angles. First of all, every Divi option has been grouped into categories. Like-options have been combined into sub-groups within each of the three Divi options tabs. The three Divi options tabs have been re-named to allow for a clearer distinction between each tab, and all modules option groups have been moved around accordingly. These option groups have been organized with an understandable hierarchy, as have the options within each group. Finally, we have made the options searchable (and it’s really cool)!

Introducing Option Groups

All module options have been grouped together into sections within each Divi settings tab. When browsing a list of options, finding your desired setting is so much easier. Every module has similar groups, which means when you open up a new module for the first time, it’s pretty clear where to find what you are looking for.

These groups are especially useful for the Visual Builder where we have turned option groups into toggles. This consolidates space and allows you to use a small settings modal that does not obstruct your view of the page. You no longer need to scroll through long lists of options because all option groups are visible even when your settings modal has been reduced to a very small size. Just navigate to you desired tab, open up your desired options group and start editing!

Better Option Organization

Not only have we grouped options together, we have also re-organized them. When you open up a settings tab, the groups of options you see are ordered in a way that makes sense (crazy, right?). Groups of text options follow each other in the list and adhere to a basic sense of hierarchy. When you open up a group of settings, the list of options have also been re-ordered. Settings that are often used together will show up next to each other in the list. It’s a simple change, but it makes a huge difference.

The New Options Tabs

We have re-named the three basic Divi settings tabs and all options have been moved around accordingly. In the past, all Divi module settings modals had three basic tabs: Basic, Advanced Design and Custom CSS. These option tabs were born from Divi’s natural progression over the years. The distinction between “General” settings and “Advanced Design” settings, however, became arbitrary as time progressed. The distinction was based more off of Divi’s history than it was off any objective difference between the settings in each tab. For new users, it really didn’t make as much sense as it should have.

Today we are introducing three new tabs: Content, Design and Advanced. Within the content tab, you will find all of your text, image, video and module elements (such as: Header Text, Content Text, Slider Image, Blurb Icon, etc). Within the Design tab, you will find all of your design settings (colors, fonts, sizing, and spacing). In the Advanced tab, you will find options that will be useful for advanced users with web design experience (such as Custom CSS, CSS Classes and HTML Attributes).

The idea is simple. When you open up a tab of settings and locate a settings group, it should be clear what you are going to find inside that group before you open it. Not only does it make browsing Divi’s current settings easier, it also means that we can continue to add lots of new module options without cluttering the interface. And guess what? We have a lot of new module options on the way!

Search Options And
Get Instant Results

All module options are now searchable in the Visual Builder. If you know what option you are looking for, just open up the settings modal and start typing! Divi will find the setting for you.

In the Visual Builder, all Divi module options are now searchable. When you search through options, the results appear instantly! This is such an amazing feature that once you start using it, you will find it hard to believe how you ever lived without it. I can’t stress enough how much this will help boost productivity once you get used to using it.

Once you search for an option, Divi display a list of relevant settings and you can modify your option right from the list of search results. If you know what you want to change, just typing in a few letters will bring you to your desired option even faster than clicking through the newly-organized settings tabs.

The New Selective Sync
System For Global Modules

The new and improved Selective Sync system for Global Modules allows you to sync and un-sync individual settings.

Selective Sync is one of Divi’s hidden gems. It allows you to create global modules that you can place on multiple pages on your site while only syncing certain module settings to each page. For example, you could create a global Fullwidth Header module that you place on every single page on your site. Through Selective Sync, you can mirror the design settings across every page while at the same time keeping the module’s content elements un-synced (such as the Header text). This allows you to have unique content on every page, but keep all of the module’s design elements synced up. When you make a design change to the global module, that change is reflected on every page while your Header text stays unique!

In the past, Divi let you selectively-sync any of the three settings tabs (General, Design and CSS) at once. This was great, however, it did not give you full control.

Selective Sync For All Options

Today we are introducing a brand new Selective Sync system that allows you to sync and un-sync individual settings for every global module you create. This is now a standard feature of all global modules, which means the old selective sync options have been retired. You can now selectively sync any combination of settings, which makes Divi global modules incredibly powerful!