Hay varias opciones para añadir un vídeo en su sitio web: Añadir vídeos de YouTube y Vimeo, Kinescope, una opción para añadir el enlace directo a un vídeo en un servidor de terceros (vídeo HTML5) y utilizar iFrame para añadir un vídeo.

Cómo añadir vídeos de YouTube

Puedes añadir los vídeos de YouTube mediante los bloques VD01 (un vídeo), VD04 (visualización de un vídeo tras pulsar el botón Reproducir), VD06N (dos vídeos), VD08 (vídeo y texto), VD09 (vídeo emergente), VD11 (vídeo con una portada personalizada), VD12 (vídeo e imagen en una fila), VD13 (transmisión en directo de YouTube con un chat en directo), VD14 (lista de reproducción de vídeo), VD16 (widget de vídeo), AB701 (título, descripción y vídeo), BF402N (vídeo o imagen y formulario en dos columnas), algunos bloques de galería y también bloques con una imagen a pantalla completa como fondo(más información sobre cómo añadir un vídeo como fondo).

Para añadir un vídeo, sólo necesitas un enlace a un vídeo que esté disponible públicamente y habilitado para su incrustación en sitios web de terceros en la configuración de privacidad.

Elige el bloque que más te guste, ve a su pestaña Contenido e inserta un enlace al vídeo.

Si desea que el vídeo se reproduzca a partir de un momento determinado, añada el fragmento ?start= a la URL y especifique el tiempo necesario en segundos desde el comienzo del vídeo. Por ejemplo, XEfDYMngJeE?start=5025. En este caso, el vídeo se reproducirá a partir del segundo 5025. Puede copiar rápidamente el tiempo haciendo clic con el botón derecho del ratón en el reproductor y seleccionando la opción "Copiar URL de vídeo a la hora actual".

Cómo añadir vídeos de Vimeo

Puedes añadir los vídeos de Vimeo utilizando los bloques VD01 (un vídeo), VD04 (visualización de un vídeo después de hacer clic en el botón Reproducir), VD06N (dos vídeos), VD08 (vídeo y texto), VD09 (vídeo emergente), VD11 (vídeo con una portada personalizada), VD12 (vídeo e imagen en una fila), VD14 (lista de reproducción de vídeo), VD16 (widget de vídeo), AB701 (título, descripción y vídeo), BF402N (vídeo o imagen y formulario en dos columnas), y algunos bloques de galería, y también bloques con una imagen a pantalla completa como fondo.

Si tu vídeo está bloqueado por la configuración de privacidad de Vimeo, tendrá una combinación adicional de números y letras al final del enlace después del ID del vídeo. Para que el vídeo se reproduzca, añade esta combinación al campo Vimeo Private Link Hash.

Cómo añadir vídeos desde un servidor de terceros (vídeo HTML5)

Si tu vídeo no está publicado en los servicios de alojamiento de vídeos mencionados, puedes subirlo a tu propio servidor e insertarlo utilizando los siguientes bloques de vídeo HTML5: VD01 (un vídeo), VD04 (muestra un vídeo después de pulsar el botón Reproducir), VD08 (vídeo y texto), VD09 (vídeo emergente), VD11 (vídeo con una portada personalizada), VD12 (vídeo e imagen en una fila), VD16 (widget de vídeo), AB701 (Título, descripción y vídeo), BF402N (Vídeo o imagen y formulario en dos columnas) y algunos bloques de galería. También puedes añadir un vídeo HTML5 como fondo en tu sitio web, utilizando bloques con fondo de pantalla completa(más información sobre cómo añadir un vídeo como fondo).

Para añadir un vídeo de este tipo a la página, es necesario utilizar archivos de vídeo WebM y MP4. Puedes convertir vídeos a estos formatos utilizando conversores online o software de edición o conversión de vídeo. A continuación, colócalo en el alojamiento y obtén un enlace directo al archivo. Ten en cuenta que lo más probable es que tengas que utilizar un servicio de alojamiento de archivos de pago, ya que no todos los servicios de almacenamiento de archivos disponen de esta función.

No puedes subir tu archivo de vídeo a Tilda , pero puedes utilizar servicios de terceros que proporcionan un enlace directo a un archivo.

