Integrate augmented reality and 3D on PrestaShop
No commitment, no credit card required.
Why add 3D to your PrestaShop store?
PrestaShop is the leading e-commerce solution in France and Europe, with over 300,000 active stores. For PrestaShop merchants, integrating 3D visualization and augmented reality on product pages is a major growth lever.
Studies show that product pages equipped with an interactive 3D viewer generate a conversion rate up to 94% higher than standard pages. Time spent on the page doubles, returns decrease by 40% and customer engagement reaches unprecedented levels. For a PrestaShop merchant, these results mean more sales, less after-sales service and a stronger brand image.
Augmented reality lets your customers project your products into their real environment via their smartphone. But for this projection to be credible and useful, the product must appear in the right place: a sofa placed on the living room floor, a painting hung on the hallway wall, a shelf fixed at the right height in the office.
Prerequisites
To integrate 3D and augmented reality on your PrestaShop store, you will need:
- A Visuality account: Create your account for free at visuality.fr. A free trial lets you test all features.
- A 3D model of your product: In GLB or GLTF format. If you don't have a 3D model, use the AI 3D generation tool built into Visuality.
- An active PrestaShop store: Version 1.7 or higher recommended. You must have access to the back-office to install the Visuality module or integrate the iframe code.
Step 1: Create your Visuality account
Registration on Visuality is free and immediate. Go to visuality.fr, enter your email and create your password. No credit card required to get started.
Visuality offers plans adapted to every need: from freelancers who want to present a few products to businesses managing a catalog of hundreds of 3D models.
Step 2: Import your 3D model
From your dashboard, click "Add a 3D object" to import your file. Visuality accepts GLB and GLTF formats, which are the web standards for 3D.
Don't have a 3D model? Visuality includes an AI-based 3D generator. Import one or more photos of your product and get a 3D model ready for augmented reality in minutes.
The built-in editor then allows you to refine your model's rendering: scale adjustment, material modification, lighting adjustment and adding interactive hotspots.
Step 3: Install the Visuality PrestaShop module
Visuality offers a dedicated PrestaShop module that simplifies integrating 3D on your product pages. Here is how to proceed:
- Module installation: Download the Visuality module from your client area, then install it from the PrestaShop back-office via the module manager.
- Configuration: Once the module is installed, access its configuration page. Enter your Visuality credentials to connect your store to your account.
- Product-model association: For each PrestaShop product page, associate the corresponding 3D model from the Visuality tab automatically added by the module.
If you prefer a manual integration, you can also use the iframe code provided by Visuality. Copy it from your object's sharing page and paste it into your PrestaShop product description.
Find all integration options in our e-commerce integrations documentation.
Step 4: Configure display on your product pages
Once the module is installed or the iframe is integrated, several customization options are available to optimize the 3D viewer display on your product pages:
- Viewer position: Choose to display the 3D viewer above the description, replacing the main photo gallery or in a dedicated tab.
- Dimensions and responsive: Configure the viewer width and height to adapt it to your theme. A responsive format with 100% width is recommended to ensure optimal display on mobile, tablet and desktop.
- Augmented reality button: The AR button automatically appears on compatible devices (iOS with ARKit, Android with ARCore). You can customize its text and position.
- Test and validation: Test the rendering on mobile and desktop. Verify that the augmented reality scale matches the real size of your product.
Once configuration is complete, your product pages are enhanced with an interactive 3D experience and augmented reality. Your customers can view your products from all angles and project them at home before purchase.
To track the integration's impact, monitor the evolution of your key indicators: conversion rate, time spent on product pages, return rate and customer satisfaction.