Want to add a dynamic image slider with text overlays and call-to-action buttons to your pages? The Slider widget in aThemes Addons lets you create fully customizable sliders with animations, autoplay, and responsive controls – right inside the Elementor editor.
In this guide, we’ll walk you through how to use the Slider widget in aThemes Addons.
Table of Contents
Before you get started, make sure you’ve installed and activated the aThemes Addons plugin on your WordPress site along with Elementor.
Activate the Widget
To use the Slider Widget, ensure that you have the aThemes Addons for Elementor plugin installed and activated. To activate this widget, navigate to the aThemes Addons dashboard within your WordPress admin area. Locate the Slider Widget and toggle the switch to activate it. Upon activation, the widget will be available for use in the Elementor editor.
Exploring Widget Options
The Slider Widget is packed with options that let you control every aspect of your sliders, from the content to the style, ensuring that the sliders fit your site’s design and your preferences perfectly.
Slides section
To add more slides to your slider, simply click on the “Add Item” button within the Slides section. You can also easily rearrange the order of your slides by dragging and dropping them into your preferred sequence. If you wish to remove a slide, hover over the slide’s settings and click the “X” button to delete it.
- Content Type: Choose the type of content each slide will display, with options for custom content or selecting from existing templates.
- Slide Heading & Description: For custom content, you can input a title and description directly into the widget settings.
- Button Text & URL: Customize the call-to-action button on each slide, including the button text and the URL it directs to.
- Background Image: Upload or select an image to serve as the background for each slide.
- Kenburns Effect: Activate the Kenburns effect for a dynamic zooming and panning animation on the slide backgrounds.
- Content Animation: Select from various animations for how your slide content enters the view.
Settings section
- Slide Effect: Choose from multiple animation effects, such as fade or slide, for transitioning between slides.
- Slider Height: Define the height of your slider, ensuring it fits perfectly within your site’s layout.
- Autoplay Speed: Set how long each slide remains visible before automatically transitioning to the next slide.
- Show Pagination/Navigation: Enable navigation arrows and pagination dots for easy slide navigation.
- Loop: Toggle looping to have the slider continuously cycle through your slides.
- Pause on Hover/Interaction: Specify whether the slider pauses when users hover over it or interact with the slides.
- Show thumbs: Activating this feature provides a visual preview and allows users to quickly navigate to their slide of interest by clicking on its corresponding thumbnail.
Styling Options
Under the Style tab, you will find numerous options for customizing the look and feel of your slider, including:
- Wrapper: Adjust the margin, border, and shadow around the slider for a perfect fit within your page.
- Slides: Control the padding and alignment of content within each slide for optimal layout.
- Text & Titles: Customize the font size, color, and style of your slide headings and descriptions to match your brand.
- Buttons: Style the action buttons on your slides, from color and typography to hover states and animations.
That’s it! You’ve successfully created a slider with images, text, and buttons using the aThemes Addons Slider widget.
Next, would you like to showcase customer feedback on your site? Check out our guide on Using the Testimonials Widget to learn more.
