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

Il y a beaucoup de fois où vous avez besoin d’ajouter une superposition de texte à une image dans WordPress.

Vous souhaitez peut-être créer une bannière accrocheuse pour votre page d’accueil. Ou peut-être souhaitez-vous ajouter un titre accrocheur à votre image mise en avant. Nous avons déjà rencontré cette situation, et l’ajout d’une superposition de texte est un excellent moyen de rendre vos images plus informatives et plus attrayantes.

Si vous avez besoin d’aide pour ajouter du texte sur le dessus de votre image dans WordPress, alors vous êtes au bon endroit. Nous avons trouvé 3 façons faciles d’ajouter du texte sur le dessus des images dans WordPress, aucune compétence en design n’est nécessaire.

Quand ajouter du texte sur les images dans WordPress

Lesimages peuvent donner à votre site WordPress un aspect plus intéressant et aider à rompre les grands paragraphes de texte.

Cependant, vos images peuvent parfois nécessiter plus d’explications. Par exemple, vous pouvez ajouter un texte au-dessus d’une image pour expliquer ce qu’elle affiche et pourquoi vous l’avez ajoutée à votre publication.

De nombreux blogs WordPress ajoutent également du texte au-dessus d’une image pour créer des bannières et des en-têtes accrocheurs et informatifs.

Dans cette publication, nous avons trois façons conviviales pour les débutants d’ajouter du texte au-dessus d’une image dans WordPress. Si vous préférez passer directement à une méthode particulière, alors vous pouvez utiliser les liens ci-dessous :

Méthode 1 : Ajouter du texte au-dessus d’une image à l’aide du bloc de couverture

L’une des façons d’ajouter du texte au-dessus d’une image dans WordPress est d’utiliser le bloc Couverture. Vous pouvez utiliser ce bloc pour afficher n’importe quelle image, puis taper du texte par-dessus l’image. Le bloc Couverture est donc parfait pour créer des images de héros, des en-têtes et des bannières.

Pour ajouter un bloc Cover à une page ou à une publication, il suffit de cliquer sur le bouton plus  » + Ajouter un bloc  » dans l’éditeur de blocs de Gutenberg.

Vous pouvez maintenant taper « Couverture » et sélectionner le bloc adéquat lorsqu’il apparaît.

Ici, vous pouvez choisir le bloc de couverture par défaut. Mais vous pouvez également opter pour l’option Modèle avec l’image et le texte indicatifs. Avec la seconde option, vous pouvez simplement remplacer l’image et le texte existants par les vôtres.

Pour remplacer l’image par défaut, il suffit de cliquer pour sélectionner l’image. Cliquez ensuite sur le bouton « Remplacer ».

Si vous souhaitez utiliser une image qui se trouve déjà dans votre médiathèque WordPress, il vous suffit de cliquer sur  » Ouvrir la bibliothèque des médias « . Vous pouvez alors choisir une image existante.

Si vous souhaitez téléverser une nouvelle image, cliquez plutôt sur « Téléverser ».

Une fenêtre s’ouvre, dans laquelle vous pouvez choisir n’importe quel fichier de votre ordinateur.

Après avoir choisi une image, vous pouvez utiliser les Réglages du bloc pour créer des effets intéressants et accrocheurs. Par exemple, vous pouvez faire en sorte que l’image soit corrigée lorsque l’internaute défile la page ou ajouter une superposition de couleurs à l’image.

Si vous utilisez une superposition, vous pouvez modifier son opacité en utilisant le Diaporama « Opacité ». Le réglage de l’opacité permet de contrôler la transparence de l’image d’arrière-plan.

Lorsque vous êtes satisfait de l’aspect de l’image, vous êtes prêt à ajouter du texte.

Par défaut, le bloc Couverture comporte un Titre et un Paragraphe dans lesquels vous pouvez ajouter du texte au-dessus de l’image.

