Con la soluzione Tikee di Enlaps e la web application myTikee dedicata al timelapse, puoi facilmente integrare il tuo progetto timelapse nel tuo sito web con un solo clic. Che tu voglia aggiungere un video panoramico, un confronto prima-dopo o una galleria di immagini, hai accesso a link iframe personalizzabili. Questo tutorial ti guida attraverso i passaggi per personalizzare questi iframe al fine di ottimizzare la visualizzazione del tuo progetto timelapse.

Accedere al codice di integrazione dell'iframe

Per trovare il codice del tuo iframe, vai all'indice del progetto:

1. Vai su Progetto.

2. Clicca su Condividi.

1. Modifica delle dimensioni dell'iframe

Il codice di integrazione dell'iframe può essere facilmente personalizzato direttamente dal codice stesso. Spesso, quando si integra una galleria tramite iframe, compare una barra di scorrimento predefinita se la galleria è più grande dell'iframe. Per evitare questo inconveniente, si possono aggiungere due opzioni per regolare facilmente l'iframe.

Una prima opzione consiste nel modificare l'altezza e la larghezza dell'iframe per adattarle alla galleria, cambiando i valori di altezza (height) e larghezza (width) nel codice come mostrato di seguito.

<iframe src="https://staging.tikee.io/time_lapses/1879/photo_gallery/6b12e12d-5650-4aed-8495-38fee083fbba?lang=it" allowfullscreen style="width: 900px; height: 620px; border: none;" ></iframe>

È anche possibile rimuovere il bordo e la barra di scorrimento. Puoi aggiungere scrolling = “no” e frameBorder = “0” al codice di integrazione per eliminare questa barra. Attenzione: se rimuovi la barra di scorrimento della galleria, assicurati di impostare un'altezza sufficiente per evitare che i pulsanti di controllo vengano tagliati.

Per fare in modo che il video si adatti alle dimensioni della pagina, è necessario aggiungere " ?fluid=true " nell'iframe

<iframe src="https://my.tikee.io/videos/cc3dc6e1-862b-4132-b563-61c92ce0a60a?fluid=true" style="width: 100%; height: 100%; border: none;"></iframe>

2. Personalizzazione dei colori dell'iframe

Puoi scegliere i colori del tuo iframe in questo modo:

• primary_color: ad esempio “#090909” ma senza il carattere “#” poiché lo inseriamo in un URL.

  • secondary_color: ad esempio “#090909” ma senza il carattere “#” poiché lo inseriamo in un URL.

  • font_color: ad esempio “#090909” ma senza il carattere “#” poiché lo inseriamo in un URL.

Passa questi parametri come faresti con qualsiasi parametro di query a un URL:

https://my.tikee.io/time_lapses/{…}/photo_gallery/{…}?lang=it&primary_color=5f9ea0&secondary_color=ff9800&font_color=db0b93

Esempio completo:

<iframe src="https://my.tikee.io/time_lapses/{...}/photo_gallery/{...}?lang=it&primary_color=5f9ea0&secondary_color=ff9800&font_color=db0b93" allowfullscreen style="width: 100%; height: 100%; border: none" ></iframe>

3. Scegliere le modalità di visualizzazione nell'iframe

Puoi scegliere i tipi di visualizzatore che desideri nel tuo iframe in questo modo:

• default_tab: “single”, “compare”, “immersive”

  • single: modalità panoramica standard

  • compare: vista di confronto prima-dopo

  • immersive: vista immersiva con riproiezione

  • allowed_viewer_types: ad esempio “single”, “compare”, “immersive” separati da una virgola

/!\ Questi parametri funzionano insieme, non puoi utilizzare “allowed_viewer_types” senza definire anche “default_tab”.

https://my.tikee.io/time_lapses/{…}/photo_gallery/{…}?lang=it&default_tab=immersive&allowed_viewer_types=single,compare,favorite,video

Esempio completo:

<iframe src="https://my.tikee.io/time_lapses/{...}/photo_gallery/{...}?lang=it&default_tab=immersive&allowed_viewer_types=single,compare,favorite,video" allowfullscreen style="width: 100%; height: 100%; border: none" ></iframe>

4. Nascondere i pulsanti di download

Puoi nascondere i pulsanti di download nel tuo iframe in questo modo:

• hide_downloads: “true”, “false”

https://my.tikee.io/time_lapses/{…}/photo_gallery/{…}?lang=it&hide_downloads=true

Esempio completo:

<iframe src="https://my.tikee.io/time_lapses/{...}/photo_gallery/{...}?lang=it&hide_downloads=true" allowfullscreen style="width: 100%; height: 100%; border: none" ></iframe>

5. Scegliere la lingua

Puoi scegliere la lingua del visualizzatore del tuo iframe modificando il parametro “lang”; i valori accettati sono “en” e “fr”.

Personalizzare gli iframe dei tuoi progetti timelapse Tikee è un processo semplice che ti consente di controllare l'aspetto e le funzionalità delle tue gallerie sul tuo sito web. Regolando dimensioni, colori, modalità di visualizzazione e altri parametri, puoi integrare in modo fluido i tuoi contenuti timelapse nella tua strategia di comunicazione online.

Per ulteriori informazioni sulla soluzione Tikee e le sue applicazioni, visita il nostro sito web.