Con la solución Tikee de Enlaps y la aplicación web myTikee dedicada al timelapse, puede integrar fácilmente su proyecto de timelapse en su sitio web con un solo clic. Tanto si desea añadir un vídeo panorámico, una comparativa antes-después o una galería de imágenes, dispone de enlaces iframe personalizables. Este tutorial le guía a través de los pasos necesarios para personalizar estos iframes y optimizar la visualización de su proyecto de timelapse.

Acceder al código de integración del Iframe

Para encontrar su código iframe, vaya al índice del proyecto:

1. Vaya a Proyecto.

2. Haga clic en Compartir.

1. Modificar el tamaño del Iframe

El código de incrustación del iFrame se puede personalizar fácilmente directamente desde el propio código. A menudo, cuando se incrusta una galería mediante un iframe, aparece una barra de desplazamiento predeterminada si la galería es más grande que el iframe. Para evitar esto, hay dos opciones que se pueden añadir para ajustar fácilmente el iframe.

Una opción es cambiar la altura y la anchura del iframe para que coincidan con la galería, modificando los valores numéricos de height y width del código, tal y como se muestra a continuación.

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

También puede eliminar el borde y la barra de desplazamiento. Puede añadir scrolling=no y frameBorder=0 al código de incrustación para eliminar esta barra. Aviso: si elimina la barra de desplazamiento de la galería, asegúrese de ajustar la altura para que los botones de control no queden cortados.

Para que el vídeo se adapte al tamaño de la página, es necesario añadir ?fluid=true en el iframe

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

2. Personalizar los colores del Iframe

puede elegir los colores de su iframe de la siguiente manera:

• primary_color=5f9ea0

• secondary_color=ff9800

• font_color=db0b93

Pase estos parámetros como pasaría cualquier parámetro de consulta a una URL, separados por &:

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

Todo junto:

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

3. Elegir los tipos de visor en el Iframe

Puede elegir los tipos de visor que desea en su iframe de la siguiente manera:

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

• single: modo panorámico normal

• compare: vista de comparación antes-después

• immersive: vista inmersiva con reproyección

allowed_viewer_types: single,compare,immersive separados por una coma.

/!\ Estos parámetros funcionan juntos, no puede usar allowed_viewer_types sin default_tab.

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

Todo junto:

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

4. Ocultar los botones de descarga

Puede ocultar los botones de descarga en su iframe de la siguiente manera:

• hide_downloads : “true”, “false”

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

Todo junto:

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

5. Elegir el idioma

Puede elegir el idioma del visor de su iframe modificando el parámetro “lang”.

Valores admitidos:

lang=en
lang=fr
lang=de
lang=es
lang=ar

6. Rotación de imágenes

Puede rotar las imágenes mostradas por el iframe añadiendo este parámetro a la URL:

• rotate: "true" o "false".

Cuando está activado, las imágenes se giran con un ángulo fijo de 180°. Por defecto, las imágenes no se rotan.

Ejemplo:

<iframe src="https://my.tikee.io/{...}?lang=es&rotate=true" allowfullscreen style="width: 900px; height: 620px; border: none;"></iframe>

<iframe src="https://my.tikee.io/{...}?lang=es&rotate=true" allowfullscreen style="width: 900px; height: 620px; border: none;"></iframe>

<iframe src="https://my.tikee.io/{...}?lang=es&rotate=true" allowfullscreen style="width: 900px; height: 620px; border: none;"></iframe>

Personalizar los iframes de sus proyectos de timelapse Tikee es un proceso sencillo que le permite controlar la apariencia y la funcionalidad de sus galerías en su página web. Al ajustar las dimensiones, los colores, los tipos de visor y otros parámetros, puede integrar a la perfección su contenido de timelapse en su estrategia de comunicación online.

Para obtener más información sobre la solución Tikee y sus aplicaciones, visite nuestro sitio web.