Drupal Integration
Let Drupal Commerce shoppers spin products in 3D, configure options and view them in their room with app-free AR — added with a lightweight embed.
How it integrates
Build your 360° viewer, configurator and AR experience once in Thridify and publish it. Add it to a Drupal Commerce product page with a lightweight embed — a custom-block or snippet in your Drupal template; the Thridify JS SDK renders the published experience and matches each product by ID. AR runs in the browser — no app for your shoppers.
Install: lightweight embed / block on your Drupal page
Create the 3D viewer, configurator or AR experience for your product and publish it — each gets a stable ID.
Drop the Thridify embed into a Drupal custom block or template snippet on the product page and map it to the product by ID.
The JS SDK renders the live experience — customers explore in 3D and view the item in their room, app-free.
Install guide
There is no Drupal module to install. Thridify runs from one script on the page plus the ID of the product being viewed, and Drupal gives you two clean places to put them: a theme library or a block. Both survive core and Commerce updates.
Add the script as an external library in your theme’s *.libraries.yml and attach it in the product template, so it loads only on product pages. If you would rather not touch the theme, place a custom block in the content region and limit it to product URLs (Drupal Commerce uses /product/* by default) under the block’s visibility settings.
# mytheme.libraries.yml
thridify:
js:
https://viewer.thridify.com/floating-icon.js: { type: external, attributes: { async: true } }
{# templates/commerce/commerce-product.html.twig #}
{{ attach_library('mytheme/thridify') }}Output your account ID and the product reference you set for that product in Thridify. In the commerce-product Twig template the product entity is available, so its ID can be printed straight into a data attribute.
<script>
window.thridifyData = Object.assign(
{ accountId: "YOUR_THRIDIFY_ACCOUNT_ID" },
window.thridifyData || {}
);
</script>
<div data-thridify-page-product-id="{{ product_entity.id }}"></div>Drupal caches rendered pages and blocks, so rebuild caches (drush cr, or Clear all caches under Performance) before testing. On a product with a published experience you should see the 3D trigger next to the gallery.
What you get
Drupal Commerce runs high-consideration catalogues. Thridify upgrades static Drupal media into an experience shoppers can spin, configure and place in their own room.
Drag-to-spin and zoom let Drupal shoppers inspect every angle — showroom confidence right on the product page.
One tap places the product at true scale in the buyer’s space, straight from your Drupal page — no app to install.
Shoppers swap finishes and options in real time with live pricing, embedded right on the Drupal product page.
The impact
FAQ
The questions Drupal Commerce merchants ask most.
Yes. Thridify embeds a 3D viewer, configurator and app-free AR on Drupal Commerce product pages via a lightweight custom-block or snippet — no re-platforming.
Publish the experience in Thridify, then paste the embed into a Drupal custom block or template on the product page and map it to the product by ID. The JS SDK renders it live.
No. AR runs in the browser on any modern smartphone, so Drupal shoppers place products in their room in one tap — no app download.
Yes. The embed sits inside your existing Drupal layout beside your current media, so it matches your site’s theme.