The FAQ tool can be useful to create an exclusive list of FAQ. This widget will make your website design rich and informative at the same time.
Video Instruction #
Using FAQ #
To use FAQ tools properly, follow these steps to ensure this tool is utilized to the fullest.
Step 1 #
From the menu bar on the left-hand side, select FAQ. Drag and drop the widget on the area you want it to be.
Step 2 #
From there you will have access to the following sections: Content, Style and Advanced.
Step 3 #
From the Content section, you can select the preset of the FAQ. There are four different presets to pick from. Apart from that, you can enable/disable icon and select the type of icon you want to display. You can upload icons as well. We recommend using the PNG version for quality design.
Step 4 #
From the Content option within the content section, you can edit the title, add description, enable and customize buttons
Step 5 #
From the Style section, you can customize the General, Title and Content section of the page.
General: In the General section, you can add space between the FAQ tabs and also add shadow to the tabs to make it distinct.
Title: In the Title section, you can customize topography of the title. Plus you can add icons, and determine the size the icons will have. In addition, you can use the title section to add background color, text color, border and more.
Content: In the Content section, you can customize the background, add padding, modify the margin, add box and border to design a creative FAQ.
You can also design and customize the description, button, margin and border to create an eye catchy FAQ tab.
Step 6: #
In the Advanced section of the widget, you will have the flexibility to add margin and padding to the widget. You can also modify the Z-index to customize the widget more.
You will also get the chance to edit and customize the following options:
- Motion Effects
- Custom CSS
Motion Effects #
From the Motion Effects option you can add different effects such as fading, zooming, bouncing, sliding, rotating, attention seeking motion, lightspeed and more effects to make your widget look different.
If you want to customize the background with specific color, gradient or images, you can do that from the advanced settings as well. You can pick background type, color, gradient, gradient type and more.
If you want to add any line, box, dots and other design variations as borders of the widget, you can do it from here. You can also customize the size and insert shadow effects if you want to.
This feature will allow you to fix the positioning of the widget. From the width section you can select if the position will be full width, inline or customized. And you can set the position as absolute or fixed as well from these settings.
You can check the responsive of the widget if you toggle through the available options. However the change of the widget will be only visible on the live page or preview, not in the Elementor.
With Attributes you can add custom HTML attributes to any elements. However, this feature is only available with the pro version of the Droit Elementor Addons.
Custom CSS #
Custom CSS lets you add CSS code to any widget, and see it render live right in the editor. However, this feature is only available with the pro version of the Droit Elementor Addons.