The Show/Hide Widgets addon is one of the interactive components in Vev. You can easily apply it to any element to make your pages more engaging for your viewers. It is also a very versatile tool; you can use it to create pop-ups, menus, and much more. You can find some examples of interesting ways you can use this addon below.
Adding a Show/Hide Widgets addon
To use this addon, select the element you want to apply it to and then add it on. To reach the addon menu, you can either access it by right-clicking and selecting Addons, or through the + icon in the top bar navigation, or by clicking on the Addons menu in the right-side panel of the design editor.
Select the element you want to attach the addon onto
In the Addon menu, search for and add the Show/Hide addon
The settings panel will automatically open so you can configure the addon, now you need to set your triggers to use this addon.
A flashlight icon will appear on the element in the layers panel; this indicates that the addon has been applied.
Pro Tip: Explore our Interactions feature for enhanced flexibility in showing and hiding elements! From clicks to scrolls and hovers, interactions may greatly improve the overall user experience and boost reader involvement. 🔥
Configuration options
Parameter | Description |
Show by default | Toggle on to show the applied element by default when the website loads, be sure to leave the visibility on in the layers panel. |
Triggers to set visible | Choose the trigger elements that will make the applied element visible when clicked (you must give these elements a unique name in the layers panel so they appear in the list) |
Triggers to set hidden | Choose the trigger elements that will hide the applied element when clicked (you must give these elements a unique name in the layers panel so they appear in the list) |
Enter Animation | Choose an entry animation for the applied element from a list of options to add some fluidity to the transition. |
LeaveAnimation | Choose an exit animation for the applied element from a list of options to add some fluidity to the transition. |
Sample Use Cases
Here are some examples of ways you can use the Show/Hide addon in your designs.
Pop-up
Switching Tabs
Menu