Pour ajouter du texte, il suffit de cliquer pour sélectionner le bloc Titre ou le bloc Paragraphe. Saisissez ensuite le texte que vous souhaitez utiliser.

Lorsque vous ajoutez du texte au-dessus d’une image, ce texte peut parfois être difficile à lire. Cela est particulièrement vrai pour tous les internautes qui ont une mauvaise vision. Pour en savoir plus, veuillez consulter notre guide sur la manière d’améliorer l’accessibilité de votre site WordPress.

Ceci étant dit, vous pouvez souhaiter styliser votre texte pour qu’il soit plus facile à lire.

Si vous travaillez avec un bloc Titre, vous pouvez également essayer les différents styles de titre pour voir lequel est le plus facile à lire.

Vous pouvez également aider votre texte à se démarquer en utilisant une couleur contrastée.

Pour choisir une autre couleur, sélectionnez l’onglet « Bloc » dans le menu de droite. Cliquez ensuite sur « Couleur » pour déplier cette section.

Une fois que vous avez fait cela, cliquez sur « Texte ». Cela ouvre une fenêtre surgissante dans laquelle vous pouvez choisir une nouvelle couleur pour tout le texte du bloc.

En règle générale, un texte plus grand est plus facile à lire.

Pour agrandir votre texte, cliquez sur le champ situé à côté de « Taille » et tapez un nombre plus élevé dans ce champ.

Une fois que vous êtes satisfait de l’aspect de votre bloc Couverture, vous pouvez publier ou mettre à jour votre page comme d’habitude. Maintenant, si vous visitez votre site WordPress, vous verrez votre texte au-dessus de l’image.

Méthode 2 : Ajouter du texte au-dessus d’une image à l’aide du bloc d’image

Le bloc Couverture est idéal pour créer des bannières et des en-têtes. Cependant, vous pouvez également ajouter du texte au-dessus d’un bloc d’image WordPress standard.

Pour commencer, vous devrez ajouter un bloc Image à votre page ou publication. Pour ce faire, il vous suffit de cliquer sur le bouton plus ‘+ Ajouter un module’ dans l’éditeur de blocs de WordPress.

Vous pouvez ensuite taper « Image » et sélectionner le bon bloc pour l’ajouter à votre publication.

Vous pouvez ensuite soit téléverser une image depuis votre ordinateur, soit cliquer sur  » Bibliothèque des médias  » pour choisir une image dans la médiathèque de WordPress.

Après avoir choisi votre image, vous pouvez modifier son point focal, ajouter une superposition et changer l’opacité en suivant le même processus que celui décrit ci-dessus.

Vous pouvez également essayer les différents curseurs « Arrière-plan corrigé » et « Arrière-plan répété » pour voir ce qui convient le mieux à votre bloc d’images.

Lorsque vous êtes satisfait de l’aspect de votre image, il vous suffit de cliquer sur le bouton « Ajouter du texte sur l’image ».

Cela ajoute une zone où vous pouvez taper votre texte.

En fonction de votre image, les internautes peuvent avoir du mal à lire votre texte de superposition. Dans ce cas, il peut être utile de mettre le texte en gras ou de modifier sa couleur en suivant le même processus que celui décrit ci-dessus.

Vous pouvez également agrandir votre texte.

Pour ce faire, trouvez la section « Taille » dans le menu de droite. Vous pouvez alors cliquer sur les différents chiffres pour agrandir ou réduire votre texte.

Lorsque vous êtes satisfait de l’aspect de votre texte et de votre image, allez-y et prévisualisez votre site. Cliquez ensuite sur « Enregistrer le brouillon », « Mettre à jour » ou « Publier » pour enregistrer vos modifications.

Si vous utilisez un thème WordPress à blocs, vous pouvez utiliser les méthodes 1 et 2 pour ajouter du texte au-dessus d’une image dans n’importe quelle partie de votre thème à l’aide de l’Éditeur de site (Éditeur de site) de WordPress.

