What would be the best way to get a carousel component onto a SKUID page? Should we build one w/ SKUID, or can we plug in an existing?

  • 3
  • Question
  • Updated 1 year ago
  • Answered
What would be the best way to get a carousel component onto a SKUID page? Should we build a custom-component using SKLUID options? Or, should we plug-in an existing Carousel component?
Photo of Leslie Cahill

Leslie Cahill

  • 90 Points 75 badge 2x thumb
  • Just fine!

Posted 2 years ago

  • 3
Photo of Christine Jessen

Christine Jessen

  • 670 Points 500 badge 2x thumb
Hey Leslie!

I've been able to create a carousel with Flickity and a tabset.  You can take the CSS directly from Flickity, and then add an external reference to their JS file.  Afterwards, create a tabset with each one of your tabs being one of your carousel panels and use javascript to initialize the carousel and copy the row HTML into an empty wrapper that would hold the carousel.

I'm currently working with one of your team members on a carousel, and this is the method that I've discussed with him as well!  There are definitely other options available online, but this solution was fairly simple to implement

Thanks!
Christine
Photo of Arne-Per Heurberg

Arne-Per Heurberg

  • 1,336 Points 1k badge 2x thumb
hi Christine, do happen to have any sample of how you used tabset? Thanks!
Photo of Christine Jessen

Christine Jessen

  • 670 Points 500 badge 2x thumb
Unfortunately I don't have it anymore, sorry!  I essentially looked at the documentation for Flickity and implemented the carousel through JS from the documentation.  Good luck!
Photo of Arne-Per Heurberg

Arne-Per Heurberg

  • 1,336 Points 1k badge 2x thumb
seems straightforward but I don't quite understand what you mean by copy row HTML into wrapper. sorry if I am missing something.