🚀[NEW PLUGIN] Advanced Slider from Repeating Group

Hello fellow Bubblers!
We have recently published a new plugin and would like to share this news with you:

Advanced Slider from Repeating Group is a plugin that turns a standard repeating group into an advanced slider or carousel.

Keeping the convenience and functionality of the repeating group, you get a highly customizable slider with a huge number of functions.

You are not tied to any particular design of the individual slides in the slider, but you can create your own slides with a repeating group of your choice.

Advanced Slider from Repeating Group - based on the “Swiper” library.
Swiper - is the slider with hardware accelerated transitions and amazing native behavior.

Features:

  • Mobile-friendly: It is intended to be used in mobile websites, mobile web apps, and mobile native/hybrid apps.
  • 1:1 Touch movement: By default, Plugin provides 1:1 touch movement interaction, but this ratio can be configured through Plugin settings
  • Rich API: Plugin comes with a very rich API. It allows creating your own pagination, navigation buttons and many more
  • Transition Effects: Fade, Flip, 3D Cube (with additional settings for each effect)
  • Full Navigation Control: Plugin comes with all required built-in navigation elements, such as Pagination, Navigation arrows and Scrollbar
  • Autoplay
  • Free Mode
  • Keyboard control
  • Mousewheel control
  • And many more features and settings.

Installation:

  1. Place a Repeating Group on the page. Connect Data and Set Up a Repeating Group
  2. For better control, wrap the repeating group in a group.
  3. Adjust the responsiveness of the repeating group.
  4. Give the repeating group an ID.

If sliding the slider will not load additional slides, then you may need to set “Show all elements at once” = “true”

  1. Install the plugin element (AdvancedRGSlider) on the page.
  2. Connect the AdvancedRGSlider the same way you connected the repeating group.
  3. Write in the “rg” field the identifier that you assigned to the Repeating group in step 4
  4. If necessary, make additional settings for AdvancedRGSlider.
    More information and detailed examples can be found on the demo page:
    https://plugin-preview-4.bubbleapps.io/version-test/advanced_rg_slider
    Go to editor. (OPEN EDITOR)

Demo:
For detailed connection and demo information, visit the plugin demo page at

There you can go to the editor (OPEN EDITOR).

Plugin page:

Need help adjusting your new application? Our Plugin and Template customers receive a 20% discount for all our Design and Development work.
Contact Jay at contact@mindforapps.com

Support
If you have questions, reach out to us at support@mindforapps.com

We appreciate your reviews and suggestions.

Cheers
Jay | Mindforapps

.

.
rgSlider-1-min

.

.
rgSlider-0-min

3 Likes

Plugin update version 1.0.1
Added “cardsEffect” plus other minor changes.

rgSlider-min

1 Like

Does your plugin allow for every API parameter of SwiperJS?

Hello!

At this stage, we use most of the most necessary parameters. Unfortunately, the design of the plugin and some features of the Repeating Group (the plugin is an add-on for RG ) technically do not allow adding some functions and effects. But upon request, we will try to add other features and options, if possible.

Working Perfectly on Microsoft Edge, but Not working as expected on Google Chrome

How the Slider looks like on Edge Browser:

How it is behaving on Google Chrome:
Fig 01:

Fig 02:

How Can I fix this? @MindForApps

Hello!

It is not always possible to understand what the problem is from the screenshots. Usually, in order to understand what the problem is, it is desirable to have a little more information: What is the structure of the page, how the plugin was connected, how the repeating group was hooked up and set up.

But in this case, most likely I know what could be the problem.
Now I have made changes to the plugin code and I think that everything should work properly now.

Update the plugin to version 1.0.3

Please let me know if this helped you.

Thank you.

Hi there,

Thanks for the quick response, Please check the below video that shows the whole setup of the RG and the Plugin setup, ths issue is still there even after I updated the Plugin’s version as advised.

I just set up our demo page just like in your video.
But I don’t see this problem. Chrome browser.

Here is a demo. You can go to the editor (OPEN EDITOR) and see my settings (although they are exactly the same as yours)

It also sometimes happens that Buuble cannot apply updates on the fly. And in this case, you need to remove the plugin and install it again.

Please give me the URL of your page so I can look at it and decide what else to do with it.

Thank you.

1 Like

Hi @MindForApps ,

It is working as expected on Google Chrome and on Edge “Today”.

So yesterday I did all you advised me to do and still, nothing happened, so I just switched off my PC, went to sleep, and today I gave it one last chance and it worked!

Thanks for the speedy response and for the amazing Plugin !

Oh, this is great news!
I think this is some kind of Bubble subtlety. Sometimes it happens that Bubble does not immediately accept plugin updates. And you need to either reinstall the plugin or log out (which you did by turning off the computer). Or maybe it was just some Bubble glitch.

But in any case, I’m glad that now everything works as you expected.

Thank you.

Good luck.

Updated plugin v1.0.5

Added loop mode. Updated swiper.js library version.

Image 19