Jump to content
pconkie

Super easy image carousel

Recommended Posts

I know there is a widget for that, but not as easy as this....

  • Fully responsive
  • upload images direct inside the widget
  • Re-order images with drag and drop
  • Preferences to control speed and transition
  • Experimental option to force the carousel to ignore the theme and take up the full width of the page (works with some but not all themes) 

  • Like 3

Share this post


Link to post
Share on other sites

Where does this bloke find time to sleep???????? Another Conkie special!! :D

O and if we are sharing...... ;)

Share this post


Link to post
Share on other sites

@Graham Quince It's called Image Slider on my frog platform.

I've tested it a lot, so should be stable for sharing.  Some low end (mobile) devices don't cope with the animation very well, hence the default value of the animation preference is "off for mobile".

Thanks

Paul

Share this post


Link to post
Share on other sites

Is it tweakable to resize the images when viewing in portrait on mobile? It fits fine when I view in landscape on a phone but the images are just cropped off on either side in portrait. Also, if you could in theory make certain slides clickable, then that would be even better!

Share this post


Link to post
Share on other sites

Hi John

The cropping is by design actually. The slide show was far too small in portrait on mobile, so I needed to set a minimum height. Once a minimum height is set you have two options: let the browser change the aspect ratio of the images (no thanks!) or crop the edges. You could add some css to the page to alter the min height which would result in less/no cropping.

Re clickable - good idea. Internal frog links are a bit tricky though.

Share this post


Link to post
Share on other sites

The height issue is definitely an issue for mobiles and sliders for sure! I was even toying with mobile detection code to serve up a different slider with different formatted pics to make it look nicer but I couldn't find a perfect solution.

External links would be fine - we hardly ever use internal links on website sliders. More relevant for us to send people to documents hosted on Google, external websites and other links outside of Frog.

Share this post


Link to post
Share on other sites

Add this to a html widget above the slider

<style>
    [data-name="Widget.ImageSlider"].widget-content .slider-container .wrap-slider .slide img {
        min-height: 0px !important;
    }
</style>

Nothing will be cropped but the image might get very very small!

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...