Hi, I’ve been wrestling with this topic as well and recently found a possible solution using HTMX. I’m primarily a designer, so apologies if I don’t get the technical terms right, but HTMX basically allows you to extract a section of a selected page from your website (e.g. a CMS page) and place it in a code embed anywhere on your site.
In my case I combined it with Swiper to create a photo gallery slider using a multi-image CMS field on one of my static pages. The slider is located on the relevant CMS page, the code embed on the static page is then used to retreive it from there.
It came in really handy on one of my latest projects, can be used with dynamic content (dynamic slugs etc.) and it is super easy to set up with minimal custom code. The functionality of the Swiper slider is also preserved, so it just works a treat all round.
It also works perfectly for multi-reference collection lists.
Here is a tutorial I used to set it up:
A bit late on this, but hopefully some of you find this useful ![]()
Edit: I had some issues with the HTMX swap attribute, Swiper didn’t work initially, but wrapping the Swiper slider on the CMS page in an extra div and targeting that instead did the trick ![]()