Comment Ajouter des Images dans WordPress en 2022UN tutoriel sur l’Ajout d’Images dans les éditeurs Classic et Gutenberg (+ Réduction de la Taille du fichier)

Aujourd’hui, nous décomposons comment ajouter des images dans WordPress et réduire leur taille de fichier (pour que vos pages & publications se chargent le plus rapidement possible).

Lorsque vous apprenez les bases de la création d’un blog, il y a beaucoup à comprendre, je comprends. Nous avons parlé de la façon de changer la taille de la police, de changer la couleur de la police, de créer un lien cliquable et bien plus encore ici.

La bonne nouvelle est qu’en 2022, il est très facile d’apprendre à ajouter des images dans WordPress avec toutes les mises à jour et améliorations de convivialité qu’ils ont vues au cours de la dernière décennie.

Dans ce rapide tutoriel, je vais vous montrer comment ajouter des images dans les publications WordPress, à la fois dans l’éditeur classique (que je préfère utiliser) et via leur nouvel éditeur Gutenberg.

Maintenant, plongeons-nous dans l’ajout d’images à vos publications WordPress — tout en réduisant au maximum la taille de leurs fichiers, pour rester en ligne avec les meilleures pratiques de référencement et pour que vos pages se chargent le plus rapidement possible.

Comment Ajouter des images WordPress (et Réduire la Taille du fichier) dans 2022

1. Ajout d’Images à des Publications dans l’Éditeur WordPress Classique
2. Ajout d’Images à des Publications dans l’Éditeur WordPress Gutenberg
3. Ajout d’une Image en vedette à une publication dans WordPress

Maintenant rapidement, avant de plonger dans ce tutoriel sur l’ajout d’images à WordPress, je vais vous montrer comment réduire la taille du fichier d’une image (en aidant vos publications à se charger plus rapidement) en 2 étapes faciles.

Installez le plugin (gratuit) Compresser les images JPEG & PNG par Tiny PNG

Vous pouvez télécharger le plugin d’images PNG Compress JPEG & gratuit pour WordPress ici à partir de la bibliothèque de plugins WordPress.

Alternativement, vous pouvez également rechercher le plugin et l’installer directement dans le menu de votre plugin, accessible sur le côté gauche de la section d’administration de votre blog ici – ou consultez ce tutoriel rapide sur l’installation d’un plugin WordPress:

Une fois que vous avez installé le plugin Compress JPEG & Images PNG, chaque nouvelle image que vous téléchargez sur votre blog WordPress sera automatiquement optimisée et la taille du fichier réduite autant que possible sans compromettre la qualité de votre image.

Remarque: C’est de loin le meilleur plugin de compression d’image sur le marché. Il permet jusqu’à 500 compressions d’images gratuites par mois (ce qui est beaucoup plus que ce dont vous aurez probablement besoin) avant de passer à un forfait payant à $.009 / image au-delà de vos 500 premiers chaque mois. C’est une bonne affaire et vous ne trouverez pas un meilleur plugin de compression qui vous donne plus de crédits gratuits.

Cependant, si vous souhaitez effectuer une compression d’image directement sur votre propre ordinateur (illimitée gratuitement), je recommande l’application ImageOptim.

Téléchargez vos Images

C’est tout! Sérieusement, c’est aussi simple que ça.

Une fois que vous avez installé le plugin de compression sur votre blog — ou que vous avez d’abord compressé des images individuelles sur votre ordinateur — vous êtes prêt à les télécharger sur vos publications ou pages dans WordPress.

Maintenant, examinons exactement comment ajouter des images à WordPress.

1. Ajout d’images aux publications dans l’Éditeur WordPress classique

Si vous êtes comme moi et préférez toujours la disposition classique de l’éditeur WordPress pour ajouter / modifier vos publications, suivez-le ici.

D’un autre côté, si vous utilisez le nouvel éditeur Gutenberg pour le contenu de votre publication, passez à la section suivante pour cette procédure pas à pas. Si vous ne savez pas quel éditeur vous utilisez, jetez un coup d’œil aux captures d’écran ci-dessous et comparez-les à l’apparence de votre éditeur. Vous voulez utiliser l’éditeur classique, mais vous ne savez pas comment l’obtenir? Prenez 2 minutes pour suivre le tutoriel simple de Yoast sur l’installation de l’éditeur classique sur votre blog WordPress.

1. Ouvrez le Message auquel vous ajoutez des Images (et trouvez le bon endroit)

Tout d’abord, vous devez vous assurer que vous êtes à l’intérieur du Message auquel vous souhaitez ajouter une image.

