Iframe responsive (YouTube, Google Maps y otros)
El iframe copiado de YouTube o de Google Maps viene con ancho fijo y se sale de la pantalla del celular. Pégalo aquí y copia la versión que se ajusta.
Cómo usarVideo y mapa que caben en el celular
Disponible en: 
Iframe responsive (YouTube, Google Maps y otros): para qué sirve
El código de inserción de YouTube y de Google Maps viene con ancho y alto fijos y se sale de la pantalla del celular. Pega el iframe o solo la dirección y recibe la versión que ocupa el 100% del ancho y mantiene la proporción con aspect-ratio.
La herramienta reconoce YouTube (incluidos los Shorts en 9:16), Google Maps, Vimeo, Spotify, Instagram, Canva y Google Forms, sugiere la proporción o la altura correcta, agrega loading=lazy, un title para lectores de pantalla y pantalla completa, y muestra la vista previa que puedes estrechar para ver cómo queda en el celular.
Cómo usar
- Pega el iframe o la dirección.
- Revisa la proporción y el title.
- Copia el código al sitio.
Cuándo usar
- Video de YouTube en la página de inicio.
- Mapa de Google en la página de contacto.
- Reproductor de Spotify o formulario incrustado.
Preguntas frecuentes
¿Por qué el iframe se sale de la pantalla en el celular?
El código de inserción viene con width y height fijos, como 560 por 315. En un celular de 360 px de ancho, el video queda más grande que la pantalla. El código generado aquí usa ancho de 100% y la propiedad aspect-ratio, que mantiene la proporción en cualquier pantalla.
¿Qué hace loading=lazy?
El navegador solo carga el iframe cuando está cerca de aparecer en pantalla. Como los videos y mapas pesan bastante, esto hace que la carga de la página sea mucho más rápida cuando están más abajo.
¿Para qué sirve el title en el iframe?
Los lectores de pantalla anuncian el title para decir qué hay dentro del iframe, como 'Video: cómo llegar a la tienda'. Sin él, la persona solo oye 'marco' y no sabe de qué se trata.
¿Es gratis de verdad?
Sí, 100% gratis. Sin registro, sin suscripción y sin límite de uso. Todas las herramientas de Tools123 son gratuitas.