HTML iframe

Das Einbetten per HTML-Iframe bedeutet, ein HTML-Iframe-Element in Ihre Webseite oder Ihren Onlineshop einzufügen, um die Vulp-Inhalte anzuzeigen, ohne alle virtuellen Produktdateien selbst zu hosten. So integrieren Sie externe Inhalte nahtlos, ohne dass Nutzer:innen Ihre Seite verlassen müssen.

Um den Vulp-Viewer auf einer Webseite einzubetten, gehen Sie wie folgt vor:

1. Öffnen Sie Ihre HTML-Datei oder den HTML-Editor, in dem Sie das virtuelle Produkt einbetten möchten.

2. Entscheiden Sie, wo das Iframe auf der Seite erscheinen soll, und fügen Sie an dieser Stelle einen HTML-Beispielcode-Tag hinzu.

 <iframe
    src="https://vulp.studio/<customerId>/<modelId>/<lang>"
    allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
    referrerpolicy="no-referrer-when-downgrade"
    width="600"
    height="400"
    frameBorder="0"
    title="vulp.studio"
  ></iframe>

3. Ersetzen Sie <customerId>, <modelId> und <lang> durch die Werte aus der Quell-URL, die Sie aus dem CMS kopieren können. Bitte beachten Sie, dass die Einbettung nur möglich ist, wenn die Website-Domain auf der im CMS festgelegten Whitelist des Kunden steht.

4. Passen Sie das Iframe an, indem Sie Attribute zum <iframe>-Tag hinzufügen. Einige häufig verwendete Attribute sind:

5. Passen Sie den Viewer und das Modell an, indem Sie Parameter zur src hinzufügen. Alle Parameter finden Sie auf unserer Dokumentations-Website.

6. Speichern Sie die Datei und laden Sie sie auf Ihre Website hoch.