Automatic Slideshow Based on Blueimp Gallery

Mercator · Sep 15th 2018

Good morning,

Time to share/give back to the community.

I have created a sideshow plugin for Pagekit, that takes all images in a directory, and produces previews of images contained. When you then click on one of the previews, a fully responsive slideshow will start. The plugin is a wrapper around the Blueimp library provided by Sebastian Tschann (https://github.com/blueimp/). If you want to see the plugin in action, please, see https://www.mercator.li/galleries/rail-days.

To use this plugin within Pagekit:

Unzip the enclosed file into the packages directory.
Create a directory called "Images" within Storage.
For each slideshow you want to produce, create a directory within Images, e.g., show1.
To include a preview of your images onto your page, simply use (mercator_big){"dir":"show1"} . The script will automatically produce a preview of the images.

When you click on one of the images, a fullscreen slideshow (fully responsive) will start.

Working some more on this (parts is already in the code), so feedback is welcome.

Happy weekend,

Mercator

Kuzmich · Sep 15th 2018

I have not tried to put to myself but I think it's a good plugin.

The widget can also be installed in any desired location on the site ?

Abdulhalim · Sep 15th 2018

Quote from Kuzmich

I have not tried to put to myself but I think it's a good plugin.

The widget can also be installed in any desired location on the site ?

I guess, You can use it every where you can use the editor.

Thank you Mercator

Kuzmich · Sep 15th 2018

Thank you ! Make this plugin fully working please that it is not stupid with constant updates.
It is a pity that there is no Russian localization of this plugin

Kuzmich · Sep 15th 2018

Ahhh, I understand how this slide show works.

To be honest it is not convenient that it completely closes the entire site.

Maybe it's better to remake a ready-made slideshow-widget to make it work well on all PageKit templates ?

Fosphatic Duke · Sep 15th 2018

Quote from Kuzmich

Ahhh, I understand how this slide show works.

To be honest it is not convenient that it completely closes the entire site.

Maybe it's better to remake a ready-made slideshow-widget to make it work well on all PageKit templates ?

This plugin is not a good one as I told you, Mercator has a simple one that seems to be awesome and should be available in the pagekit marketplace.

If you want an awesome slideshow with config from the backend then look into a blog entry from me:

https://www.suchan-webdesign.de/blog/post/slideshow

it's on German but you can translate it into Google in any language and the code part is anyway always in English ✌️

Kuzmich · Sep 15th 2018

And what if you download Widgetkit from Joomla and fully adapt it to PageKit ?

Fosphatic Duke · Sep 15th 2018

Quote from Kuzmich

And what if you download Widgetkit from Joomla and fully adapt it to PageKit ?

Well if you are an uber code writer and can translate joomla's code to vue for pagekit, then sure go for it

Mercator · Sep 15th 2018

Quote from Abdulhalim

I guess, You can use it every where you can use the editor.

Thank you Mercator

Yes, on any page!

Mercator · Sep 15th 2018

Quote from Fosphatic Duke

Mercator has a simple one that seems to be awesome and should be available in the pagekit marketplace.

Thanks you... Let's improve it further. There are some things I still want to do, like inline slideshows as opposed to fullscreen and delivering the pics at different sizes (at the moment, it is 2000px, which allows for full screen on a desktop but uses (too much) bandwidth in case of small screens).

Fosphatic Duke · Sep 16th 2018

Quote from Mercator

Thanks you... Let's improve it further. There are some things I still want to do, like inline slideshows as opposed to fullscreen and delivering the pics at different sizes (at the moment, it is 2000px, which allows for full screen on a desktop but uses (too much) bandwidth in case of small screens).

That's indeed too much for small devices is it possible to get the uikit own slideshow as the renderer?

Mercator · Sep 16th 2018

I th

Quote from Fosphatic Duke

That's indeed too much for small devices is it possible to get the uikit own slideshow as,

I think making the plugin work with any slideshow would be pretty straightforward. I am currently using blueimp as it was "the best" (for me) I could find at teatime. Looking at the UIKit, Lightbox, Slideshow and Solideste look a bit limited compared to Blueim but I would think it would not take to too long to re-reite the code to use one or more of these.

Fosphatic Duke · Sep 16th 2018

Quote from Kuzmich

And what if you download Widgetkit from Joomla and fully adapt it to PageKit ?

By the way the same things you can do with uikit in pagekit, the only difference is it is not click and go. But there is an extension available that can help a lot to not write the Syntax all the time.

https://pagekit.com/marketplace/package/norrnext/shortcodes

with shortcodes you can create small templates for any Widgetkit like extension from uikit and then you have only to write which items you want to have it like pictures for example and you good to go.

Mercator · Sep 16th 2018

Quote from Fosphatic Duke

That's indeed too much for small devices is it possible to get the uikit own slideshow as the renderer?

OK, I think I have a solution and only use UIKit

Mercator · Sep 16th 2018

OK, the basic stuff is working based on UIKit, see for yourself: https://www.mercator.li/galleries/rome

It looks nicely and is responsive. However, when I open it using an i-Device, such as an iPhone or iPad, the left/right arrows are not showing and swiping does not really work well (at least in Safari, Chrome works somehow). Am I the only one having this problem?

Fosphatic Duke · Sep 16th 2018

Quote from Mercator

OK, the basic stuff is working based on UIKit, see for yourself: https://www.mercator.li/galleries/rome

It looks nicely and is responsive. However, when I open it using an i-Device, such as an iPhone or iPad, the left/right arrows are not showing and swiping does not really work well (at least in Safari, Chrome works somehow). Am I the only one having this problem?

Awesome job!

Fosphatic Duke · Sep 17th 2018

Mercator one question lad do you made a repository for this plugin? Probably we can make a real package for pagekit out of it.

Mercator · Sep 17th 2018

We can make whatever... I am just not having the time at the moment to read through all the material on how to package for Pagekit. Let me do the functionality first and then we can do that.

Quote from Fosphatic Duke

Mercator one question lad do you made a repository for this plugin? Probably we can make a real package for pagekit out of it.

We can make whatever... I am just not having the time at the moment to read through all the material on how to package for Pagekit. Let me do the functionality first and then we can do that. This will be probably more than one extension anyway...

Fosphatic Duke · Sep 17th 2018

that's why I asked if you have a repo on github probably I can help a bit.

Kuzmich · Sep 17th 2018

Quote from Fosphatic Duke

By the way the same things you can do with uikit in pagekit, the only difference is it is not click and go. But there is an extension available that can help a lot to not write the Syntax all the time.

https://pagekit.com/marketplace/package/norrnext/shortcodes

with shortcodes you can create small templates for any Widgetkit like extension from uikit and then you have only to write which items you want to have it like pictures for example and you good to go.

And this is the right thing ! Thank you !

Automatic Slideshow Based on Blueimp Gallery

And what if you download Widgetkit from Joomla and fully adapt it to PageKit ?

And what if you download Widgetkit from Joomla and fully adapt it to PageKit ?

And what if you download Widgetkit from Joomla and fully adapt it to PageKit ?

Share

Tags