Interactive models in WordPress

The 3D Viewer add-on embeds models in posts, pages, widgets, Elementor layouts, and WooCommerce product pages. Visitors can rotate, zoom, pan, and inspect models with a mouse or touchscreen. Supported formats include GLB, GLTF, OBJ, STL, FBX, DAE, PLY, and 3DS. Responsive rendering and lazy loading help models display across devices and load when visible.

Model sources and viewer controls

3D Viewer Pro can load a model from an external URL, such as a file hosted on Amazon S3, Google Drive, or a CDN. Its drag-and-drop Elementor widget includes full viewer options. Pro controls let you tailor the presentation:

• Adjust lighting, shadow intensity, and exposure.
• Choose the initial camera angle and enable or disable auto-rotate, fullscreen, and autoplay.
• Show a poster image while the model loads, with a progress bar.
• Add hotspots and annotations to call out details in a model.
• Create a WooCommerce 3D gallery with multiple models for a product.

Product views and augmented reality

A WooCommerce gallery can show a product from several model views, while hotspots and annotations identify specific details. A custom camera angle sets the opening view. Augmented reality is included in the plugin separately from Pro controls: visitors on supported phones can place a model in their room, and desktop users can scan a QR code to open it on a phone. AR placement can be set for a floor or wall, with an optional iOS .usdz source. Supported modes include WebXR, Scene Viewer, and Quick Look.

Add a model to a page

1. In the WordPress dashboard, go to 3D Viewer → Add New.
2. Upload a model, or use Pro to paste an external URL.
3. Configure the viewer settings, such as lighting, rotation, background, and camera.
4. Save the viewer to generate a shortcode.
5. Paste the shortcode into a post, page, or widget. You can also add the 3D Viewer block in the block editor.

To add a model to a WooCommerce product, edit the product, use the 3D Viewer Settings metabox to upload a model or use Pro to add an external link, then publish the product.