Comment ajouter du texte au-dessus d'une image dans WordPress (3 méthodes)

L'ajout de texte au-dessus d'une image est une technique populaire pour améliorer l'attrait visuel de leur contenu ou de leur site Web. De plus, c'est un excellent moyen de rendre vos images plus informatives et engageantes.

Dans cet article, nous avons trouvé trois façons faciles d'ajouter du texte au-dessus d'une image dans WordPress. Que vous préfériez utiliser l'éditeur de blocs, un plugin ou un code personnalisé. Découvrons!

Pourquoi il est important d'ajouter le texte en haut des images

Avant d'aller de l'avant vers les méthodes, vous devez savoir la raison pour laquelle l'ajout du texte en haut des images est important.

1. Attirer l'attention

Si les utilisateurs défilent rapidement dans le contenu, l'ajout d'images seuls peut ne pas être suffisant pour attirer leur attention. C'est pourquoi vous devez ajouter du texte sur une image pour vous aider à attirer l'attention des utilisateurs et à transmettre votre message plus efficacement.

2. Améliorer l'expérience utilisateur

Il est vrai que les images peuvent fournir beaucoup de valeur par elles-mêmes, cependant, l'ajout de texte en plus, tels que des légendes, des citations ou d'autres contenus basés sur le texte, peut les rendre encore plus utiles. De plus, les utilisateurs peuvent comprendre le contexte de l'image et comment il se rapporte à votre contenu.

3. Améliorer l'accessibilité

Vous pouvez également aider à améliorer l'accessibilité pour les utilisateurs qui peuvent avoir du mal à consulter l'image elle-même. En fournissant une alternative de texte, vous pouvez vous assurer que votre contenu est accessible à une gamme plus large d'utilisateurs.

4. Boosting SEO

L'ajout de mots clés pertinents à vos légendes d'image ou à votre texte ALT peut aider à améliorer le classement des moteurs de recherche du site Web . En effet, les moteurs de recherche utilisent ces informations pour comprendre le contenu de votre site Web et déterminer à quel point il est pertinent pour les requêtes de recherche des utilisateurs.

3 Méthodes Comment ajouter du texte sur une image dans WordPress

1. Utilisez l'éditeur de blocs WordPress

Tout d'abord, accédez à la page ou publiez sur lequel vous allez ajouter le texte sur l'image.

Choisissez la couverture pour écrire le texte sur l'image.

Après cela, il commencera à apparaître sur votre écran. Il vous montre l'image par défaut, mais vous pouvez modifier l'image comme vous le souhaitez.

Vous pouvez également remplacer l'image par défaut par votre image personnalisée. Cliquez sur le bouton Remplacer , puis téléchargez l'image ou choisissez simplement dans la bibliothèque de médias .

Cela ressemblera à ceci, alors vous pouvez écrire le texte sur l'image comme vous le souhaitez.

Double-cliquez sur le texte, vous obtiendrez l'option d'édition du texte. Vous pouvez ajuster la taille, la couleur et bien d'autres selon vos besoins.

Enfin, cliquez sur le bouton de mise à jour, ou si vous avez ajouté le nouveau message ou page, puis cliquez sur le bouton Publier.

2. Utilisez CSS

Ouvrez l'éditeur de blocs WordPress et sélectionnez le bloc d'image où vous souhaitez ajouter du texte. Dans la barre latérale droite, cliquez sur l' avancé .

Dans le de classe CSS supplémentaire , ajoutez une classe personnalisée pour le bloc d'image.

Enregistrez les modifications et publiez ou mettez à jour la page ou la publication.