Vous pouvez en savoir plus sur l’Éditeur de site dans notre guide complet pour débutants sur l’édition complète de site WordPress.

Méthode 3 : Créer une mise en page personnalisée avec du texte au-dessus d’une image

Les blocs WordPress intégrés sont un moyen rapide et facile d’ajouter du texte au-dessus d’une image dans WordPress. Cependant, si vous voulez avoir la liberté de créer des designs de page complètement personnalisés, alors vous aurez besoin d’un plugin de constructeur de page.

SeedProd est la meilleure extension de constructeur de page WordPress sur le marché. Il vous permet d’ajouter du texte au-dessus de n’importe quelle image sur l’ensemble de votre site.

Vous pouvez lire notre Avis terminé sur SeedProd pour plus de détails.

Tout d’abord, vous devez installer et activer l’extension SeedProd. Pour plus de détails, consultez notre guide étape par étape sur l ‘installation d’une extension WordPress.

Lors de l’activation, vous devrez saisir votre clé de licence SeedProd. Vous pouvez obtenir cette clé en vous connectant à votre compte SeedProd. Ensuite, cliquez sur l’onglet ‘Téléchargements’.

Une fois que vous avez fait cela, vous pouvez copier la clé dans la section « Clé de licence ».

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

Une fois que vous êtes ici, allez-y et collez votre clé dans le champ « Clé de licence ».

Il vous suffit ensuite de cliquer sur « Vérifier la clé ».

Après cela, nous allons nous diriger vers SeedProd «  Landing Pages et cliquer sur ‘Add New Landing Page’.

Votre prochaine tâche consiste à choisir un Modèle, qui sera le point de départ de votre page. Aucun des modèles de SeedProd que vous choisissez ne vous empêche de personnaliser chaque élément du modèle pour qu’il corresponde parfaitement à votre site et à votre marque.

Si vous préférez partir d’une toile vierge, vous pouvez cliquer sur « Modèle vierge ».

Dans toutes nos images, nous utilisons le modèle de page Squeeze Tasty, qui est parfait pour obtenir plus de campagnes d’abonnés/abonnés.

Lorsque vous avez trouvé un Modèle que vous souhaitez utiliser, survolez-le avec votre souris. Vous pouvez alors cliquer sur l’icône « Prévisualisation ».

Ceci affichera une prévisualisation du Modèle.

Si vous êtes satisfait de l’aspect de ce modèle, cliquez sur le bouton « Choisissez ce modèle ».

Dans le champ « Nom de l’expéditeur », saisissez un nom pour la page.

Par défaut, SeedProd utilisera ce nom comme URL de la page. Si vous souhaitez modifier cette URL créée automatiquement, il vous suffit de modifier le texte dans le champ ‘Page URL’.

Lorsque vous êtes satisfait des modifications saisies, cliquez sur le bouton  » Enregistrer et commencer à modifier la page « . Cela ouvrira le Modèle dans les éditeurs/éditrices de SeedProd.

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

À moins que vous n’utilisiez le Modèle vierge, votre page SeedProd comportera déjà quelques blocs et sections. Pour modifier ce contenu, il suffit de cliquer pour sélectionner le bloc ou la section.

Le menu de gauche de SeedProd affichera maintenant tous les Réglages que vous pouvez utiliser pour personnaliser ce bloc ou cette section. Comme vous pouvez le voir dans l’image suivante, si vous cliquez sur un bloc Titre, vous pouvez modifier le texte qui s’affiche dans ce bloc.

La manière la plus simple d’ajouter du texte au-dessus d’une image est d’utiliser l’une des bannières d’accroche prêtes à l’emploi de SeedProd.

Ces sections sont dotées d’une image d’arrière-plan pleine largeur et d’un module de texte ajouté. Vous pouvez simplement remplacer l’image d’arrière-plan et le texte par défaut par votre propre contenu.

