Vizbl Core AR

Integration Options: Multi-item AR

View and arrange multiple products together in the same AR scene

Lets iOS users place multiple products at once and switch between color variants in AR. On Android, it works as a One-Click AR. Available on Pro, Pro Plus, and Enterprise plans.

1. On your website, add this script before the </header> tag or inside <head>:

<script type="module" src="https://viewer.vizbl.com/app_button/script.js" async defer></script>
<script>    
  window.onload = function() {      
    window.vizbl.initAppButton('vizbl_app_button')    
  }
</script>

2. Add a link that will open the AR view when tapped:

<button  
  rel="ar"  
  type="button"  
  class="vizbl_app_button"  
  data-object-tinuuid="example-tinuuid-12345"  
  data-object-hid="example-hid-67890"  
  data-native-link="#">  
  <img style="display: none" />
</button>

example-tinuuid-12345 — your object's ID. To get it, click the copy icon on any model in the list, then click the same icon next to Object ID in the dropdown.

example-hid-67890 — the color variant of the object. This field is optional — you can leave it empty or remove it entirely. To get the HID, open the same dropdown and select Variant ID instead of Object ID.

A configured element might look like this:

<button  rel="ar"  type="button"  class="vizbl_app_button"  data-object-tinuuid="K7CCtKS9Qaer7fQW-6IN1Q"  data-object-hid=" "  data-native-link="#">  
  <img style="display: none" />
</button>

Integration Options: Multi-item AR

Still need help?