Using slider with elementor

The Image gallery, Advanced image gallery, Post grid, Product grid and Relationship post widgets now integrate the new Slider layout mode.
It comes with a range of flexible and modular customization options relative to the component used.
You can freely resize images by controlling their height, width, and aspect ratio.
Automate scrolling and the number of items displayed as well as several animation options.

Accessibility for slider mode

Select slider mode

To enable Slider mode, open the ‘Layout’ section and select ‘Slider’ from the list.
The ‘Slider’ section appears in the list of sections.
Beyond after unfolding it you can apply the configuration you want.

Layout select slider entry

Configure the slider

Autoplay: items scroll automatically,
Autoplay speed: scroll speed,
Loop: the scroll resumes at the beginning or not. Enabled with Autoplay = ‘yes’,
Displayed images: Number of items displayed,
Direction: scroll direction (left or right)
Transition effect: four transitions (Default, Coverflow, Creative, Fade). ‘Creative and Fade’ transitions display only one item at a time. You can change the width of the slider,
Image ratio: five aspect ratios for images (Default, 4/3, 3/2, 16/9, 26/9),
Vertical position: position the image vertically according to the selected ratio.
Navigation: two arrows on either side of the slider to move items forward/backward,
Pagination: a series of bullets under the slider to illustrate the number of items and their movement,
Display scollbar: discreet scroll bar under the slider to illustrate the number of items and their movement.

Style controls and buttons

You can define the size, and the color of the navigation arrows as well as the size of the bullets, their colors and the color of the active bullet. The ‘Link and Lightbox buttons’ sections are only visible for the ‘Image gallery’ widget.
Slider style controls buttons

Final outcome

Post grid slider with the last ten posts.
Side-by-side layout with text on the left
Slider autoplay equal ‘yes’ + Transition effect equal ‘Fade’ + Display scrollbar equal ‘yes’.
The link is on the title and on the image.

Create advanced charts for Elementor

Use the EAC Chart widget in Elementor to create pie, bar, radar, and flow charts quickly. Display data visually to clarify insights, improve user engagement, and support content with attractive graphics. Configure datasets, styles, and responsive settings easily to match your site’s design and boost readability across devices.

How to use and display the ACF repeater field with Elementor

The ACF repeater is a widget that harnesses the power of an ACF repeater to display content in various formats and includes a FAQ section is a significant asset for any WordPress site. It not only enhances the user experience but also offers flexibility and customization that cater to the...

Using role manager module in Elementor

The Role Manager module in Elementor allows administrators to manage user permissions effectively on a WordPress site. By defining specific roles, it grants users access only to the features necessary for their contributions, enhancing security.

How to add a table of contents with elementor

The Table of Contents (TOC) component for Elementor allows you to automatically create your table of contents with ease and convenience for all types of publications. It gives your readers an overview of your content and links to click to navigate directly to that section.

Add and publish an image gallery with the free version of ACF

This feature adds a new custom 'Image Gallery' field with the free ACF plugin that you can use in your publications. You can publish the gallery directly in Gutenberg with a shortcode or use Elementor with the 'Advanced image gallery' widget.

Add a Countdown timer with Elementor

The Countdown widget is an effective tool for launching a product, important date or event, with multiple setting options and seamless integration with Elementor

Create a perfect post grid with Elementor

The Post Grid component is ideal if you want to share your posts in different display formats (Grid, Masonry and Slider), filter posts, select content for display and cover a wide range of use cases.

Improve page loading speed

EAC in conjunction with WordPress and Elementor uses a series of techniques to increase page load speed, make your site more accessible and improve site performance

Create advanced image gallery using Elementor

The advanced image gallery widget for Elementor lets you build a responsive gallery with different layouts, zoom with a Fancybox, apply a ratio to images and many other customization options.

How to set display conditions with elementor

Display conditions is a new feature that allows you to hide elements such as sections, containers and widgets according to easily defined rules. Display conditions can be single or multiple, and you can add information in place of the element stipulating why the content is not visible.

Make your site more accessible

From version 2.1.3 EAC implements accessibility improvements including keyboard navigation, ARIA tags and improved semantics with 'role' attributes. The changes applied to future versions will tend towards conformity and respect for the rules laid down by the WCAG standard.

How to add widgets with header footer builder

Header and footer builder for Elementor comes with the necessary widgets to create custom headers and footers for every post type on your site

How to create custom header and footer with elementor

Header Footer for Elementor is a new feature that allows you to create your own templates and display them in all or part of your site. This feature comes with the necessary widgets to build your templates without other plugins.

Add multiple background images with Elementor

Multiple background images is a new component that allows you to display multiple images in one element, position them finely and apply filters for attractive rendering

WooCommerce Product Grid for Elementor

The WC Product Grid for Elementor will allow you to create a perfect grid of products that you want to sell or present as a catalog

Dynamic WooCommerce Tags for Elementor

EAC implements dynamic tags for WooCommerce products that will allow you to maintain consistent data across your business.

