Incorpora il tour con un <iframe>

Introduzione

Se da una parte puoi sempre condividere un link ad un tour virtuale Matterport anche personalizzandolo, un'opzione ancora migliore è quella di incorporare direttamente sul tuo sito web il tour Matterport.

In questo modo il tuo virtual tour Matterport apparirà nel mezzo della tua pagina web, proprio come un video YouTube. Per esempio:

 

Istruzioni base

1) Setta il tour virtuale (Space) su Public. Scopri di più.

2) Identifica la pagina web dove vuoi incorporare il tour virtuale.

3) Copia e incolla il seguente codice sul codice sorgente di quella pagina. Istruzioni più dettagliate dipendono dal tuo sito web (vedi la sezione seguente).

<iframe width="700" height="400" src="https://my.matterport.com/show/?m=xxxxxxxxxxx" allowfullscreen></iframe>

4) Al posto delle xxxxxxxxxxx inserisci il riferimento del tou proprio link URL. Puoi inserire i tuoi parametri URL anche qui. 

Aggiungi sempre allowfullscreen al codice iframe quando effettui l'embed del virtual tour. E' importante per i tuoi visitatori che utilizzano il telefono perchè avranno bisogno della modalità schermo intero per attivare la modalità Realtaà Virtuale.

 

Quando si utilizza un sisterma di gestione dei contenuti (CMS)

Se stai utilizzando un sistema di gestione dei contenuti (CMS / Content Management System) come Wordpress, Drupal, Wix, Zendesk, Medium, etc per gestire il tuo sioto web allora avrai bisogno di aprire il codice sorgente HTML per quella pagina.

La procedura normalmente prevede:

  1. Log in sul tuo CMS backend
  2. Trova la pagina dove vupio inserire il tour virtuale
  3. Trova l'icona che indica questo simbolo </> per aprire il codice sorgente

L'esempio seguente vale per Zendesk help center.

zendesk-open-source-code.png

Avrai bisogno di una conoscenza basilare del codice HTLM per capire esattamente in che ounto incollare il codice <iframe>.

Qualche CMS provider potrebbe richiederti di autorizzare l'inserimento di codici HTML poichè potrebbero risultare dannosi. Non preoccuparti! I tour virtuali Matterport non sono dannosi :)

 

Wordpress.com o Wordpress CMS

Wordpress.com non autorizza iframes da default, quindi la via più breve per incorporare il 3D Showcase è quello di inserire l'URL my.matterport.com nel Visual Tab e Wordpress lo convertirà in embed. Per esempio:

HTMLExample.png

I siti che utilizzano il CMS di Wordpress autorizzano gli Iframes, quindi potrai incollare il codice iframe drettamente nel post. Per ulteriori personalizzazioni puoi anche provare i seguenti plug-ins:

 

Wix

Inizia dall' editing della pagina sulla quale vuoi incorporare il tour virtuale. Click Add > More > Embed a Site.

Una finestra grigia comparirà. Muovi la finestra grigia sulla pagina dove vuoi inserirla.

Clicca su Enter Website Address sopra la finestra grigia. Incolla l'URL del tuo tour virtuale (il link). Dovresti adesso vedere comparire il 3d virtual tour di Matterport nella finestra.

Wix_Example.png

 

Medium Blog Post

Nella pagina di gestione dei contenuti di Medium prima di tutto trova il post o la bozza dove tu vuoi inserire il virtual tour di Matterport.

  1. Clicca + per aggiungere una nuova sezione
  2. Click <> to specify that you want to add an embed.
  3. Clicca <> per specificre che tu vuoi aggiungere un embed

MediumEmbed123.png

  

Placester

Nella pagina di gestione dei contenuti del CMS Placester dovrai prima aprire la pagina in cui vorrai posizionare il tour virtuale Matterport.

open-html-code-on-placester.png

  1. Apri l'icona <>
  2. Incolla il codice <iframe>
  3. Clicca nuovamente sull'icona HTML <> per ritornare alla pagina editor.

Adesso potrai vedere il tuo iframe incorporato sulla tua anteprima del sito. Salva le modifiche e la modifica saraà effettiva.

Visita la pagina di supporto di Placester per ulteriori dettagli.

 

Accesso diretto al codice sorgente HTML

Se non utilizzi un CMS dove puoi effettuare t ustesso le modifiche contatta il tuo webmaster e chiedi supporto.

Se tu sei il webmaster (o se hai accesso diretto all'edit dell'HTML) potrai aggiungere il codice <iframe> direttamente sul codice sorgente HTML.

Have more questions? Submit a request