Product Image 360°

Product Image 360°

Welcome to the “Panorama 360° Gallery” documentation. Looking to integrate a product image 360° into your website? Our widget enables you to showcase your products in a dynamic and engaging way. In this guide, we'll show you how to use the editor to customize your product image 360° widget.

Step 1 : Open The Editor
Step 2 : Customize The Content
Step 3 : Adjsut The Image 360°
Step 4 : Configure Settings
Step 5 : Choose Colors
Step 6 : Preview      





Step 1: Open the Editor
1. Go to Product Image 360° template.
 2. Click on "Edit" after choosing your template.




Step 2: customize the content

1.Start by reviewing this guide to understand how to upload your product's 360° images.





2. Following that, you can effortlessly add, remove, or rearrange your images as needed.




3. For each image, follow the steps outlined in the guide to upload pictures and select a sample for both X and Y rotations, specifying the number of pictures for each.e.
You also have the option to choose a cover image, add descriptive text, and include hotspots.





4. Customize each hotspot by adding a title and link, specifying whether it opens in a new tab, and adjusting its position in every image.






Step 3: Adjust the image 360°

1. In this panel, you'll fine-tune all the settings for your 360° images. Start by activating autoplay, specifying the speed, and defining its behavior.
You can choose to play it once and even reverse the images.





2. Here, you have the option to enable or disable the drag mode, specify its speed, and decide whether the drag should be reversible.





3. When it comes to content, you can toggle the fullscreen and magnifier options, as well as the visibility of the bottom circle and the 360 logo.
Additionally, you can activate keyboard controls and disable the loop.






Step 4: Configure settings

Here, you'll handle the settings:
1. Start by the view section where you can decide whether to display the header or not. You can also select the width and the container height of your product's 360° images.





2. For the small images, you can customize their position and the gap between them. You can also adjust their width and height, select their roundness, modify the border, apply an overlay, and choose the text size for captions.






Step 5: Choose Colors

Within this panel, you can select colors that match your website's design.






Step 6: Preview

Lastly, you can click on “Preview” to see how your product image 360° widget looks on both desktop and mobile devices. After this, you can proceed to the next step.



Related Articles:
Before/After Slider Panorama 360° Gallery