AI Button Addon enables users to interact with the page through attractive buttons with which you can create triggering actions, navigate to specific sections, display menus, and enable/disable features. Buttons improve the user experience by making the add-on more intuitive and user-friendly.
Setting up Button and Styling it:
Step 1: Search and find the Button in the search box under the Elements Tab. Drag and drop the widget where you want it inside the Elementor section
Step 2: After you have finished with step 1, this is how the element will look.
How to Set Up Content and Styles for Button
Once you have dropped the element, then the Edit Button Box will appear with three sections, simply click on the ‘Content’ tab to configure the content.
- Type – By default, AI Addons offers a variety of Button options, select any of them based on your preference.
- Text – Enter the message that needs to appear inside the button.
- Link – Simply paste the URL link here to redirect the visitors to different pages. After that, select the gear icon located next to the input field. If you like, you can select the options to “Open In New Window” and “Add No Follow”
- Alignment – You can align the Button in left/right/center/justified
- Size – Sets the button size too small/medium/extra small/large/extra large.
- Icon – If you want, you can also add any icon to your button using Icon Library and adjust the ‘Icon Position’ and ‘Icon Spacing’ too.
- Button ID – Add your Custom ID
Set button styles from the ‘Button Styles’ option, which allows you to change typography and icon sizes, as well as adjust button alignment, width, and padding. Just play around with different Hover Animations effects for your button.
The background not only needs to be colored but AI Addons lets you keep the image as the background of the button. You can use Image from Media Library or just paste the URL
Take a look at our Live demo where you can explore various styles of buttons available in the AI Addon.Need any clarification.