Skip to main content

Composable Settings in Divi 5

Learn how to use Composable Settings in Divi 5 to enable any design option for any module sub-element.

Updated today

Composable Settings give you the ability to enable any of Divi's design options on any module sub-element. Instead of being limited to the default options that ship with each sub-element, you can toggle on additional settings like backgrounds, borders, transforms, sizing, animations, and more - without writing CSS.

Many Divi modules contain nested sub-elements. A Blurb module, for example, has an image, title text, and body text. Before Composable Settings, each sub-element only came with its own fixed set of design options. You could apply options like backgrounds and transforms to the module wrapper, but not to individual sub-elements inside it. Composable Settings removes that limitation entirely.

Where to Composable Settings

Divi 5 - Enable Composable Settings
  1. Open the Visual Builder

  2. Click on a module to open its settings.

  3. Navigate to the Design tab.

  4. Hover over any option group that represents a module sub-element (such as Title Text, Button, or Image).

  5. Click the Toggle Options icon to open all the avaiable option groups for that particular element's option.

How to Enable Additional Design Options

  1. Hover over a sub-element option group in the Design tab.

  2. Click the Toggle Options icon.

  3. A list of available design option groups appears. Enable the ones you need - such as Sizing, Border, Background, Transform, or Animation.

  4. The enabled options appear instantly as nested option groups within that sub-element.

  5. Configure the newly enabled options as you normally would.

That's it. You only see the options you've enabled, keeping the settings panel clean and uncluttered.

Use Composable Settings with Presets

Divi 5 - Using Composable settings in Presets

Composable Settings work with Presets. If you enable specific design option groups within a preset, those option groups automatically appear when editing any element that uses that preset.

To set default enabled options across your site:

  1. Open a module's settings and navigate to the Design tab.

  2. Click the Presets dropdown and select or create a preset.

  3. Inside the preset, hover over a sub-element option group and click Toggle Options.

  4. Enable the design option groups you want available by default.

  5. Save the preset.

Any module using that preset will now display those additional option groups automatically. This is especially useful for default presets - toggle on your most-used options once, and they appear everywhere that preset is applied.

Examples of What You Can Do

Here are a few possibilities Composable Settings open up:

  • Add Sizing options (width, height) to a button sub-element

  • Apply a Border to a title sub-element

  • Add an Animation to an image sub-element

  • Set a Background on a body text sub-element

  • Apply Transform effects to any sub-element independently

Frequently Asked Questions

Q: Do Composable Settings add CSS bloat to my site?

A: No. Only the options you enable and configure generate CSS output. Unused options produce nothing.

Q: Can I disable an option group after enabling it?

A: Yes. Click the Toggle Options icon again and turn off any option group you no longer need.

Q: Do Composable Settings work with all modules?

A: They work with any module that contains sub-elements with option groups in the Design tab.

Q: Is this feature available in Divi 4?

A: No. Composable Settings are exclusive to Divi 5.

Did this answer your question?