Comment adapter l'image à la taille normale sur mobile dans WordPress ?

wordpress
CN
Par Seb, spécialiste de la thématique Wordpress

Installation du thème réactif

Aujourd'hui, la plupart des thèmes WordPress sont réactifs, ce qui signifie qu'ils s'adaptent automatiquement à la taille de l'écran de l'appareil sur lequel votre site est consulté. Si ce n'est pas le cas de votre thème actuel :

  1. Accédez à votre tableau de bord WordPress
  2. Cliquez sur 'Apparence' puis 'Thèmes'
  3. Cliquez sur 'Ajouter Nouveau' et recherchez des thèmes responsifs

Utilisation des images adaptatives

WordPress crée automatiquement plusieurs tailles d'une image lorsque vous la téléchargez. Vous pouvez modifier ces tailles d'image dans 'Réglages' > 'Media'. Essayez d'utiliser des images adaptatives - c'est-à-dire des images qui changeront de taille en fonction de l'écran de l'appareil.

Utilisation du plugin WPtouch

WPtouch est un plugin mobile pour WordPress qui génère automatiquement un thème simple et élégant pour les visiteurs mobiles de votre site. Il vous permettra d'adapter automatiquement la taille des images pour les appareils mobiles.

Modification du CSS

Dans certains cas, vous devrez peut-être modifier directement le fichier CSS de votre thème WordPress. Vous pouvez utiliser le code CSS suivant pour adapter automatiquement la taille des images :

img {
  max-width: 100%;
  height: auto;
}

Ajoutez ce code dans le fichier CSS en vous rendant à 'Apparence' > 'Personnaliser' > 'CSS additionnel'.

N'oubliez pas de sauvegarder toutes les modifications que vous faites. Testez votre site sur différents appareils pour vous assurer que les images s'affichent correctement.

Autres articles sur la thématique Wordpress