Introducción
Como bien sabrás en WordPress se pueden incrustar vídeos de forma tan sencilla como pegar la URL del vídeo de YouTube en tu entrada o página para que éste se muestre automáticamente.
En realidad además de vídeos de YouTube en WordPress puedes incrustar contenido automáticamente de todos estos servicios:
Problema
Al incrustar vídeos de cualquiera de los servicios indicados en la tabla anterior WordPress genera un iframe automáticamente en la entrada o página, pero éste no es sensible por lo que no en todos los temas se gestiona su tamaño de forma adecuada en todos los tamaños de dispositivos disponibles.
Incluso hemos llegado a ver vídeos incrustados con tamaños descomunales que sobresalen ampliamente de la capa que lo contiene en dispositivos que soportan más allá de los 1.000 píxeles, pantallas de ordenador, por ejemplo, por lo que te puedes imaginar cómo se veía semejante engendro en dispositivos móviles.
Solución
La solución a este problema pasa por incrustar un pequeño código PHP en el fichero functions.php de tu tema hijo que añadirá una nueva capa HTML previa al iframe. Esta simple función PHP es la que tienes que añadir:
Gracias a esta función PHP añadiremos la necesaria capa HTML tanto en los vídeos incrustados por el propio código nativo de WordPress como por el código del plugin para WordPress Jetpack by WordPress.com.
Para que el nuevo código HTML incrustado junto al iframe tenga el estilo deseado debemos añadir un pequeño código CSS que puedes incrustar en el fichero style.css de tu tema hijo o en las opciones de tema. El código CSS necesario para solucionar definitivamente el problema es:
Gracias a esta combinación de PHP y CSS daremos una solución definitiva a los iframe «insensibles» que no quieren respetar las medidas dadas por el diseño sensible de tu tema. Y no sólo los iframe, también mantendrá a raya a las etiquetas object, embed y video.
Esperamos que os resulte útil y funcional este pequeño truco que a buen seguro os sacará de más de un apuro en el futuro. ¿Nos lo cuentas?
Artículos relacionados
Comentarios
Productos y servicios
-
Soporte técnico
84,70 € -
Recupera la administración
Desde: 181,50 € -
WP Total Updater
Desde: 42,35 € / MES -
WC - APG ecoSoftWEB
-
ACF Starter Kit
60,50 €
No pinta mal la nueva gestión del catálogo que se quiere implementar en #WooCommerce .
Más información en https://developer.woocommerce.com/2026/05/21/reimagining-catalog-management/
Acaba de publicarse #WordPress 7.0: más visual, más rápido y preparado para la IA
Conectores IA integrados
Nuevas superposiciones de navegación
Patrones más fáciles de editar
Revisiones visuales bloque por bloque
Mejor rendimiento y accesibilidad
De momento lo dejamos en espera
A partir de #WooCommerce 10.9 se incluirá WooCommerce Additional Variation Images en el core lo que permitirá gestionar galerías en las variaciones de forma nativa.
Gran noticia que se suma a la iniciativa de incluir WooCommerce Brands en la versión 9.4.
¡Este es el camino!
¡Nuevo plugin para WooCommerce totalmente gratuito!
Ya es oficial nuestro nuevo plugin para #WooCommerce 100% gratuito: Recuerda que la Directiva Omnibus es de obligado cumplimiento a partir del 19 de junio.
¡Disfrútalo!
Gracias por compartir esta solución. Un saludo.