This is a custom swiper and still under beta.

Follow the codepen example - https://codepen.io/Beligammans/pen/vYXWyVO?editors=1010

Requered

1. Use "custom-swiper-slide" class to enable the swiper
2. Add data attribute as "data-name" and use unique names for each sliders, when you use the more swiper sliden on one page.
3. Definde class name as "hide" and , use display none there.
4. The "option" dev must me place according to the custom layout.

optional

1. "data-slides-per-view" --- default value is 1 and you can change this as you wanted.
2. "data-slides-per-tablet" --- if you want to change the slide per view for the tablet(less 1120), you can use this.
3. "data-slides-per-tablet-portrait" --- if you want to change the slide per view for the tablet(less 1024), you can use this.
4. "data-slides-per-mobile" --- if you want to change the slide per view for the mobile(less 768), you can use this.
5. "data-slide-effect" --- if you want to change the animation, you can use this and the by default the slide option is "slide" (you can find the other animations from swiper official site)..
6. data-slide-autoplay" --- if you want to enable the auto play, you can use this and set the data value as "true"
   1. if you want the play pause button use the "toggle-play" class div inside the "option" dev.
7. "data-device" --- if you want to enable the swiper as device wise, you can use this and by default this is apply for the all resalutions.
   1. if want to enable enable swiper for less than 1121 responsive, use the value as "tablet,mobile"
   2. if want to enable enable swiper for less than 7687 responsive, use the value as "mobile"
8. "data-speed" --- you can use this attruibute to change the slideing speed.
9. "data-delay" --- you can use this attruibute to change the delay speed.
10. "data-parallax" --- if you want to enable the parallax, you can use this and set the data value as "true"
11. if you want to enable a separated play pause button click event, use the "separate-toggle" class on the "controller" dev tag.
12. "data-slides-per-group" you can change the group option and this is by default 1.
13. "data-loop-fill-group-with-blank" you can change the group type and by default this is false.
14. "data-stop-focus="true" you can stop the autoplay, when the keyboard navigation.