Limpiar código de las imágenes subidas en WordPress

Cuando subimos una imagen a WordPress para incluirla en una entrada o página el código insertado en la entrada tiene elementos innecesarios, normalmente ya cubiertos por el CSS, propio de WordPress o del mismo tema que usemos.

Por supuesto, podemos modificar este código posteriormente, eliminando lo que sobra, pero si por eso fuera no escribiríamos, estaríamos todo el día corrigiendo errores tontos del software que usamos, en este caso WordPress.

De lo que estoy hablando es de que cuando subes una imagen y la insertas desde WordPress lo que obtienes es un código más o menos así:

<a href="http://misitio.com/wp-content/uploads/2012/10/imagenchula.png"><img src="http://misitio.com/wp-content/uploads/2012/10/imagenchula-550x820.jpg" alt="" width="550" height="820" class="alignnone size-large wp-image-29105" /></a>

Igual no lo sabes pero sobran algunas «tags«, pues parte del código de la imagen es en realidad innecesario, especialmente el que define el ancho y alto de la imagen, ya que también lo está gestionando la clase CSS «alignnone« que incluye WordPress automáticamente, pues determina las dimensiones de la imagen.

Dicho esto, si limpiamos manualmente un poco el código, valdría exactamente igual de este modo (de hecho es mejor):

<a href="http://misitio.com/wp-content/uploads/2012/10/imagenchula.png"><img src="http://misitio.com/wp-content/uploads/2012/10/imagenchula-550x820.jpg" alt="esto es mi imagen chula" class="alignnone size-large wp-image-29105" /></a>

Pero como ya he dicho antes, se supone que usamos WordPress para escribir cosas y compartirlas, no para dedicarle más tiempo al código que a la propia redacción de contenidos ¿no?.

Pues entonces, si te parece, podemos evitarnos esa tarea y automatizar la «limpieza» de código innecesario en nuestro WordPress, simplemente añadiendo unas líneas a nuestro plugin de funciones o al archivo functions.php del tema que tengamos activo, estas:

//Eliminar tags inútiles de ancho/alto a imágenes subidas
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;
}

Cuando guardemos los cambios, a partir de ese momento se eliminarán los elementos de ancho y alto de las imágenes que subas para incluirlas en entrada y páginas, pero también para las que hayas definido como miniaturas en tus entradas, y también en las imágenes destacadas.

Fácil y, sobre todo, barato.

¿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 :)