.Custom-classe {position: relative; } .custom-classe P {position: absolue; en haut: 50%; Gauche: 50%; Transformer: traduire (-50%, -50%); taille de police: 24px; Couleur: #ffffff; Text-shadow: 2px 2px 2px # 000000; } 

Dans le code ci-dessus, remplacez la " classe personnalisée " par la classe personnalisée que vous avez ajoutée au bloc d'image. Vous pouvez également personnaliser la taille de la police, la couleur et d'autres options de style pour correspondre à vos préférences.

3. Utilisez le plugin WordPress

Si vous souhaitez que la liberté de créer des conceptions de pages complètement personnalisées, vous aurez besoin d'un plugin de générateur de pages. SeedProd, qui vous permet d'ajouter du texte en haut de toute image sur toute votre site Web.

Tout d'abord, installez et activez le plugin SeedProd. Lors de l'activation, vous devrez saisir une clé de licence. Connectez-vous à votre compte SeedProd, puis cliquez sur l' Télécharger .

Une fois terminé, copiez la clé de la section Clé
de licence

Vous pouvez maintenant coller cette clé dans votre zone d'administration WordPress en allant sur la page SeedProd » .

Une fois que vous êtes ici, allez-y et collez votre clé dans le champ de clé de licence. Ensuite, vous devez simplement cliquer sur la clé Vérifier .

Ensuite, aller à SeedProd »Pages de destination et cliquez sur Ajouter une nouvelle page de destination .

Après cela, choisissez un modèle. Peu importe le modèle de graines que vous choisissez, vous pouvez personnaliser chaque partie du modèle pour s'adapter parfaitement à votre site Web et à votre marque.

Cependant, si vous préférez commencer par une toile vierge, cliquez sur le modèle vide .

Une fois que vous avez trouvé un modèle, survolez votre souris dessus. Vous pouvez ensuite cliquer sur l'icône d'aperçu .

Si vous êtes satisfait de l'apparence de ce modèle, allez-y et cliquez sur le bouton Choisissez ce modèle .

Dans le Nom de la page , saisissez un nom pour la page.

Si vous souhaitez modifier l'URL créée automatiquement, modifiez le texte dans le URL de la page .

Cliquez sur le Enregistrer et commencer à modifier le bouton de la page. Cela ouvrira le modèle dans l'éditeur de glisser-déposer de SeedProd.

Dans la barre latérale de gauche, vous verrez tous les blocs et sections que vous pouvez ajouter à votre page à l'aide de glisser-déposer.

À moins que vous n'utilisiez le modèle vierge, votre page SeedProd aura déjà des blocs et des sections. Pour modifier l'un de ce contenu, cliquez pour sélectionner le bloc ou la section .

Le menu gauche de SeedProd affichera désormais tous les paramètres que vous pouvez utiliser pour personnaliser ce bloc ou ce section.

La façon la plus simple d'ajouter du texte sur une image est d'utiliser l'une des sections de héros prêtes à l'emploi de SeedProd.

Ces sections ont un espace réservé, une image d'arrière-plan pleine largeur, avec un texte d'espace réservé ajouté sur le dessus. Vous pouvez simplement remplacer l'image et le texte d'arrière-plan par défaut par votre propre contenu.

Cliquez sur l' onglet Section dans le menu de gauche.

Ensuite, cliquez sur Hero pour voir toutes les sections de héros prêtes à l'emploi que vous pouvez ajouter à votre page.

Pour aller de l'avant et ajouter cette section Héros à votre conception, cliquez simplement sur Choisissez cette section.

Cliquez sur l'image Stock pour le sélectionner si vous souhaitez remplacer l'action du modèle par votre propre image.

de l'image d'arrière-plan de survol jusqu'à ce qu'une icône de poubelle apparaisse. Vous pouvez ensuite aller de l'avant et cliquer sur cette icône pour supprimer l'image de l'espace réservé.

Ensuite, cliquez sur Utiliser votre propre image . Vous pouvez ensuite choisir une image dans la bibliothèque de médias WordPress ou utiliser une image Stock.

Une fois que vous avez ajouté une image, vous êtes prêt à remplacer le texte de l'espace réservé.

Cliquez pour sélectionner le bloc de texte . Ensuite, dans la zone de texte , tapez simplement le texte que vous souhaitez utiliser.

Certains des modèles de héros de SeedProd ont un contenu supplémentaire, comme les boutons de l'appel à l'action.

Si vous souhaitez modifier ce contenu, cliquez pour sélectionner le bloc , puis apportez vos modifications dans le menu gauche de SeedProd.

Une autre option consiste à supprimer le bloc du modèle de héros.

Pour ce faire, cliquez pour sélectionner le bloc , puis cliquez sur l'icône de la poubelle .

Si vous êtes satisfait de la conception de votre page, cliquez sur le bouton Enregistrer .

De là, vous pouvez choisir de publier la page ou de l'enregistrer en tant que modèle.

Conclusion

Il s'agit de trois méthodes pour ajouter du texte au-dessus d'une image dans WordPress. Facile, non? Choisissez l'approche qui correspond le mieux à votre niveau de compétence et à vos préférences de conception.

De plus, organisez, optimisez et gérez vos fichiers multimédias comme un WP Media Folder . C'est le bon moment pour dire au revoir aux bibliothèques désordonnées!