Ahora a todo el mundo le encanta el video en formato corto enfocado en móviles. Y YouTube es obviamente un excelente lugar para publicar tu contenido y obtener vistas e interacción. Puede que decidas llevar tus YouTube Shorts a tu sitio web. Lo genial de los videos cortos es que son rápidos y directos, por lo que puedes juntar varios videos diferentes.
Sin embargo, hacer eso con Shorts no es tan simple. Hay algunos problemas:
Puedes solucionar todo esto usando un software especializado en la incrustación de videos, como Clipara. Especialmente diseñado para contenido en formato corto.
Puedes crear carruseles, cuadrículas o incrustar videos individuales con tu propio estilo personalizado, experiencias a pantalla completa para móviles (como si estuvieras en una app), transiciones suaves entre videos y mucho más. Además, es increíblemente fácil de usar y cubre todos los aspectos para que los videos sean responsivos en todos los dispositivos, con reproducción automática, sin sonido, etc.
Con esto, puedes crear fácilmente carruseles que se abren en un reproductor de pantalla completa como este:
o experiencias que se reproducen en línea como esta:
Todo esto es completamente personalizable sin necesidad de código y ofrece muchas otras opciones de diseño y personalización. El resultado final es algo mucho más profesional que incrustar varios YouTube Shorts.
Empieza a usar Clipara gratis y crea experiencias de video que deleiten a tus clientes.
Comenzia gratisSi solo quieres obtener el código de incrustación para YouTube Shorts y colocarlo directamente en tu sitio, dejándolo como una incrustación de YouTube, puedes hacerlo siguiendo estos sencillos pasos a continuación.
El código de incrustación para un YouTube Short es bastante fácil de encontrar. En YouTube, solo tienes que hacer clic derecho en el video de Shorts y seleccionar ‘Copiar código de inserción’. Luego, puedes pegarlo en la funcionalidad de incrustación de tu sitio.
Clicking copy will give you a piece of code like so:
<iframe width="379" height="674"
src="https://www.youtube.com/embed/CjO9JVlbQSM"
title="Olivia Dean - felt like a fluffy dream !!! #shorts"
frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen>
</iframe>
Aunque el estilo de incrustación es vertical, una cosa que notarás sobre el código de incrustación mencionado anteriormente es que tiene un tamaño fijo. La incrustación tiene un ancho fijo de 379 px y una altura de 674 px. Puedes cambiar esos dos números para reducir el tamaño del video. Este tamaño fijo en particular puede ser un poco grande para algunos dispositivos móviles.
Si ya tienes el código de incrustación de YouTube, también puedes tomar el ID del video del final de la URL en la barra de direcciones y reemplazarlo en el código de incrustación.
También es posible que desees hacer que la incrustación sea responsive. Esto significa que se adaptará al tamaño de la pantalla y llenará el espacio en el que se encuentra. Esto te da mucho más control sobre el tamaño de la incrustación al integrarla en creadores de sitios web como Wordpress, Squarespace, Wix, Framer y otros. A continuación, te ofrecemos una guía adicional para lograrlo:
Para que tu código de incrustación de YouTube sea responsive y se ajuste al espacio en el que se coloca, necesitarás agregar un poco de código de estilo adicional. El código a continuación es importante para mantener la dimensión 9:16 de un YouTube Short. Otros códigos de incrustación responsive utilizan las dimensiones estándar de 16:9. Simplemente toma este código y reemplaza el título del video y el ID del video de YouTube después de /embed
en la URL de YouTube:
<style>
.video-wrapper {
position: relative;
width: 100%;
/* The padding-top percentage is calculated as (height / width) * 100% for a 9:16 ratio */
padding-top: 177.77%; /* (16/9) * 100 */
}
.video-wrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
<div class="video-wrapper">
<iframe src="https://www.youtube.com/embed/CjO9JVlbQSM" title="Olivia Dean - felt like a fluffy dream !!! #shorts" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
En resumen, agregarlo a tu sitio es bastante rápido, pero simplemente usar la incrustación de YouTube no ofrece una gran experiencia para tus clientes. Así que prueba Clipara con una cuenta gratuita y crea una experiencia mucho mejor para tus usuarios. Puedes crear una cuenta gratuita aquí: https://dashboard.getclipara.com/signup.
A continuación, te ofrecemos una guía sobre cómo crear e instalar un carrusel responsive simple con Clipara de forma gratuita:
Sigue los pasos a continuación para crear rápidamente un carrusel de videos personalizado para tu sitio web utilizando YouTube Shorts.
Haz clic en "Create Campaign" desde la página de inicio de Clipara:
Selecciona el tipo de campaña "On-site"
Elige el estilo de reproductor "In-Line". La opción "Full screen" abrirá un reproductor a pantalla completa en móviles y escritorios, en lugar de reproducir en línea en la página
Haz clic en "Add Video" para añadir nuevo contenido
Cambia a YouTube para agregar tu contenido de YouTube. Pega el enlace del YouTube Short que deseas añadir, luego haz clic en "Upload".
Una vez cargado, puedes renombrar el video desde la URL de YouTube. Cuando termines, simplemente haz clic en "Continue":
Selecciona todos los videos que te gustaría incluir en tu carrusel. En la izquierda, arrástralos para reorganizarlos si lo deseas. Una vez seleccionados, haz clic en "Create Campaign" en la parte superior izquierda:
Selecciona la opción para crear un nuevo widget. Los widgets son diseños que se pueden reutilizar en múltiples campañas una vez que los hayas diseñado:
Selecciona "Carousel". Este es el único estilo de diseño para campañas "In-line", pero para campañas que se abren a pantalla completa, puedes usar cuadrículas, carruseles, historias, pop-ups y crear tus propias incrustaciones personalizadas:
Ahora puedes editar tu carrusel para que luzca exactamente como lo deseas usando el panel de diseño en el lado izquierdo
Una vez que hayas completado todas tus personalizaciones, haz clic en "Install" en la parte superior derecha:
Obtendrás el código para instalar en tu sitio. Simplemente copia y pégalo en tu creador de sitios web:
Ahora tendrás un carrusel de video elegante tanto en escritorio como en móvil, justo como este:
Puedes empezar a usar Clipara de forma gratuita aquí:
https://dashboard.getclipara.com/signup
Empieza a usar Clipara gratis y dale vida a tu sitio sin ralentizarlo.
Comienza gratis