JSFiddle - React, Tailwind, and code Playground

by Shirly Manor

HTML

<script src="https://product-gallery.cloudinary.com/all.js" type="text/javascript"></script>

<div id="my-gallery" style="width: 640px; max-width: 100%; margin: 30px auto;"></div>

JavaScript

const myWidget = cloudinary.galleryWidget({
  cloudName: "shirly-assets",
  container: "#my-gallery",
  aspectRatio: "3:4",
  mediaAssets: [
    {
      tag: "shoes_product_gallery_demo_spinset",
      mediaType: "spin"
    }
  ],
  zoomProps: {
    type: "popup"
  },
  carouselStyle: "none"
});
myWidget.render();