Download free
Get Premium

3D Product Viewer

Documentation / Premium features

Premium

3D Product Viewer

Adds the EE 3D Product Viewer widget: interactive GLB/GLTF models with drag-to-rotate, auto-rotate, lighting presets and hotspot annotations, rendered with a bundled three.js (Draco-compressed models supported). Allows .glb/.gltf uploads for users who can upload files and adds a "3D model" picker to WooCommerce products. Requires WordPress 6.5+.

Where Elementor panel → LandTech Extras category. Products → Edit product → Product data → General → 3D model. Elementor Extras → All Tools → 3D Product Viewer shows the requirements, where the widget is used, and which products and files have 3D models.

How to use it

  1. Turn on "Platform: 3D Product Viewer" under Settings → Add-on features. WordPress 6.5 or later is required.
  2. Upload a .glb file (recommended) or a self-contained .gltf file to the Media Library. Draco-compressed models are supported.
  3. Drag the EE 3D Product Viewer widget onto a page and choose the file under 3D model → GLB / GLTF file.
  4. For WooCommerce, pick the model in the product's 3D model field, then set the widget's Model source to "Product's 3D model". Leave "Use product from loop/context" on for single-product templates and loops, or turn it off and enter a product ID.
  5. Set the height, auto-rotate, zoom/pan, camera distance and lighting (Studio, Outdoor or None). Add a poster image to show while the model loads.
  6. Add hotspots: in the editor preview, double-click the model to copy the coordinates of that point, then paste them into a hotspot's "Paste coordinates" field and add a label and description.

Notes

  • Choose "When the visitor clicks View in 3D" under Behavior → Load model for large files, so they download only on request.
  • Visitors can drag to rotate, scroll or pinch to zoom, or focus the viewer and use the arrow keys and + / −. Auto-rotate is off for visitors who prefer reduced motion.
  • A .gltf that references separate .bin or texture files may not load from the Media Library; export a single .glb instead. Models served from another domain (offloaded media or a CDN) need CORS headers.
  • On block themes, a viewer placed only in a Theme Builder template (not in the page itself) does not load. Classic themes work everywhere.
  • Developers: the product field is stored in the _product_3d_model_id meta (an ACF field with that name also works); filter landtech_extras_3d_viewer/product_model_id.