Con la solución Tikee de Enlaps y la aplicación web myTikee dedicada a 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 comparación antes-después o una galería de imágenes, tiene acceso a enlaces iframe personalizables. Este tutorial le guiará a través de los pasos para personalizar estos iframes y optimizar la visualización de su proyecto de timelapse en su obra o estudio.

Cómo acceder al código de integración del iframe

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

1. Vaya a Proyecto.

2. Haga clic en Compartir.

1. Modificar el tamaño del iframe

El código de inserción del iframe se puede personalizar fácilmente de forma directa. A menudo, cuando se inserta una galería con un iframe, aparece una barra de desplazamiento por defecto si la galería es más grande que el espacio del iframe. Para evitar esto, se pueden añadir dos opciones sencillas para ajustar el iframe.

Una opción es cambiar el alto (height) y el ancho (width) del iframe para que coincidan con la galería, modificando los valores numéricos correspondientes en el código, tal como se muestra a continuación.

<iframe src="https://staging.tikee.io/time_lapses/1879/photo_gallery/6b12e12d-5650-4aed-8495-38fee083fbba?lang=en" 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 inserción para quitar esta barra. Advertencia: si elimina la barra de desplazamiento de la galería, asegúrese de ajustar la altura suficiente para que los botones de control de reproducción de su timelapse no queden cortados.

Para que el vídeo se adapte automáticamente al tamaño de la página web, se debe 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. Personalización de los colores del iframe

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

• primary_color: como “#090909” pero sin el “#”, ya que lo introducimos en una URL.

  • secondary_color: como “#090909” pero sin el “#”, ya que lo introducimos en una URL.

  • font_color: como “#090909” pero sin el “#”, ya que lo introducimos en una URL.

Añada estos parámetros en la URL como lo haría con cualquier otra variable de consulta:

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

Todo junto quedaría así:

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

3. Selección de los modos de visualización en el iframe

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

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

  • single: modo de desplazamiento panorámico normal

  • compare: vista de comparación antes-después, ideal para el seguimiento de obras

  • immersive: vista inmersiva con reproyección espacial

  • allowed_viewer_types: como “single”, “compare”, “immersive” separados por comas

/!\ Estos parámetros funcionan de manera conjunta: no se puede utilizar “allowed_viewer_types” sin haber definido previamente “default_tab”.

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

Todo junto quedaría así:

<iframe src="https://my.tikee.io/time_lapses/{...}/photo_gallery/{...}?lang=en&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

Si desea proteger las fotografías del avance de su proyecto, puede ocultar los botones de descarga en el iframe de la siguiente manera:

• hide_downloads: “true”, “false”

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

Todo junto quedaría así:

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

5. Selección del idioma

Puede elegir el idioma de la interfaz del visor en su iframe cambiando el parámetro “lang”. Los valores aceptados son “en” (inglés) y “fr” (francés).

Personalizar los iframes de sus proyectos de timelapse Tikee es un proceso sencillo que le otorga un control total sobre el aspecto y las funciones de sus galerías integradas en su sitio web. Ajustando las dimensiones, los colores, los tipos de visualización y otros parámetros, conseguirá integrar de manera fluida el seguimiento visual de sus proyectos en su estrategia de comunicación digital.

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