Pour Premiers pas, cliquez sur l’onglet « Sections » dans le menu de gauche de SeedProd.

Vous pouvez ensuite cliquer sur « Hero » pour voir toutes les sections de héros prêtes à l’emploi que vous pouvez ajouter à votre page.

Pour prévisualiser l’un de ces modèles de section, il suffit de survoler le modèle et de cliquer sur l’icône de la loupe.

Pour ajouter cette bannière d’accroche à votre modèle, il vous suffit de cliquer sur « Choisissez cette section ».

Ensuite, vous devez remplacer l’image de base du Modèle par votre propre image. Pour ce faire, il vous suffit de cliquer sur l’image de base pour la sélectionner.

Ensuite, dans le menu de gauche de SeedProd, survolez la Prévisualisation de l’image d’arrière-plan jusqu’à ce qu’une icône de corbeille apparaisse.

Vous pouvez ensuite cliquer sur cette icône pour supprimer l’image de remplacement.

Cliquez ensuite sur « Utiliser votre propre image ». Vous pouvez alors choisir une image dans la médiathèque de WordPress ou utiliser une image de stock.

SeedProd vous permet d’accéder facilement à des milliers d’images en stock libres de droits. Pour jeter un coup d’œil à la bibliothèque d’images de SeedProd, cliquez sur « Utiliser une image de stock ».

Dans la barre de recherche, tapez un mot ou une phrase décrivant l’image que vous recherchez et cliquez sur le bouton « Rechercher ».

SeedProd affiche alors toutes les images de stock correspondant à votre terme de recherche.

Lorsque vous trouvez une image que vous souhaitez ajouter à votre dessin, il vous suffit de cliquer dessus.

Une fois l’image ajoutée, vous êtes prêt à remplacer le texte indicatif.

Pour ce faire, cliquez sur pour sélectionner le bloc Sélectionné. Dans la zone « Texte », tapez simplement le texte que vous souhaitez utiliser.

Certains modèles de bannière d’accroche de SeedProd ont un contenu supplémentaire, comme des boutons d’appel à l’action.

Vous souhaitez modifier ce contenu ? Dans ce cas, il vous suffit de cliquer pour sélectionner le bloc, puis d’effectuer vos modifications dans le menu de gauche de SeedProd.

Une autre option consiste à supprimer le bloc du modèle de bannière d’accroche.

Pour ce faire, il suffit de cliquer pour sélectionner le bloc, puis de cliquer sur l’icône de la corbeille.

Lorsque vous êtes satisfait de la conception de votre page, vous pouvez cliquer sur le bouton « Enregistrer ».

À partir de là, vous pouvez choisir de publier la page ou de l’enregistrer en tant que modèle.

Pour plus de détails sur la création de mises en page personnalisées avec SeedProd, vous pouvez consulter notre guide sur la création d’une page d’atterrissage dans WordPress.

Astuces pour gérer les images et les fichiers dans WordPress

L’ajout de texte aux images n’est qu’un moyen parmi d’autres d’améliorer l’aspect de votre site. Vous voulez en faire plus avec vos images ? Consultez ces guides simples :

• Comment charger facilement des images paresseuses dans WordPress
• Comment ajouter plusieurs galeries dans les publications et pages de WordPress
• Comment ajouter correctement un Diaporama de fonctionnalité en avant dans WordPress
• Comment ajouter une bordure autour d’une image dans WordPress
• Comment recadrer et modifier les miniatures des publications WordPress
• Comment ajouter facilement des images interactives à 360 degrés dans WordPress

Nous espérons que cet article vous a aidé à apprendre comment ajouter du texte en haut d’une image sur WordPress. Vous pouvez également consulter notre guide sur la façon de modifier en masse les images mises en avant et nos choix d’experts pour les meilleurs plugins de diaporama WordPress.

Si vous avez aimé cet article, veuillez alors vous abonner à notre chaîne YouTube pour obtenir des tutoriels vidéo sur WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.