Trying to implement image carousel on top of product page. (possibly flickity)

Store Design
1

Hello!
I am working on an existing site and I need to implement a swipe-able and clickable image carousel that looks like this:

wp1_0-1665775628263.png
wp1_0-1665775628263.png1600×1468 255 KB

I would need to be able to add the images from the Shopify front end. And the images should be ( 1 : 1 ) ratio
Searching online I came across a site that had something similar.

https://www.studioproper.com/ has a slider on their page that looks like this:

wp1_1-1665775784470.png
wp1_1-1665775784470.png2838×1254 357 KB

Examining their code it appears they use https://flickity.metafizzy.co/
I have tried following every tutorial for them and I just cant get it to work. I am looking for help implementing that or a different solution. I am willing to pay, but not on a subscription basis unless their is no other option.

About this site:

My site: https://will-test-store-10-13.myshopify.com/?_ab=0&_fd=0&_sc=1
PW: theo
CSS says that the theme is Debut.

2

You not able to get flickity to work or you aren’t able to get the structure??

3

I am not able to get flickify to work at all. This is an older site and I wonder if it being out dated is the cause.

4

I don’t think so, try using owlcarousel and see if that works. And if you’re still not able to figure it out then you can gimme access to your store as a staff for me to check the issue if thats fine by you.