The “360 Product Viewer Widget” allows you to present every angle of your product through its dynamic 360-degree view, which cannot be conveyed using a static image. You also have the ability to magnify specific attributes or elements, spin the item, and draw attention to its distinctive characteristics using the hotspots feature.
You provide an array of images showcasing your product from different perspectives. The widget then smoothly blends these sequences to produce an interactive 360° product view. Users can easily engage with your product, rotate it, and examine every detail, offering an immersive experience that enhances the visual appeal of your website. Say goodbye to stagnant images and embrace the future of product presentation with our user-friendly Elementor widget.
Let’s look at each of the options in the “360 Product Viewer Widget” below.
Install 360 Product Viewer Widget for Elementor
This widget requires Unlimited Elements PRO version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “360 Product Viewer”
- Hover over the widget in the search results and click install
- Add your “360 Product Viewer” widget to any Elementor Page
Paste the URL of folder where the sequence images are stored.
If filenames are product_0001.jpg, product_0002.jpg, product_0003.jpg then enter "product_ "
File Index Base Zero
If filenames are product_0001.jpg, product_0002.jpg, product_0003.jpg then put file index base zero value to 4.
Select the file format you stored earlier.
Set the image count.
Set the drag speed.
Turn on or off the drag reverse option.
Stop on Edge
Turn on to stop the viewer on edge.
Enable Full Screen
Enable or disable the fullscreen option.
Disable the drag option.
When turned on, widget will only load if user scroll to it.
Turn on or off the control reverse option.
Show Arrow Keys
Show arrow keys to rotate and view product.
Show Bottom Circle
Show/Hide the bottom circle.
Show Loading Progress Bar
Show loading progress bar of viewer.
Enable/disable zoom on viewer.
Set the zoom level on viewer.
Turn on or off the autoplay option.
Turn on to autoplay the viewer in reverse direction.
Set the autoplay speed in milliseconds.
Viewer will only play once.
Enable/disable hotspots on image.
Hotspots Debug Data
Enable debug data for initial image dimension width and height.
Initial Dimension Width
Set the initial width for hotspot.
Initial Dimension Height
Set the initial height for hotspot.
Select the type of hotspot.
Type title for hotspot.
Type or paste your URL to link with hotspot.
Hotspot Position Data
Type the hotspot position data where imageIndex used for Frame or Image number, xCoord for horizontal positioning, and yCoord for vertical positioning.
360 Product Viewer Widget Styling
Every aspect of the widget’s design can be controlled through different styling options. Choose colors that complement the style of your website. You can modify the text, icons, fonts, and layout to make the widget look and work the way you want.
In this section, set the positioning of bottom circle.
Hotspots Icon Styling
You can set the hotspot icon background, size, color, border color, background color, background border, and background border color.
Hotspots Popup Styling
Set the background color, border, box shadow, padding, title typography, color, text shadow of hotspots popup.
Here are some live use cases for the 360 Product Viewer Widget.