Swiper Slider

Swiper, as authors say is the most modern mobile touch slider, what makes it the best available slider for modern online stores. As statistics show it's used by almost 20,000 of users! It's lightweight slider, because it doesn't use any JavaScript libraries like jQuery. Swiper slider widget for GrandNode is the best possibility to increase the functionality of your store.

Global settings:
- showNavigation - decide if you want to show navigation arrows
- showPagination - decide if you want to show pagination dots
- paginationType - change the type of pagintation - "bullets", "fraction", "progressbar" or "custom"
- autoPlay - decide if you want to play slider automatically
- setMinHeight - set the minimum height of slider
- speed - specify the speed of slide change
- loop - decide if you want to enable continuous loop mode
- lazyLoading - decide if you want to lazy load images in slider
- preLoadImages - When enabled Swiper will force to load all images
- WidgetZone - select widget zone where Swiper should appear
- WidgetZoneOwn - select your own widget zone where Swiper should appear
- categoryWidgetZoneOwn - select your own widget zone on category pages where Swiper should appear
- manufacturerWidgetZoneOwn - select your own widget zone on manufacturer pages where Swiper should appear
- scrollbar - decide if you want to show scrollbar
- slidesPerView - choose the number of slides per view
- spaceBetween - specify the margin between slides

Slide configuration:

Each slide is divided into three parts - Header, Body, Footer. You can add different text or buttons to 

- Caption - Specify the position of sliders text. 
- Header - Enter the header text
- Body - Enter the body text
- Footer - Enter the footer text
- SlideOrder - Specify the slide order
- HeaderAnimation - Choose the header animation
- HeaderAnimationDelay - specify the delay in animation
- BodyAnimation - Choose the body animation
- BodyAnimationDelay - Specify the delay in animation
- FooterAnimation - Choose the footer animation
- FooterAnimationDelay - Specify the delay in animation
- Breakpoints - Create responsive sliders
- Visibility - Specify if slide should be published or not

Plugin supports multi store and multi language configuration, so it's perfect for each kind of online store also in multi tenant GrandNode stores.

How to use Breakpoints in Swiper Slider?

One of the most important features of Swiper slider is fact that it is fully responsive. You can use advanced setting - Breakpoints and configure it on your own.

To achieve that, go to Admin panel, Configuration, then Widgets section and click the Configuration button, Advance settings tab is your desired destination.

You can configure 5 breakpoints. Configure it according to below listed details:

- Extra small means width smaller or equal to 320px

- Small means width smaller or equal to 576px

- Medium means width smaller or equal to 768px

- Large means width smaller or equal to 992px

- Extra large means width smaller or equal to 1200px

- Default number of slides, configured on Options tab will be used in resolutions higher than 1200px.