Oferta SiteGround Black Friday

Quitar atributos de ancho y alto a las imágenes

wordpress responsive

Si hace poco que te has cambiado a un tema adaptable (responsive) seguramente ya te habrás percatado que las imágenes no se muestran como debieran en según qué dispositivos.

Esto normalmente es debido a que al no usar antes un tema adaptable aplicabas atributos fijos de ancho y alto a las imágenes, para que se adaptaran a las cajas de contenido de tu tema previo, y ahora, a pesar del diseño adaptable del nuevo tema, las imágenes no se adaptan como debieran.

O sea, que tus imágenes están insertadas de este modo:

<img src="ruta/a/tu/imagen" width="550" height="815" class="align center size-full" alt="" title="">

Afortunadamente no hay que andar modificando cada imagen insertada, ni siquiera necesitas instalar plugin alguno, solo tienes que añadir el siguiente código a tu plugin personal o al archivo functions.php del tema activo:

//Quitar atributos de ancho y alto para temas "responsive"
add_filter( 'post_thumbnail_html', 'remove_width_attribute', 10 );
add_filter( 'image_send_to_editor', 'remove_width_attribute', 10 );
function remove_width_attribute( $html ) {
   $html = preg_replace( '/(width|height)="\d*"\s/', "", $html );
   return $html;
}

Guardas los cambios y ya está, todo limpito. Para las nuevas imágenes nada mejor que este otro truco para quitar los atributos de ancho y alto del cargador de imágenes.

Visto en CSS tricks

¿De cuánta utilidad te ha parecido este contenido?

¡Haz clic en los emoticonos para valorarlo!

Promedio de puntuación 5 / 5. Total de votos: 4

Hasta ahora ¡no hay votos!. Sé el primero en valorar este contenido.

Ya que has encontrado útil este contenido...

¡Sígueme en las redes sociales!

¡Siento que este contenido no te haya sido útil!

¡Ayúdame a mejorar este contenido!

Por favor, dime, ¿cómo puedo mejorarlo?

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

AVISO: Esta publicación es de hace 3 años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado. ¡Ah! ¿te funciona? pues entonces no he dicho nada :)

Sobre el autor

2 comentarios en “Quitar atributos de ancho y alto a las imágenes”

  1. Xavier Ocampos

    Luis, de hecho es mejor hacerlo. Si a las imágenes no se les aplica un ancho y alto por defecto se toman las medidas que tenga la imagen, de forma que no es necesario complicarse para formatear el ancho/alto por CSS, tan solo declarar que el ancho máximo de la imagen debe ser el 100% y dejar el alto en «auto» para que en caso de que tu diseño sea responsive y su panel contenedor se reduzca la imagen se reduzca con el mismo.

    Claro, también encontraras quien te diga que lo ideal es declarar un ancho/alto fijo a las imágenes por motivos de posicionamiento, y aunque es cierto que Google da preferencia a las imágenes que tienen sus medidas declaradas por HTML esto es más bien un error por parte de Google ya que estando en la época de los diseños Responsive no tiene ningún sentido que se sigan llevando a cabo estas medidas.

    Pero bueno, también se agradece el truco que nos propones, viene siendo lo mismo pero complicándose un poco más en el formateo.

    Saludos!

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Información base sobre privacidad:
- Responsable: Fernando Tellado ([email protected])
- Fin del tratamiento: Moderación de comentarios para evitar spam
- Legitimación: Tu consentimiento
- Comunicación de los datos: No se comunicarán los datos a terceros salvo por obligación legal
- Derechos: Acceso, rectificación, portabilidad, olvido

 

Scroll al inicio