Tutte le piattaforme / Guida

Modello 3D e AR su Shoptet

In Shoptet la descrizione del prodotto accetta HTML. Incolli il codice 3DView nella modalità Source (sorgente) dell'editor.

Plugin / app
Non serve
Dove incolli il codice
Prodotto → Descrizione → «Source»
AR sul telefono
Sì, Android e iPhone

Il codice 3DView nella descrizione del prodotto

Non abbiamo testato ogni tema Shoptet: controlla la pagina dopo il salvataggio.

  1. Passo 1

    Copia il codice da 3DView

    Accedi al tuo account, vai su «I miei modelli» e, sul modello, premi «Codice per il sito»: il codice viene copiato subito. Le schede Shopify, WooCommerce e «Qualsiasi sito» mostrano solo dove incollarlo; il codice è lo stesso.

    Copia il codice da 3DView
  2. Passo 2

    Apri il prodotto

    Nell'amministrazione Shoptet vai ai prodotti e apri il prodotto.

    Apri il prodotto
  3. Passo 3

    Passa la descrizione in Source

    Nella descrizione (quella lunga) premi il pulsante «Source» (sorgente) nella barra dell'editor.

    Passa la descrizione in Source
  4. Passo 4

    Incolla il codice e salva

    Incolla il codice e salva il prodotto.

    Incolla il codice e salva
  5. Passo 5

    Controlla il prodotto

    Apri la pagina del prodotto sul computer e sul telefono.

    Controlla il prodotto

Il codice da incollare

Ecco il codice copiato da 3DView (al posto di MODEL_ID vedrai l'ID del tuo modello). Puoi cambiare l'altezza (height:480px); il resto lascialo invariato. Aggiungi ?controls=0 dopo l'ID per nascondere la barra dei comandi sotto il modello.

<iframe src="https://www.3dview.ai/embed/MODEL_ID" title="Divano Oslo" loading="lazy" allow="xr-spatial-tracking; fullscreen; accelerometer; gyroscope" allowfullscreen style="width:100%;height:480px;border:0;border-radius:12px"></iframe>

Come verificare che funzioni

  • Sul computer: il modello si carica, ruota con il mouse e il pulsante «Vedi sul telefono» mostra un codice QR per l'AR.
  • Su Android (Chrome): premi il pulsante AR nell'angolo del modello. Si apre il visualizzatore AR di Google e posizioni il prodotto nella stanza, a grandezza reale. Il telefono deve essere compatibile con ARCore.
  • Su iPhone/iPad (Safari): premi il pulsante AR. Si apre AR Quick Look, senza nessuna app.
  • Fai la prova da Safari o Chrome, non dal browser interno di Facebook/Instagram: lì l'AR non si avvia.

Problemi frequenti e soluzioni

L'iframe non si salva

Chiedi al supporto Shoptet di consentire gli iframe da www.3dview.ai. Nel frattempo, metti il link del modello nella descrizione.

Il codice sparisce o diventa testo dopo il salvataggio

L'editor l'ha ripulito: incolla il codice in modalità HTML / codice sorgente, non in modalità visuale (i passi qui sopra mostrano il pulsante esatto). Se sparisce ancora, la piattaforma non accetta iframe: usa il link e il codice QR di «Condividi / QR».

Il modello è troppo piccolo o appare tagliato

Aumenta l'altezza nel codice: height:480px diventa, per esempio, height:600px. La larghezza (100%) si adatta da sola alla colonna. Sul telefono 400–500px di solito bastano.

Il pulsante AR non compare o non si avvia su iPhone

L'AR su iPhone richiede Safari (o Chrome su iOS) e un iPhone/iPad con iOS 12 o successivo. 3DView prepara automaticamente la versione per iPhone (USDZ). Apri direttamente il link del modello (il pulsante «Vedi in AR» nell'account): se lì funziona, la tua piattaforma blocca l'AR nei frame incorporati; metti sotto il modello un link «Vedi in AR» che punta a quel link.

Il browser segnala «contenuto non sicuro» o il modello non si carica

Non cambiare l'indirizzo del codice in http://. Su un sito https i browser bloccano i frame http (contenuto misto). Lascia l'indirizzo esattamente com'è: https://www.3dview.ai/embed/…

Sul modello compare il logo 3DView

Lo togli per ogni modello, dall'account: «Rimuovi logo», un unico pagamento in crediti. Il codice resta lo stesso.

Rallenta la pagina?

No: il codice ha loading="lazy", quindi il modello si carica solo quando arriva sullo schermo. L'hosting è incluso, senza abbonamento.

Illustrazioni semplificate, non screenshot; i menu possono apparire leggermente diversi nella tua versione.

Domande frequenti

Mi serve un add-on Shoptet?

No. Il codice è normale HTML e funziona nella descrizione.

Posso usare l'opzione con lo script?

Sì: lo script /embed.js si aggiunge una volta sola dalle impostazioni dei codici HTML del negozio, poi usi <view3d-model> nelle descrizioni. Per la maggior parte dei negozi l'iframe basta.

Non hai ancora un modello 3D?

Scansiona il prodotto con il telefono o parti da una foto. Ricevi il codice per il sito, il link con QR e l'AR inclusi.

Crea il tuo primo modello