Comment rendre les images responsives ?

Avec l’arrivée des smartphones et des tablettes sont arrivés les thèmes responsive design (qui s’adaptent à la taille de votre écran), et avec ceux-ci sont arrivés différents problèmes d’ergonomies comme les images qui restent à leur taille originale et ne s’adaptent pas au design dans vos billets.

Comment faire pour que les images sur WordPress soient Responsive dans un article ?

Si vous voulez que vos images changent de taille en fonction de l’écran de votre lecteur et en fonction de votre thème, le procédé est assez simple ! En effet WordPress définit par défaut des tailles types pour chacune des versions de votre image ( par défaut : taille vignette, taille moyenne et grande taille. )

Pour rendre les images réponsives il suffit donc de supprimer la fonction qui génère ces tailles afin de laisser les images s’adapter elles-même à la taille de votre écran :

Ajoutez cette fonction à votre fichier functions.php

function responsive_images( $html ) { $html = preg_replace( '/(width|height)="\d*"\s/', "", $html ); return $html; }
 add_filter( 'post_thumbnail_html', 'bbx_images', 10 );
 add_filter( 'image_send_to_editor', 'bbx_images', 10 );
 add_filter( 'wp_get_attachment_link', 'bbx_images', 10 );