Jun 26, 2020 | Divi Resources

Divi Content Toggle to display key information in compact manner

Having long pages with detailed information can delight Google bots, however, for users, it can be a bulky experience. They might find themselves overwhelmed or either confused when looking over pages overtaken by content. Then there comes the Divi Content Toggle module, to help you add extra but keeping user experience at its peak. It’s a part of Divi Plus plugin, that allows users to create complex web page elements easy.

Using the content toggle module, you’d be able to add multiple section either of text or saved layouts with a switch toggle. In this article, we’re going to explore its features and other options to create content toggles.

So, without any further due, let’s get started!

Content Toggle and its content settings

When you start creating content toggle on Divi website, the first thing you get with the module is the ability to add toggle switch and layouts. Here you can give your toggle individual title and select layouts. Currently, Divi Content Toggle module gives you option to add Text and Layouts as your content.

Divi Plus Content Toggle module with content settings

For text content, you can add whatever text you want to display in a compact manner. For layouts, you can add them from your library that you saved before. Using this, you’d be able to fit two different layouts in a single and engaging section. Like, pricing tables, product features comparison table, data analysis report and much more.

Content Toggle and its design settings

Once you have added your preferred content toggle layouts, you can further customize their appearance in the design tab.

Divi Plus Content Toggle module with design settings

The design tab of the content toggle module provides you with the intuitive options to make your Divi content toggle look more engaging and attractive. Under these styling options, you can customize each and every option of the content toggle and its layout.

Toggle Switch Styling

Using Toggle Switch Styling option, you can make changes in the alignment of toggle switch and title. It gives you the option to place your toggle switch at left, right, and center of the module.

Content toggle switch styling

In addition to the alignment, you can also change the color of switch and its background for both active and non-active states.

Toggle Title Text Setting

Just like any other text setting, Toggle Title text setting provides you with the option to change the appearance of the toggle title. Under this option, you can make changes in the level of the heading, color, font styles, add shadow and much more.

Content One Text Setting

If you have selected text layout for your content toggle then using this particular customization of the module, you can make changes in the appearance of text content. Likewise, toggle title text setting, this option, too, provides you with the all the necessary text customization options. Using these options, you can change font, their color, apply font style, and more.

Divi Content Toggle examples

The below are some of the content toggle examples created using the Divi Plus Content Toggle module.

Coffee Menu

Pastries Menu

Latte

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium

$4

Brownie Mocha

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium

$4

macchiato

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium

$4

Chocolate Cakes

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium

$4

Macarons

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium

$4

Cupcakes

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium

$4

Contruction Services

Painting Services

Construction & Repairs

Molestias excepturi sint

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Sint occaecati cupiditate

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Sed ut perspiciatis unde omnis

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

At vero eos et accusamus et

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

At vero eos et accusamus et

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

At vero eos et accusamus et iusto

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Sint occaecati cupiditate non

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Molestias excepturi sint

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Painting & Waterproofing

Molestias excepturi sint occae

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Sint occaecati cupiditate non

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Sed ut perspiciatis unde omnis

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

At vero eos et accusamus et

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

At vero eos et accusamus et iu

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

At vero eos et accusamus et

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Sint occaecati cupiditate non

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Molestias excepturi sint occa

More Info

Nulla quis lorem ut libero malesuada feugiat. Vivamus suscipit tortor eget felis porttitor volutpat. Cras ultricies ligula sed magna dictum porta. Donec sollicitudin molestie malesuada. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Proin eget tortor risus. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia

Cappadocia Tour Package

Europe Tour Package

Cappadocia Tour Package 8 Night / 7 Days
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Available Tickets: 79

Last Date: 15 DEC 2020

Europe Tour Package 30 Night / 29 Days
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Available Tickets: 56

Last Date: 25 Dec 2020

Summary

That’s our look at the features of Divi Content Toggle module and what it offers users to create engaging content in a compact manner. I must say it’s an interesting module, when you want to add several distinctive section of same type. Like pricing tables, text comparison, figures and other.

If you want to create content toggle in a much easier way, then this module can help you do that. Moreover, when you go for this module, you also get the other modules of the Divi Plus plugin. And that’s a huge saver!

Posted By:
Vishvendra
Vishvendra believes in the keep learning process and applying those learnings into work. Other than technical writing, he likes to write fiction, non-fiction, songs, and comic ideas. He loves what he writes and writes what he loves. Search his name with "Nathawat," and you'll easily find him over the internet.

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *

How to add Google reCAPTCHA in Contact Form 7 in easy steps

How to add Google reCAPTCHA in Contact Form 7 in easy steps

It’s a must that a contact form should have Google reCAPTCHA or any other security options enabled on it. Well, reCAPTCHA is most recommended. It protects your contact forms from getting filled out by bots or spams. And if you want to add reCAPTCHA on your contact...

Create Divi structured data pages easily for Google rich snippets

Create Divi structured data pages easily for Google rich snippets

Having Divi structured data markup pages can help you and your website in many ways. It not only features your web pages as Google rich snippets. But it brings a valuable amount of organic traffic. And it can be done for any website of any CMS, such as WordPress,...

Introducing high converting CTA buttons for Divi

Introducing high converting CTA buttons for Divi

Divi button module is one of those modules that gets in used most of the time by Divi designers every time they create a new website. Whether it's homepage or services page. Whether it's a contact page or even a read more button on the blog post. Button module is of...

Divi 4 header footer pack

Fill up your details to download the file

Please check your email for the download link.

One Plugin, Many Possibilities

You have Successfully Subscribed!