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.

VALORA Y COMPARTE ESTE ARTÍCULO PARA MEJORAR LA CALIDAD DEL BLOG…
(0 votos, promedio: 0)

¿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.

3 comentarios en “Limpiar código de las imágenes subidas en WordPress”

  1. Hola, si es cierto que se genera mucha guarrería de código en las imágenes… pero mi duda es ¿cómo haces para colocar esas imágenes (el código que has puesto en imágenes con scroll horizontal que al pulsar sobre ellas puedes interactuar para desplazarte por la imagen) de esa forma? Gracias Fernando

  2. Hablando de imágenes, Fernando, ¿no existe algún método confiable para eliminar todas las miniaturas creadas por wordpress, para luego eventualmente volver a crear las que vamos a utilizar con nuestra plantilla actual?

  3. Hola. Viendo esta nota me hace preguntar si esta solucion tambien puede eliminar la ruta absoluta y convertirla en una relativa. Es decir, cambiar el img src=»http://MIDIMINIO/wp-content/etcetc» por img src=»../wpcontent/etcetc»

Deja un comentario

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

 

Ir arriba Ir al contenido