Para insertar un vídeo de YouTube, pega el código de inserción en un bloque HTML de tu web. Abre el vídeo en tu ordenador y selecciona Compartir y, después, Insertar. Copia allí el código completo. En WordPress, normalmente puedes pegar el enlace de vídeo normal en un bloque de YouTube. Así, los visitantes podrán ver el vídeo en tu página.
A continuación, descubrirás qué método se adapta a tu web y cómo probar el vídeo en tu teléfono.
Usar un enlace de YouTube o un código de inserción
Insertar también se denomina embeber. De este modo, colocas un reproductor de vídeo en tu página, mientras el vídeo sigue alojado en YouTube. Por tanto, no tienes que subir el archivo de vídeo a tu web.
Un enlace normal dirige al visitante al vídeo. Con un código de inserción, muestras el reproductor en tu propia página. Algunos creadores de webs convierten automáticamente un enlace de vídeo normal en un reproductor.
| ¿Qué quieres hacer? | ¿Qué utilizas? |
|---|---|
| Colocar un enlace en el que se pueda hacer clic al vídeo | El enlace de vídeo normal |
| Añadir un vídeo mediante un bloque de vídeo | Normalmente, el enlace de vídeo normal |
| Colocar tú mismo el reproductor en HTML | El código de inserción con un iframe |
Un iframe es una ventana que muestra contenido de otra web. En este caso, se trata del reproductor de vídeo de YouTube. HTML es el código con el que colocas contenido en una página web.
Insertar el código de YouTube
Abre el vídeo en un ordenador. Así podrás copiar el código y probarlo directamente en tu web.
- Comprueba el vídeo. Mira el título y reproduce un fragmento.
- En Compartir, selecciona Insertar. Copia el código completo.
- Abre el editor de tu web. Ve a la página en la que quieres colocar el vídeo.
- Añade un bloque HTML o de código personalizado. Pega ahí el código de inserción, no en un cuadro de texto normal.
- Mira la vista previa de tu página. ¿Ves el reproductor? Prueba también el botón de reproducción.
Los botones y las pantallas pueden cambiar. ¿No ves la opción Insertar? Compara entonces tu pantalla con la explicación oficial de YouTube sobre la inserción.
¿Tu creador de webs solo solicita una URL de vídeo, es decir, una dirección web? Usa entonces el enlace de vídeo normal. Ese campo no admite código HTML.
Insertar un vídeo de YouTube en WordPress
¿Trabajas con bloques en WordPress? En ese caso, un bloque de YouTube suele ser la opción más sencilla. Si quieres modificar tú mismo el código de inserción, utiliza un bloque de HTML personalizado.
Con un bloque de YouTube
- Abre tu entrada o página en el editor.
- Añade un bloque y busca YouTube.
- Pega el enlace de vídeo normal en el campo.
- Confirma la entrada y mira la vista previa de tu página.
¿Usas otro editor o un creador de páginas independiente? Busca entonces un bloque de vídeo. El nombre y la ubicación pueden variar según la web.
Con un bloque de HTML personalizado
Añade un bloque de HTML personalizado y pega en él el código de inserción completo. Después puedes modificar el código, por ejemplo, para mostrar correctamente el reproductor en un teléfono. Más adelante encontrarás un ejemplo.
¿Desaparece el código después de guardar? Pregunta al administrador de tu web si tu cuenta permite colocar código iframe y si la web admite ese código.
Insertar un vídeo de YouTube con el modo de privacidad
Para el modo de privacidad, utiliza el dominio www.youtube-nocookie.com en el código de inserción. Ya aparece en el ejemplo de código de abajo.
Este modo no garantiza que el vídeo funcione completamente sin cookies. Además, tu web no cumple automáticamente todas las normas de privacidad por utilizarlo. También influye cuándo cargas el reproductor.
Según la explicación belga sobre cookies y consentimiento para las cookies y los rastreadores que no son estrictamente necesarios, normalmente se necesita consentimiento previo. Los visitantes deben saber para qué dan su consentimiento y elegirlo activamente.
¿Tu web debe solicitar consentimiento antes de cargar el reproductor? Configúrala para que el iframe solo se cargue después de obtenerlo. Un aviso de cookies situado sobre un reproductor que ya se ha cargado no impide que funcione.
Primero puedes mostrar un espacio de vídeo vacío con una explicación, como: “Este vídeo se carga mediante YouTube”. Pide al administrador de tu web que compruebe que el reproductor realmente se carga solo después de obtener el consentimiento. El código de ejemplo de abajo no lo configura.
Adaptar el vídeo de YouTube insertado al móvil
Un reproductor con una anchura fija puede salirse de la página en un teléfono. Con este código de ejemplo, el reproductor tendrá la misma anchura que el espacio en el que lo coloques.
<div style="width:100%; aspect-ratio:16/9;">
<iframe
src="https://www.youtube-nocookie.com/embed/VIDEO_ID"
title="Uitleg over het verzorgen van kamerplanten"
style="width:100%; height:100%; border:0; display:block;"
allowfullscreen>
</iframe>
</div>Sustituye VIDEO_ID por el código de tu vídeo. Lo encontrarás en el código de inserción copiado, justo después de /embed/ y antes de un posible signo de interrogación. Cambia también el texto de title por una breve descripción de tu vídeo.
La proporción 16/9 te proporciona un espacio de vídeo apaisado. Para un vídeo vertical, puedes utilizar, por ejemplo, 9/16 Comprueba después que el espacio no sea innecesariamente grande en una pantalla ancha.
A continuación, prueba la página en tu teléfono:
- Comprueba que el vídeo quepa en la página sin tener que desplazarte lateralmente.
- Prueba el botón de reproducción y el botón de pantalla completa.
- Comprueba que ningún aviso de cookies u otra ventana cubra los botones.
Establecer una hora de inicio para tu vídeo de YouTube insertado
¿Quieres omitir el principio de un vídeo? Añade start a la dirección en src, con la hora de inicio en segundos. Así eliges dónde empieza el vídeo. No haces que se reproduzca automáticamente.
Un ejemplo ficticio: la explicación que quieres mostrar empieza después de 1 minuto y 30 segundos. Lo conviertes así: 1 × 60 + 30 = 90 segundos.
src="https://www.youtube-nocookie.com/embed/VIDEO_ID?start=90"¿Ya hay un signo de interrogación con una configuración después de la dirección? No utilices un segundo signo de interrogación. Añade en tu código HTML &start=90 después de la configuración existente.
Guarda la página y comprueba dónde empieza el vídeo. ¿Quieres que el vídeo vuelva a reproducirse al terminar? Lee cómo repetir un vídeo de YouTube.
Hacer accesible tu vídeo de YouTube insertado
Incluye también en texto de tu página la información importante del vídeo. Así, los visitantes podrán leerla si no oyen el sonido o no pueden utilizar el reproductor.
- Ponle un título claro al iframe. Escribe en
titlepor ejemplo, “Explicación sobre el cuidado de las plantas de interior” en lugar de “Vídeo”. De este modo, las herramientas pueden indicar qué contiene la ventana. - Prueba los subtítulos si están disponibles. Actívalos y presta atención a los nombres, los números y las palabras reconocidas incorrectamente.
- Escribe la explicación más importante. En un vídeo instructivo, puedes indicar brevemente los pasos en la página.
- Prueba sin ratón. Utiliza la tecla Tabulador. Comprueba que llegas al reproductor y puedes ver qué botón has seleccionado.
Es preferible que los visitantes pulsen el botón de reproducción por sí mismos. Así no empieza a sonar nada mientras todavía están leyendo.
Tu vídeo de YouTube insertado no funciona
Primero abre el vídeo en YouTube. ¿Tampoco funciona allí? Comprueba primero el propio vídeo. Si allí sí se reproduce, revisa el código y la configuración de tu web.
| ¿Qué ves? | ¿Qué puedes hacer? |
|---|---|
| El código aparece como texto en la página | Pega el código en un bloque HTML, no en un bloque de texto. |
| Solo ves un enlace en el que se puede hacer clic | Utiliza un bloque de vídeo o coloca el código de inserción en un bloque HTML. |
| El reproductor muestra un mensaje de error | Lee el mensaje. Comprueba también que el código completo del vídeo, el ID del vídeo, aparezca en el código de inserción. |
| No se puede reproducir el vídeo en tu web | Pregunta al propietario si se permite la inserción. No puedes solucionarlo con la configuración normal del reproductor. |
| El espacio de vídeo permanece vacío | Comprueba si todavía tienes que dar consentimiento para cargar el reproductor. Prueba también con otro navegador. |
| El reproductor desaparece después de guardar | Pregunta al administrador o al editor si la seguridad elimina el código iframe. |
| El vídeo es demasiado ancho en tu teléfono | Utiliza un código que siga la anchura de la página. Comprueba también la anchura del espacio que rodea el reproductor. |
¿Quieres eliminar un vídeo propio? Comprueba primero en qué páginas lo has insertado. Lee cómo eliminar un vídeo de YouTube y después modifica también las referencias en tu web.
Comprueba la página antes de publicarla
Mira también la página cuando hayas cerrado sesión, preferiblemente en una ventana privada. Así no solo verás lo que ve un administrador con la sesión iniciada.
Comprueba que ves el vídeo correcto y que la hora de inicio es la adecuada. Prueba la visualización en tu teléfono y cualquier consentimiento necesario. Por último, reproduce un fragmento y comprueba el sonido.
¿Quieres publicar primero tus propios vídeos para utilizarlos después en tu web? Lee cómo crear un canal de YouTube.