Ensuite, vous voudrez naviguer votre curseur à l’endroit exact dans votre publication où vous souhaitez ajouter l’image.

2. Cliquez sur le bouton « Ajouter un média » en haut de votre éditeur

Ce bouton ressemblera à ceci ici:

Une fois que vous avez cliqué sur le bouton « Ajouter un média », vous verrez l’écran où vous pouvez télécharger votre fichier image.

3. Cliquez sur « Télécharger des fichiers »

Cliquez sur l’onglet « Télécharger des fichiers » et vous serez redirigé vers l’écran où vous pouvez utiliser l’outil de sélection pour choisir un fichier image à partir duquel il se trouve sur votre ordinateur.

Sinon, si vous faites glisser un fichier image de votre bureau et le téléchargez, vous pouvez ignorer l’écran « Télécharger des fichiers » et passer directement à glisser l’image et à la déposer (il y a une démonstration de cela à l’étape suivante).

4. Téléchargez votre fichier Image

Je préfère faire glisser des fichiers image de mon bureau et les déposer dans le téléchargeur de fichiers (plutôt que d’utiliser le sélecteur pour les localiser sur mon ordinateur), car c’est beaucoup plus rapide.

Voici une démonstration vidéo / GIF rapide de la façon d’ajouter une image de votre bureau dans WordPress:

Une fois que vous avez téléchargé votre image, le plugin de compression fonctionnera comme par magie pour aider à réduire la taille du fichier (en coulisses).

Remarque: Avant de terminer vos options d’image et de cliquer sur « Insérer dans la publication », vous voudrez écrire un texte alternatif convivial pour le référencement de votre image — quelque chose qui décrit la nature de ce qui se passe dans votre image, et idéalement le tissage dans l’un des mots clés cibles que vous espérez que l’article finira par se classer (dans les résultats de recherche organiques).

5. Sélectionnez vos Options d’image et cliquez sur « Insérer dans la publication »

Enfin, vous aurez quelques options à définir pour votre image. Cela comprend:

• Contrôler l’alignement de la façon dont votre image apparaît dans votre publication (je sélectionne toujours l’alignement central)
• Créer un lien entre votre image et une autre page ou publication sur votre blog (ou un lien externe vers lequel vous souhaitez diriger les lecteurs)
• Taille d’affichage (Je recommande toujours de télécharger en taille réelle pour éviter une perte de qualité d’image)

Après avoir sélectionné ces options, vous êtes prêt à cliquer sur « Insérer dans la publication » et vous êtes prêt à partir!

Ce bouton sera juste ici dans le coin inférieur droit de votre écran:

Maintenant, vous serez ramené à votre fenêtre d’éditeur et vous verrez l’image que vous venez d’ajouter assise là où vous l’avez téléchargée.

Gardez à l’esprit que vous avez encore des options d’édition rapides & faciles si vous décidez de changer quelque chose avec l’affichage de votre nouvelle image:

• Vous pouvez la redimensionner manuellement en saisissant l’un des coins et en la faisant glisser vers le haut ou vers le bas en taille
• Vous pouvez cliquer vers le bas au centre de l’image et la faire glisser dans votre message pour la repositionner
• Vous pouvez toujours supprimer l’image en cliquant sur « retour arrière » ou « supprimer » sur votre clavier et recommencer

Et c’est ça ! Vous avez appris à ajouter une image à WordPress avec l’éditeur classique.

2. Ajout d’images à des publications dans l’Éditeur WordPress Gutenberg

Dans l’Éditeur WordPress Gutenberg, vos options d’édition de publications seront très différentes de ce que vous verrez dans l’Éditeur classique.

Gutenberg adopte une approche consistant à ajouter / éditer du contenu via un système de « blocs » tels que des blocs de texte, des blocs d’en-tête, des blocs d’images, etc. Alors plongeons-nous dans l’ajout d’images dans Gutenberg.

1. Sélectionnez l’icône « Ajouter une image »

Après vous être assuré d’ajouter une image au bon endroit dans votre publication, sélectionnez l’icône « Ajouter une image ». Ça va ressembler à ça ici:

Une fois que vous cliquez sur l’icône « Ajouter une image », vous aurez quelques options pour ajouter une image à votre publication.

2. Choisissez Comment Vous allez ajouter l’image

Dans Gutenberg, vous avez quelques options rapides pour ajouter une image dans WordPress. Cela comprend:

• Télécharger (qui ouvrira un écran de sélection qui vous permettra de choisir le fichier image sur votre ordinateur)
• Bibliothèque multimédia (qui vous amène à votre bibliothèque d’images existante — à partir de laquelle vous pouvez également faire glisser & déposer une image)
• Insérer à partir de l’URL (s’il y a une image située quelque part en ligne que vous souhaitez importer, vous pouvez coller ce lien ici)

