How to Use Toggle Widget

how_to_use_toggle_widget

How to Use Toggle Widget

It is Toggle that is collapsable and it allows one to go one state to another with click event. In this documentation below, I’ll show you how to use our Toggle Widget to create a collapsable event.

To Insert Widget

Inserting widget, it is just a matter of drag and dropping. As you see in the screenshot above.

Content Tab

Using the content tab, you’ll be able to make a layout of a particular part (option be added) of a website. And in this regard, some handy sections in the tab will assist you a lot.

Toggle

This section holds all the settings of Toggle. Here, you’ll be able to set Toggle title, type, and source(Custom, Elementor and AE Template). One more thing for Toggle icon (for showing or not).

Go the Content tab > Toggle.

Note: Apart from the custom source, if you want toggle to show data from Elementor/ AE Template, you have to create a template first like the Nested tab in tabs.

On the contrary, if interested in custom, you can stay. As the photo below demonstrates.

Additional

From this section, you can select Toggle icon and set the alignment of the icon.

Simply, go to the Content tab > Additional.


Style Tab

It is time to work with Style Tab. The tab will confidently have you style the web content (text, image, video, etc.) of the page you want to design. 

Styling with the Style tab in Elementor will always give you a fantastic experience.

Let’s have a look.

Title

In this section, there are two modes(Normal and Active). The both modes will allow you to style the Title.

The normal mode will let you set text color, box-shadow, padding, typography, shadow color, and shadow height to the Title.

Go to the Title > Normal.

In contrast, Active mode only allows text color.

Go to the Title > Active.

Content

Here this section will allow you to set the alignment, text color, and typography of the content.

Simply, go to > the Style tab > Content.

Icon

Here, regarding the Normal mode, you may add color and spacing to the icon. But, in the Active mode, you can add color only.

Just go to the Style tab > Icon (Normal and Active).

Video Assist

Finally, it seems you’ve noticed how painless it is to use our Toggle Widget by Element Pack and found this documentation easy and useful. Watch Video Assist and to get more ideas about the usage of this widget, take a tour to the demo page.


About Selim Rana

Selim Rana is the Founder of BdThemes - the company behind Element Pack Pro! He is a Software Engineer passionate about WordPress and Elementor.


A first-ever all-in-one web solution with essential widget, extensions, and features for Elementor WordPress.

Your complete web development partner.

Contact

Copyright © 2022 BdThemes.
All Rights Reserved. Site built with Element Pack & Rooten Theme.

AUTUMN Sales up to 60% Discount on our products | Coupon: AUTUMN

Ready to buy Element Pack Pro?

Don’t miss 230+ essential Elementor widgets and 2000+ ready templates for professional web design.

Changed your Mind?

Please Suggest us how to improve

Up to 60% OFF

Purchase all our add-ons and make your website better than ever with our web designing products. Make your purchase with our limited-time AUTUMN offer in 60% off.