Ve a la pestaña Contenido del bloque de vídeo HTML5 y añade el enlace a tus vídeos en ambos formatos en los campos obligatorios.

En algunos bloques, solo hay un campo para añadir un enlace a un vídeo HTML5. En este caso, solo puede utilizar un formato de archivo y es preferible MP4.

Tabla de compatibilidad con navegadores para vídeos MP4 → https://caniuse.com/mpeg4
Tabla de compatibilidad con navegadores para vídeos WebM → https://caniuse.com/webm

Cómo subir tu vídeo a un servidor de terceros

Para añadir un enlace directo a un archivo en un bloque de vídeo HTML5, tienes que subirlo a un servicio de almacenamiento de archivos. Las opciones de almacenamiento en la nube como Google Drive o Dropbox no son adecuadas para esto, ya que no proporcionan un enlace directo a un archivo.

Para esta tarea, es necesario utilizar servicios o proveedores de alojamiento que ofrezcan servicio de almacenamiento de archivos. Veamos el proceso de cómo subir un archivo y obtener un enlace directo al mismo utilizando el Selectel como ejemplo.

Cómo añadir vídeos de cinescopio

Puedes añadir los vídeos de Kinescope utilizando los bloques VD01 (un vídeo), VD04 (visualización de un vídeo después de hacer clic en el botón Reproducir), VD08 (vídeo y texto), VD09 (vídeo emergente), VD11 (vídeo con una portada personalizada), VD12 (vídeo e imagen en una fila), VD14 (lista de reproducción de vídeos), AB701 (título, descripción y vídeo), BF402N (vídeo o imagen y formulario en dos columnas), y también algunos bloques con una imagen a pantalla completa como fondo.

Para empezar a trabajar con Kinescope, tienes que registrarte en el sitio web https://www.kinescope.com/ o iniciar sesión en tu cuenta.

Haga clic en "Empezar gratis".

Para subir tu vídeo a Kinescope, haz clic en el botón Nuevo de la esquina superior derecha, selecciona "Subir un archivo" y añade un vídeo.

Para añadir el vídeo al sitio web, haga clic en el botón con tres puntos situado cerca del vídeo en el Catálogo → Copie el enlace → Pegue el enlace en la pestaña Contenido del bloque en Tilda.

Cómo añadir vídeo mediante iFrame

Puede añadir vídeos con iFrame utilizando los bloques VD01 (un vídeo), VD04 (visualización de un vídeo tras pulsar el botón Reproducir), VD08 (vídeo y texto), VD09 (vídeo emergente), VD11 (vídeo con una portada personalizada), VD12 (vídeo e imagen en una fila), VD14 (lista de reproducción de vídeos), AB701 (título, descripción y vídeo), BF402N (vídeo o imagen y formulario en dos columnas).

Esta opción permite añadir vídeos desde cualquier plataforma que proporcione código iframe para incrustar vídeo en un sitio web.

Con esta opción, los ajustes "Reproducción automática de vídeo" y "Vídeo con sonido silenciado" no funcionarán. Si la plataforma que aloja el vídeo lo permite, puedes insertar los parámetros Autoplay y Mute en el enlace.

Vídeos de fondo para portadas y otros bloques

Puedes utilizar vídeo para una portada u otros bloques con una imagen como fondo en lugar de una imagen de fondo estática. Ve a la pestaña Contenido y pega un enlace a tu vídeo en el campo obligatorio. Puedes utilizar un enlace de vídeo de YouTube o un enlace de vídeo HTML5 que hayas conseguido utilizando la guía anterior.

Un ejemplo de vídeo de fondo

Un bloque con una lista de reproducción de vídeo

El bloque de listas de reproducción se encuentra en la categoría "Vídeo" → bloque VD14.

Este bloque admite vídeos de los servicios YouTube, Vimeo y Kinescope. Para añadir un vídeo, debe especificar sus datos en el siguiente formato:
Enlace al vídeo; Título del vídeo; Duración del vídeo; Descripción del vídeo

Breve resumen para cada vídeo de la lista de reproducción debe especificarse desde una nueva línea.

Widget de vídeo

