Hello fellow Bubblers!
Advanced Image Slider
We are glad to announce our small addition to the plugin collection:
With it you can enhance your web or mobile app by adding a beautiful slider with text and URLs.
Advanced Image Slider is a multioptional plugin that lets you easily create powerful sliders with attractive transition effects and customize each separate element to your liking.
Simple Captions with Url’s.
Add text or links to your slides with minimal effort
Use thumbnails for slider pagination, instead of bullets.
Turn your slider into a carousel, showing multiple slides at once.
Lazy Loading for extremely fast page loading times.
Images loads only when they are viewed
Fully Responsive & ready for all devices.
The slider will look great on every device including desktops, notebooks, tablets, and smartphones.
Many Dot and Arrow Styles.
Choose between different slide navigation dot and arrow styles.
Add the plugin to your app, set the image gallery and configure the properties as you see fit. Hints are included
If you have questions, reach out to us at email@example.com
We appreciate your reviews and suggestions.
Jay | Mindforapps
Hi Jay, thank you for putting this plugin together. Can you confirm if a vertical carousel can be created with this plugin? I see there is an option to make it horizontal. I can’t determine if it can function vertically as well.
I’ll try to answer.
Yes it is possible. Please see the last (bottommost) example on this test demo page:
There you can “open in the editor”.
Pay attention to the settings in these screenshots:
For a more correct display, install:
Slide Width = element width (W)
And ‘Make this element fixed-width’ = true
Thank you for your response. I’ve tried your recommendation and there appears to be an issue when checking “Make this element fixed-width.” Otherwise, this is working perfectly. Could you look into why it’s doing that?
Could I also make a request to have an arrow orientation option? Currently, there is only an option to scroll with the vertical arrows.
The arrows now only have a horizontal orientation. And, unfortunately, there are no plans to change anything in the behavior of the arrows. You can use swipe or auto play, for example.
Since the creation of the “ADVANCED IMAGE SLIDER” plugin, we have repeatedly supplemented and improved the plugin. But much of this is not displayed on the forum.
Here are some of the changes and additions:
Auto-update - Improved the auto-update feature. If any changes occur in the database connected to the slider (slides are added, removed or changed), then these changes are automatically reflected in the slider without first reloading the slider.
Improved imgix section - slider dimensions are taken into account.
slide_is_changed - fired when the slide changes
slide_position - shows the position of the current slide
link_img_position - shows the position of the clicked slide
Added the ability to move thumbnails below the container.
Added underline to the active thumbnail. And the choice to dim or not activate thumbnails.
Added the ability to change the distance of the underline from the thumbnail.
Added marker section (+img_marker) - setting/removing a marker on a slide with a mouse click. The state of the markers are read from and written to the database.
Added another text field. You can now display three independent texts on your slides.
Added the ability to use Google fonts as custom fonts.
Added the ability to overlay an arbitrary color layer on slides.
And many other minor improvements and fixes.
We have created an additional demo page showing some of these features. You can go to the editor and see how it’s all implemented.
advanced slider additional demo:
Good luck to all!
Great job regarding your plugin! I have a couple of questions regarding the “Image gallery” used as data:
- Is there a way to use image URLs hosted on Bubble, instead of using image variables, as data list?
- How could you had an ALT tag for each image for SEO purpose?
- Is it plan to support video in the slideshow? If yes, would it be possible to use video URLs hosted on Bubble or on Youtube instead of using video variables?
The idea of using URL instead of image/video variables is to have a unique list of media to use. Moreover my media are used in several part of my website and having to upload the same media several times is not very efficient.
Plugin update version 2.18.2
play - enable auto slide playback
pause - stop auto playback
next - move to the next slide
prev - go to the previous slide
set Autoplay - (change auto play mode)
Through the workflow, you launch these actions.
Also, a function has been added that monitors whether the slider is in the screen visibility area.
Now when an element appears on the screen when scrolling or vice versa goes beyond it, the “visibility_changed” trigger will fire
And if the plugin is in the viewport, then the value of the parameter “iv_viewport” = true
if the plugin is outside the viewport then the value of the parameter “iv_viewport” = false
And then you can run the actions you need, including
play, pause, next, prev, set Autoplay
For example play/pause autoplay when entering/leaving the viewport.
A small demo on our additional demo page:
could this plugin be used to allow users to swipe through images in a gallery on mobile? I want to improve the mobile experience of this app https://minnnis.com/
Worryingly, when I looked at your demo page on my desktop it loaded fine, but when I tried to check it on my Pixel 7 phone with Chrome, the page just locked at the top and I could not scroll down.
We tested the plugin on mobile devices. It also works on Android and iOS devices. Perhaps this is some kind of conflict with the Google Pixel 7, but this is also very strange because there is a standard Aidroid. This should not depend on the phone model in any way. Maybe it was some kind of temporary glitch. It is very difficult to say what is the reason for freezing on your phone.
Can I do an image slider extremely similar to amazon for desktops & mobile?
Each user has their own wishes and requirements for the plugin functions.
I think that in order for you to be able to decide whether this or that plugin is suitable for your purposes, you should try the plugin yourself on a live example.
We have a test application with the “Advanced Image Slider” plugin enabled. I invite you to try our plugin yourself in this test application.
I sent you a link to the editor of the test application and a small instruction in private messages.
I am sure that for you it will be the best option to decide whether the plugin is suitable for your purposes or not.
By the way, we have another plugin for the slider “Advanced Slider from RepeatingGroup” with the help of which you can also implement your task.
plugin page: Advanced Slider from RepeatingGroup Plugin | Bubble
Test the plugin “Advanced Slider from RepeatingGroup”
For it, I also created a test application and sent you a link to it in private messages.
Hello @MindForApps ,
Thanks for the plugin, it works great.
I wanted to know if you have any updates on the “alt” text of the images for the SEO ?
I’m sorry for the delay.
Added Alt Attribute.
“ALT” text is added as a list just like “Title Text”, “Description Text” and “Description_2 Text”
Please note that when adding an alt Attribute list, the “join with ##” construct is used.
New version v3.0.0 has just been published.
The new version will stop supporting the old engine and will only support the new responsive engine.
You can check out the demo page for this version.
Here is the editor for this version of the plugin:
The main difference between version 3 and the previous ones (1 and 2) is that the plugin only works in the new responsive engine. You will also need to set the required ratio (aspect ratio) for the slider container manually. This way the slider will always follow these proportions. When changing the width, the height will change proportionally.
You also have full control over the width and height of the slider in the layout tab.