Create amazing image gallery using elementor

Image Gallery for Elementor is a component that allows you to present your images in an attractive way with different display modes and a range of flexible customization options

Using slider with elementor

This component adds a new display mode to the 'Image gallery', 'Post grid' and 'Relationship post in a grid' widgets without recreate the existing one

How to create animation effects in elementor

Animation Effects for Elementor free Version is a new feature that extends the current motion effects, adds new animations and settings

How to customize wordpress navigation menu

Customize Navigation Menu is a new feature that allows you to add a badge, icon or image to each of your menu items from a simplified interface

Add Lottie animation in Elementor

Lottie Animation for the free version of Elementor is a new widget that allows you to enhance the user interface and will enhance the visual experience of your visitors

How to add RSS feed reader with Elementor

The free version of RSS Feeds Reader for Elementor is a new component that will allow you to aggregate news feeds from different sources and share them with your site visitors.

Add a News Ticker reader in Elementor

News Ticker for Elementor free version is a new widget which will allow you to display your favorite news feeds continuously on single line across the screen

How to create a team members page with Elementor

Team members for the free version of Elementor is a new component that lets you showcase your staff on your site with their photo, position, bio, and social profiles

How to add an author info box with Elementor

Author Info box for the free version of Elementor is a section where you can display information about the post’s author, show their bio, social profiles, and more

Add a PDF viewer to Elementor

PDF viewer for the free version of Elementor is a new component that will allow you to integrate one or more PDF files from the media library or from a remote site by applying rendering options to facilitate the appropriation of these documents

How to add OpenStreetMap to elementor

OpenStreetMap for the free version of Elementor is a new component which will allow you to integrate maps and position points of interest to make your site more attractive

How to integrate the new breakpoints with Elementor

The new custom breakpoints from Elementor will help you to create a responsive website perfectly fit to any device and make it much easier to adapt your design. This article is more developer oriented. It provides some pieces of code to successfully migrate to this new feature.

Create Image Hotspots with Elementor

Image hotspots for the free version of Elementor is very useful for creating an image with interactive hotspots that will allow you to display points of interest and detailed information about your vacation, business or other things

Create Off-canvas with Elementor

Off-canvas for Elementor is a new widget that allows you to create an impressive sidebar, attractive flyout menus and content panels

Add a link to an element using Elementor

Add a column / section / container link for Elementor is a new feature that allows to create a clickable element to open a new page

Use sticky scrolling effect with Elementor

Sticky scroll effect for Elementor free version is a new feature that allows you to create sticky effect on widget, column or top / inside section

Add Options Page for the free version of ACF

Options page for the free version of ACF is a new feature which will allow you to use the ACF fields with dynamic tags and standard ACF functions

How to display ACF Relationship posts in a grid

The ACF relationship post grid for Elementor is a new component that helps you to create and display the relationship field like any other posts in a post grid.

Add Website Thumbnail like a screenshot

Website Thumbnails for Elementor free version allow you to very easily present and link a remote or local website page like a screenshot

Dynamic ACF tags for Elementor

Learn how you can structure your posts with Advanced Custom Fields and reuse their content with the Dynamic Tags for the free version of Elementor

Help center

You will find in this page a set of documents which will guide and help you to access and build a dynamic site based on the most recent technologies

How do i make a html sitemap with elementor

HTML Sitemap guides your website visitors to where they want to go. It’s where they turn if they haven’t found what they are looking from those dropdown menus

Add your custom attributes with Elementor

Custom attributes for Elementor is a new feature that allows you to add attributes for the HTML container of your choice

Elementor Dynamic Social Medias

Display dynamiquely social icons on a blog post, with author’s or user’s social media links

Elementor Image Set Default Values

Set in Elementor the default values ​​for different image controls with properties like 'fields_options' and 'allowed_dimensions'

Elementor Control Conditions

Define the simple and advanced visibility conditions (Show / Hide) of a Control Elementor.

Add External Image For Elementor

Add your external image with the Elementor widget Image and conserve all the properties and options that the widget provides. Useful to display images from a CDN

How to integrate a modal box with elementor

This document will teach you how you can build a modal box and display different content in it with Elementor Modal Box Component without any code.

Display Elementor Template Anywhere Using Shortcode

How you can get a Elementor template shortcode and add the content anywhere in a post, page or sidebar.

Elementor Dynamic Template

Add and synchronize your content with Elementor templates anywhere in a post, page or sidebar.

Add External Image With Elementor Using Shortcode

Add your dynamic external image url with a shortcode. Very useful to display your images from a CDN.

Add your custom CSS with Elementor

Add your custom css to target and structure a widget, container, section, the whole page or global to the site with the free version of Elementor

Elementor Dynamic Tags

Implement the Dynamic Tags and Dynamic ACF tags for the free version of Elementor. It gives you opportunity to make your site dynamic and more efficient without having to look for Posts IDs or other values ​​internal to WordPress
Exit grid

Leave a Comment