I'm trying to use the groupCells option that is part of the Flickity 2.0.9 script included with Flickity Carousel 8.x-2.x.
On the "Flickity settings groups" page at /admin/config/flickity, I set "Group Cells" to 3.
Result: The View still displays all six items instead of three items per slide.
Trying to figure out why, I see the following issues in the code.
First, according to the groupCells information on the Flickity Options page at https://flickity.metafizzy.co/options.html#groupcells, the "is-selected" class should be added to the multiple cells in the selected slide. I don't see "is-selected" in the HTML code when I view source for the View I created with the Flickity Carousel module.
Second, according to the CodePen illustrating the use of groupCells at https://codepen.io/desandro/pen/EywKOW, the containing DIV includes data-flickity='{ "groupCells": 3 }'. I don't see that in the HTML code when I view source for the View I created with the Flickity Carousel module.
When I tried adding it to the HTML code of my View using Firebug, it uses double quotes around { "groupCells": 3 } instead of the single quotes used in the CodePen and it doesn't work. I also tested the CodePen by editing it to change the single quotes to double quotes and then the CodePen doesn't work, so it appears the single quotes are important.
It seems like the Flickity Carousel module should be adding both the above bits of code.
I don't know where to go from here. Is there additional testing I can do to help troubleshoot?
Active
2.0
Code
Not all content is available!
It's likely this issue predates Contrib.social: some issue and comment data are missing.
I know this issue is really old but this issue is still present in the 3.x branch.
The Group cells field should allow more than only numbers. Flickity groupCells uses an integer, a boolean or a percentage value, see https://flickity.metafizzy.co/options#groupcells.
In a project I'm working on I'm using 4 for a carousel with logos. This is fine on desktop but on mobile 4 is too much. So, the option 'true' would be a solution: this takes into account the viewport.