Travailler avec WordPress Image block : Comment ajouter des images dans WordPress [+Astuce secrète]

Pour de nombreux utilisateurs, travailler avec des images peut être très frustrant. Il n'est pas toujours facile de choisir le bon rapport d'aspect ou de redimensionner correctement les images pour qu'elles s'intègrent bien dans l'ensemble de la mise en page.

1. Pourquoi utiliser le bloc WordPress Image
2. Comment ajouter des images avec le bloc WordPress Image
3. Processus de mise en forme supplémentaire des images
4. Conseil supplémentaire de notre part dans l'article

Les anciennes versions de WordPress (jusqu'à la v5.0) ajoutent des images à l'aide du bouton + Ajouter un média. Le problème était que même avec une modification minime de la taille de l'image, vous deviez la télécharger à nouveau. Cela signifie une perte de temps et des clics redondants.

Le nouvel éditeur basé sur des blocs, Gutenberg, modifie la façon dont ajouter des images dans WordPress pour simplifier ce processus pour les utilisateurs finaux. Dans cet article, nous vous montrerons un guide pratique sur l'ajout et la modification du bloc d'images WordPress. De plus, nous expliquerons une autre option de collage d'images - comment copier et coller une image dans la zone de contenu en quelques clics. Nous vous présenterons également les nouvelles fonctionnalités ajoutées provenant de WP 5.3.

Mais parlons d'abord de la raison pour laquelle vous devriez utiliser des images dans les publications et les pages.

Pourquoi le bloc d'images WordPress est-il indispensable pour votre site Web

Attirer l'attention

Les images attirent l'attention des visiteurs du site Web. Ils doivent être intéressants pour garder les visiteurs sur votre site plus longtemps. Pensez à un article de blog sans images. Ce n'est qu'un tas de texte. A première vue, il n'est pas très intéressant même s'il peut être précieux et plein d'informations. De plus, les photos peuvent aider à imaginer et à mieux décrire votre sujet.

Pour cette raison, nous devons utiliser le bloc WordPress Image pour attirer l'attention sur des éléments importants.

Texte illustratif et contexte

Les images sont également un élément essentiel pour comprendre le contenu, car elles permettent aux visiteurs de mieux comprendre de quoi parle l'article. Grâce aux infographies, vous pouvez expliquer les connexions compliquées et dire les choses de manière simple. Cela aide les visiteurs à mieux s'orienter dans le problème dont vous parlez.

Rendre le site Web plus agréable

En outre, les images apportent une touche finale à l'ensemble de la conception du site Web. Il ne s'agit pas seulement de la mise en page du site Web, mais aussi de la convivialité. Une image correctement choisie et placée peut aider le visiteur à naviguer plus facilement sur votre site Web.

Comment ajouter des images dans l'éditeur de blocs WordPress

Pour insérer une image dans une publication ou une page, vous devez ajouter un bloc principal - bloc Image. Il y a plusieurs façons de le faire :

- Utiliser "+" dans la barre supérieure ou n'importe où dans l'éditeur

- En utilisant la barre oblique "/" et en écrivant le mot "image" après

Un nouveau bloc sera créé où vous pourrez ajouter des images réelles.

Télécharger des images sur WordPress

Comment mettre des images là où vous voulez ?

• Utilisez Télécharger et sélectionnez une image sur votre disque dur
• Utilisez la bibliothèque multimédia, où vous pouvez sélectionner des images qui ont déjà été téléchargées sur votre site Web
• Utilisez la souris et faites glisser et déposez l'image
• Insérer l'adresse URL de l'image

Méthode moins connue d'ajout d'images WordPress

Outre le téléchargement d'images via la fenêtre de téléchargement, comme mentionné précédemment, il existe un autre moyen d'insérer une image (et c'est un moyen tellement rapide !). Avec l'éditeur WordPress amélioré, vous pouvez :

• Copier l'image à partir de n'importe quel contenu, ou
• Il suffit de "faire glisser" l'image avec le curseur de la souris

Et puis insérez ou déplacez (déposez) l'image sélectionnée à l'emplacement souhaité dans la zone de contenu.

La même technique que vous pouvez également utiliser au cas où vous voudriez coller une image capturée à partir de votre écran. Seules trois étapes simples sont nécessaires. D'abord, tu dois faire une capture d'écran à l'aide de la fonction d'impression d'écran. Par exemple, Windows 10 fournit son outil d'extrait de code par défaut appelé Snip & Sketch, qui est également disponible via un raccourci - appuyez simplement sur les touches Win + Maj + S ensemble sur votre clavier. Sélectionnez ensuite la zone d'image que vous souhaitez capturer. La dernière étape consiste à coller l'image copiée (ou une partie de celle-ci) dans la zone de contenu à l'aide du raccourci de base Ctrl+V.

Et qu'arrive-t-il à l'image WordPress que vous avez collée dans votre éditeur ? Eh bien, il est automatiquement ajouté à la médiathèque où vous pouvez modifier cette image.

Options limitées des métadonnées d'image

Dans l'édition d'image, vous pouvez définir son titre, sa légende, sa description et son texte alternatif. Malheureusement, vous ne pouvez pas modifier le nom du fichier image - il conservera son nom généré automatiquement, tel que image-1.png et ainsi de suite. Ce type de nom de fichier peut être un petit inconvénient en termes d'optimisation SEO en raison d'un conflit avec les recommandations de nommage des fichiers. Par conséquent, vous devez tenir compte de cet aspect avant de déplacer des images WordPress vers la zone de contenu.

Alignement des images

L'alignement de l'image est l'une des principales caractéristiques. Peu importe si vous ajoutez un bloc d'image WordPress dans la publication ou la page, vous devez toujours considérer le placement en fonction de la conception du site Web. Sur la base de cette image, l'alignement peut être choisi dans la barre d'outils au-dessus. Par défaut, vous pouvez aligner l'image à gauche, à droite ou la centrer. Certains thèmes WordPress permettent de centrer les images en largeur ou en pleine largeur. Cela dépend vraiment des fonctionnalités du thème car tous les thèmes ne le prennent pas en charge.

Redimensionner les images

La fonctionnalité révolutionnaire du bloc Image dans l'éditeur WordPress est le redimensionnement pratique. Faites simplement glisser le côté de l'image pour la rendre plus petite ou plus grande. De cette façon, vous pouvez modifier la taille de l'image en fonction du texte du contenu. L'éditeur conserve automatiquement les proportions de l'image, ce qui signifie que vous n'avez pas à vous soucier des déformations.

Nouveau style de bloc qui transforme une image en forme de cercle

Si vous utilisez la dernière version disponible de WordPress, vous avez peut-être remarqué un nouveau style de recadrage circulaire que vous pouvez utiliser pour votre image. La forme de l'image peut être modifiée via la barre d'outils supérieure en cliquant sur la première icône "Modifier le type ou le style de bloc". La forme par défaut (rectangle) sera coupée en forme de cercle.

Nouvelles fonctionnalités dans le bloc WordPress Images (ajouté dans WP 5.3)

Prise en charge des images haute résolution

L'un des points forts de WP 5.3 est l'amélioration du traitement des images sur la plate-forme WordPress. Travailler avec des images a maintenant deux fonctionnalités principales :

1. Reprise du téléchargement - Si vous téléchargez des photos haute résolution et que la connexion Internet échoue, le processus de téléchargement se poursuivra automatiquement à partir du point interrompu
2. Rotation automatique de l'image - la dernière version WP publiée garantit que les images mal pivotées pivotent automatiquement vers la position correcte lorsqu'elles sont téléchargées

Paramètres dans l'inspecteur

Pour configurer les dimensions exactes, vous pouvez utiliser l'inspecteur dans la barre latérale droite de l'éditeur. Les paramètres de taille d'image offrent des formats prêts à l'emploi tels que vignette, taille moyenne, grande ou pleine taille. Vous pouvez définir la largeur et la hauteur en pixels ou en pourcentages bien sûr.

C'est très rapide et pratique car vous pouvez effectuer toutes les modifications de redimensionnement d'image directement dans le bloc WordPress Images et tout au même endroit dans l'éditeur de blocs.

Paramètres du bloc Autres images

Comment ajouter une adresse URL

Les images peuvent être utilisées comme images statiques ou elles peuvent également être cliquables et liées à :

•   Fichier multimédia
•   Page de pièce jointe
•   URL personnalisée

Comment éditer une image dans le bloc WordPress Image

Chaque image peut être modifiée après avoir cliqué sur l'icône du crayon. La fenêtre modale avec la bibliothèque multimédia s'ouvrira où vous pourrez écrire un texte alternatif, un titre, une légende et une description. De la même manière que vous avez déjà l'habitude de le faire dans l'ancienne version de WordPress avec l'éditeur classique.

Pourquoi est-il important de faire remplir ces textes ?

Si les visiteurs cliquent sur l'image pour l'agrandir, ils voient le titre de l'image (par exemple la page d'accueil Citadela) et non le nom du fichier de l'image. De plus, s'il y a un problème avec le chargement de l'image, un texte alternatif sera affiché sur votre site Web.

Conseils supplémentaires

Outre toutes ces raisons et paramètres pour les blocs WordPress Images, il y a la chose la plus importante. Vous pourriez gagner plus de visiteurs sur votre site Web en utilisant des images. Alors comment les obtenir ?

De nos jours, les gens sont paresseux pour lire. Ils préfèrent faire défiler les images pour trouver des réponses. Comment se fait-il que vos photos et images puissent être classées ? Les textes sont la réponse. Le titre et la description parfaits de l'image sont très importants pour l'optimisation du référencement. N'oubliez pas de remplir Texte alternatif. Ensuite, Google peut mieux comprendre l'image. Ainsi, vous auriez plus de chances de le classer dans les résultats de recherche d'images.

2 façons d'ajouter une légende d'image

L'ajout d'une légende d'image est très simple à l'aide de l'éditeur de blocs. Juste sous l'image, il y a un espace pour écrire du texte. C'est la première façon - La légende est écrite sur cette image exacte sur la sous-page donnée.

La deuxième méthode consiste à écrire la légende de l'image à l'aide de l'icône en forme de crayon (Modifier l'image) dans la bibliothèque multimédia. De cette façon, vous ajoutez une légende d'image globalement sur l'ensemble du site Web. Cela signifie que si vous utilisez la même image à trois endroits différents, elle utilisera toujours cette légende.

Aimez-vous la facilité avec laquelle vous pouvez ajouter des images dans le bloc d'images WordPress ? Essayez-le par vous-même !

Découvrez notre tout nouveau thème WordPress Citadela et ses packs de mise en page sur mesure. Ils ont été spécialement conçus et développés pour différents types d'entreprises et ils prennent également en charge la nouvelle façon d'éditer le contenu via l'éditeur de blocs WordPress.