Voici un instantané de ces options (personnellement, je clique simplement sur « Télécharger » et récupère rapidement l’image que je veux sur mon bureau):

3. Téléchargez votre image

Une fois que vous avez sélectionné l’image que vous souhaitez télécharger, cliquez simplement sur le bouton « Ouvrir » et elle sera ajoutée à votre publication.

Maintenant que vous avez ajouté l’image, une vignette plus petite apparaîtra comme un nouveau bloc dans votre publication.

Voici une capture d’écran de ce à quoi cela ressemblera:

4. Paramètres d’image & Options d’édition rapide

Avant de passer à autre chose, vous voudrez obtenir vos paramètres d’image (selon les meilleures pratiques de référencement).

Et tout comme avec l’éditeur classique, vous pourrez définir de nombreux paramètres et propriétés différents pour une image. Avec Gutenberg, c’est juste fait un peu différemment. Vos paramètres d’image sont plutôt situés sur la barre latérale droite (après avoir cliqué une fois sur l’image).

Voici à quoi ressemblent ces paramètres:

Assurez-vous de définir les paramètres de votre image pour au moins ces deux propriétés:

• Rédaction d’un texte alternatif SEO-friendly qui décrit l’image et tisse une phrase-clé
• Taille de l’image (j’affiche toujours les images en taille réelle pour éviter une perte de qualité)

Vous pouvez également cliquer sur les paramètres « Style » pour ajouter des fonctionnalités de recadrage intégrées au style & plus nuancées avec Gutenberg.

5. Déplacer des images Dans un post via Gutenberg

Un effet secondaire très cool de l’accent mis par l’éditeur Gutenberg sur l’utilisation de « blocs » de contenu est la facilité avec laquelle vous pouvez déplacer vos images (ou tout bloc de contenu d’ailleurs) dans un post.

Après avoir cliqué une fois sur l’image que vous souhaitez réorganiser dans votre message, vous verrez les flèches « haut » et « bas » apparaître juste à côté de l’image.

Cliquez sur ces flèches pour déplacer votre image vers le haut ou vers le bas à l’intérieur de votre publication, comme ceci:

Et c’est tout! Tu es prêt à partir.

Vous avez également appris à ajouter une image à WordPress dans l’éditeur Gutenberg 🙂

3. L’ajout d’une Image en vedette à un article dans WordPress

Les images en vedette sont essentielles dans un blog WordPress — car ce sont les images qui s’affichent en haut de vos articles de blog (et dans les résultats de recherche et sur les plateformes de médias sociaux lorsque votre contenu est partagé).

Enfin, voici comment ajouter une image en vedette à un article (ou une page) dans WordPress.

En bas à droite de la fenêtre de votre éditeur WordPress, vous verrez une section pour ajouter une image en vedette. Cliquez sur « Définir l’image sélectionnée » et vous serez redirigé vers l’écran de téléchargement d’image standard où vous pourrez ajouter l’image que vous souhaitez voir figurer en haut de votre publication (également dans les résultats de recherche et sur les plateformes sociales).

Après avoir téléchargé l’image que vous souhaitez utiliser et cliqué sur « Définir l’image en vedette », vous serez ramené à l’écran de votre éditeur et vous verrez une petite vignette de l’image affichée en bas à droite (pour confirmer que vous avez ajouté la bonne image) comme ceci:

Assez simple, non?

Si vous avez sélectionné la mauvaise image (ou souhaitez apporter des modifications ultérieurement), vous pouvez simplement cliquer sur le texte « Supprimer l’image sélectionnée » et vous aurez la possibilité de sélectionner ou de télécharger une image différente à figurer dans votre publication.

Réflexions finales sur la façon d’ajouter une image dans WordPress

Ajouter des images à vos publications dans WordPress n’a pas besoin d’être difficile.

Que vous utilisiez l’éditeur classique ou Gutenberg pour votre blog, l’équipe derrière WordPress a travaillé dur pour rendre l’ajout d’images très facile.

Si vous rencontrez toujours des problèmes, envoyez-moi un commentaire au bas de cet article et je suis heureux de vous aider à résoudre tous les problèmes que vous rencontrez.

C’est tout pour aujourd’hui!

Nous venons de couvrir comment ajouter des images dans WordPress

Comme ce que vous voyez? Inscrivez-vous pour obtenir plus de tutoriels et de conseils sur les blogs.

Vous voulez Plus de Tutoriels de Blogs?

Allez voir mon guide ultime pour créer un blog et en tirer de l’argent cette année.