Fibbl Documentation

Appearance

Fibbl QR Code ​

An element showing a QR code with a link to the Augmented Reality (AR) or Virtual Try On (VTO) pages. For models, that support desktop browser VTO it also shows a button that allows a user to start VTO at once. On mobile devices this element serves as a button that starts AR/VTO at once, and no QR code is shown.

Code example ​

html
<script 
    src="https://cdn.fibbl.com/fibbl.js" 
    type="module"
></script>
<fibbl-qr-code
    data-product-id="@demo-glasses"
    data-type="vto"
    style="width: 300px; height: 300px"
></fibbl-qr-code>

Custom attributes ​

  • data-product-id - a unique id of product in Fibbl's databases.
  • data-type - either ar or vto. The parameter defines whether the link leads to an augmented reality or virtual try on page.

Live demo ​

See the Pen fibbl-qr-code by Fibbl (@Fibbl) on CodePen.