Cómo Incrustar un YouTube Short: Guía Rápida

August 1, 2024
Ben Russell
Founder

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:

  • Tendrás logotipos de YouTube por todo tu sitio web, lo que puede no coincidir con tu marca.
  • Los Shorts podrían llevar a sugerencias de contenido completamente irrelevantes para tu empresa.
  • Reproducir un nuevo video no detiene el video que ya está en reproducción.
  • Puede ralentizar tu sitio.
  • No hay vistas previas con reproducción automática para aumentar el engagement.

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.

Crea experiencias de video sin interrupciones y sin código con Clipara

Empieza a usar Clipara gratis y crea experiencias de video que deleiten a tus clientes.

Comenzia gratis

Si 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.

Cómo obtener el código de incrustación para YouTube Shorts

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>

Incrustación Vertical de YouTube Short

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.


Copiar el código de video de la URL desde el final de la direcció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:

Cómo hacer que la incrustación de YouTube Short sea responsive

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:

Cómo crear tu incrustación personalizada con Clipara

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

Involucra y deleita a los clientes con experiencias de video épicas

Empieza a usar Clipara gratis y dale vida a tu sitio sin ralentizarlo.

Comienza gratis