Overview of the Content Toggle module

This page shows you how to add the Content Toggle module to your page and explains every setting in its Content, Design and Advanced tabs, with screenshots. The Content Toggle module switches between two blocks of content with a toggle switch, for example monthly and yearly pricing. For more details, view the demo.

How to add the Content Toggle module to your page

1. Open your page in the Divi Visual Builder.
2. Click the gray (+) icon inside a row to add a new module.
3. Search for DP Content Toggle in the module search box.
4. Click the module to insert it. Its settings open on the right.

Content tab settings

The Content tab holds the module’s own settings, grouped in the toggles below. Link, Background and Element Label are the standard Divi options.

Content One

• Toggle Title: Input the text to be used for the toggle title of Content One.
• Content Type: Choose the Content One type.
• Content: Input the text to be used as content for Content One.

Content Two

• Toggle Title: Input the text to be used for the toggle title of Content Two.
• Content Type: Choose the Content Two type.
• Content: Input the text to be used as content for Content Two.

Design tab settings

The Design tab lets you style each part of the module:

• Toggle Switch Styling: styling options for the toggle switch styling.
• Toggle Title Text Setting: styling options for the toggle title text setting.
• Content One Text Setting: styling options for the content one text setting.
• Content Two Text Setting: styling options for the content two text setting.
• Sizing, Spacing, Border, Box Shadow, Filters, Transform, Animation: the standard Divi design options for the whole module.

Advanced tab settings

The Advanced tab has the standard Divi options: Attributes (add a CSS class or ID), CSS, HTML, Conditions, Interactions, Visibility, Transitions, Position and Scroll Effects.