The Product Gallery Widget can be easily integrated into your React application.
Attached is a code sample for integrating the widget in React. Please follow these steps before running the code:
1. Set your cloud name inside the App.tsx file (line 8).
2. Include an array of assets In the mediaAsset parameter (line 9), by setting tags/public_id.
You can view the options for setting the assets here.
For example (using tags):
mediaAssets: [
{tag: "electric_car_product_gallery_demo",
transformation: {crop: "fill"}
},
// by default mediaType: "image"
{tag: "electric_car_product_gallery_demo", mediaType: "video",
transformation: {crop: "fill"}
},
{tag: "electric_car_360_product_gallery_demo", mediaType: "spin"}
]
After setting these parameters you can run the code.
Comments
1 comment
Is this going to be part of the React Cloudinary SDK at some point? Trying to follow this example with some difficulty. When you declare cloudinary is it drawing the galleryWidget reference from the script you imported inside the public folder?
Please sign in to leave a comment.