Shopify
Add or embed 3D, Augmented Reality (AR), and Virtual Reality (VR) content/design to your Shopify website.
Last updated
Was this helpful?
Add or embed 3D, Augmented Reality (AR), and Virtual Reality (VR) content/design to your Shopify website.
Last updated
Was this helpful?
After setting up your store on Shopify, you will need to add your custom products. If you have your products added you can skip this part.
To add your product:
Head over to "Products" on the left hand side of your store.
Add in the necessary information down to price, name of products and an Image of your product
Hit "save" when you are done.
Head over to the "Apps" section on your Shopify dashboard. Click on your already installed SwiftXR (3D/AR/VR) app to open it
To link your Product Click on "Link a 3D Product view". This action will make the page where you will select your product to pop up.
Then Click on "select a product."
(This will allow your 3D entry be linked to your selected product)
After selecting a product, click on "open SwiftXR hub". This will take you to the SwiftXR hub where you will create your 3D/AR/VR entry.
In the SwiftXR hub, Click on "Create project", give your project a name, then click on "create"
N.B (You can make use of the free templates available but its optional)
From the component tab, click or drag and drop a AR component to add it to the white canvas.
To publish your project, click the "Publish" button located at the top right corner of the SwiftXR Editor and then select "Publish Project".
(Optional) You can customise the project URL before you publish
After publishing your project, copy the published project URL, then close the SwiftXR dashboard
Important: Make sure that your project URL has the "swiftxr.app" domain, otherwise our servers will mark it as invalid. You can also view and share the project using the published project URL
Paste the published project URL you copied after publishing your project into the "SwiftXR Published Project Link" input field, then click on "Save entry"
(SwiftXR helps display different 3D/AR/VR project based on the Shopify product connected)
To ensure your SwiftXR 3D rendering displays on your Shopify product page, make sure to add the SwiftXR App Block to a section.
These simple steps allows SwiftXR to display the appropriate 3D rendering based on the Shopify product connected.
To do this;
Click on “Add to online store”
Navigate to the Product Page
Click on the Home page drop down menu, select "Product", then select your product.
Add the SwiftXR (3D/AR/VR) App Block to your desired position on your Product Page
Click on your preffered position to "Add to block". Select "Apps" and then click on "SwiftXR Viewer"
Click on "Save"
Head back to your Shopify dashboard, click on "Themes" under "Online store". Click on "view your store"
SwiftXR's Website Mode lets you seamlessly embed 3D/AR/VR experiences on any page of your Shopify store.
Tip: Adding 3D/AR/VR content across your Shopify Store can help increase customer browsing time and number of items viewed.
Select the "Properties" tab to upload a 3D model, import from a 3D store or Request a 3D model from or use our AI image to 3D converter