El widget de vídeo es un pequeño vídeo en la esquina de la pantalla que puede ayudarte a compartir la historia de tu producto o servicio. La vista previa se reproduce sin sonido y, si haces clic en ella, se carga el vídeo principal con sonido.

Para añadir el widget de vídeo, vaya a la categoría Vídeo y seleccione el bloque VD16.

Antes de añadirlo, debes preparar y optimizar tu vídeo para la web (utilizando software especial o editores en línea como Veed.io).

Después, sube el archivo a un servicio que proporcione almacenamiento de vídeo y acceso a él mediante un enlace directo.

No puedes subir tu archivo de vídeo a Tilda, pero puedes utilizar servicios de terceros.

La mejor opción es subir el archivo a tu hosting, como Selectel. Guía detallada →

Ve a la pestaña Contenido del bloque y pega el enlace al vídeo principal.

Puedes añadir opcionalmente la versión previa del vídeo. Puede ayudar a los usuarios a hacerse una idea introductoria del vídeo principal y reducir el tiempo de carga del sitio web.
El tamaño óptimo del vídeo es de 200px de ancho y hasta 5 segundos.

También puede especificar un enlace y un texto para el botón del vídeo principal si su objetivo es animar al visitante a realizar algún tipo de acción. Si no necesita un botón, deje los campos vacíos.

En la configuración del bloque, puedes ajustar los parámetros del widget, el vídeo principal que se abre y los botones. Para el widget, puede especificar la relación de aspecto, la anchura y los parámetros del borde, la posición en la pantalla y otros parámetros. Para el vídeo principal, puedes configurar los parámetros del borde, la sombra y el botón Reproducir. La anchura del vídeo es siempre fija - 560x315 para vídeos horizontales y viceversa - 315x560 para vídeos verticales.

Añadir un vídeo en Zero Block

Para añadir un vídeo en Zero Block → haz clic en el botón (+) y añade un elemento Vídeo → selecciona una de las opciones disponibles para añadir un vídeo: YouTube, Vimeo, MP4, Kinescope → pegue el enlace al vídeo o su ID.

Para añadir vídeos de otros servicios, puede utilizar la opción de incrustación de código HTML: Añade el elemento HTML → haz clic en el botón Editar código del panel de configuración → especifica el código para incrustar el reproductor. A continuación ↓ puedes encontrar ejemplos de cómo obtener el código.

Vídeo de un producto del Catálogo

En el Catálogo de productos, puede añadir un vídeo para mostrar el producto. Para ello, vaya a la ficha del producto → haga clic en el enlace "Vídeo" situado cerca de cualquier imagen del producto e inserte el enlace a un vídeo de YouTube, Vimeo o Kinescope o su ID.

Cómo añadir vídeos a los feeds

En Feeds, puedes añadir tanto el vídeo principal de la entrada (se mostrará al principio de la entrada y se utilizará como portada en la lista de entradas) como insertar varios vídeos en el texto de la entrada de Feeds.

Para añadir el vídeo principal, ve al campo con una imagen en la ficha de edición de entradas de Feeds → la pestaña "Vídeo", y pega el enlace al vídeo.

El vídeo aparecerá al principio de la entrada.

Para añadir un vídeo en el texto de la publicación, haz clic en el icono más a la izquierda → añadir un bloque Vídeo → haz clic en él y especifica el enlace al vídeo.

Haciendo clic en los tres puntos a la izquierda del bloque, puedes cambiar el vídeo.

El vídeo se insertará en el texto de la entrada. Guarde los cambios.

A continuación, el vídeo se mostrará en el texto de la página de la entrada.

Cómo añadir vídeos mediante código HTML

Puede añadir vídeos incrustando el código del reproductor en el bloque de código HTML. Para ello, ve a la configuración del reproductor o del servicio para obtener el código de incrustación.

Para Kinescope, haz clic en el botón con tres puntos situado cerca de un vídeo de la lista → Incrustar → selecciona código responsivo si necesitas ajustar el reproductor al tamaño de la pantalla o código fijo para añadir un reproductor pequeño y especifica su tamaño y posición en el código copiado → pega el código que has recibido en el bloque T123 de la categoría "Otros" o en el elemento HTML en Zero Block.