Ajouter du texte ou des liens aux images

Vous pouvez ajouter du texte et des liens/boutons à la plupart des éléments de contenu image dans l'Éditeur. Cette option est facultative, mais peut améliorer l’apparence de votre boutique et lui donner un aspect plus professionnel.

Survolez simplement l'image concernée dans la zone d’aperçu de l'Éditeur et sélectionnez Modifier.
Dans les différents onglets, vous pouvez définir les paramètres suivants :

  • Modifier le texte alternatif
    Dans cet onglet, vous pouvez définir un texte alternatif (texte ALT). Il s'agit d'une courte description de l'image qui permet d’expliquer de quoi il s’agit. Cette fonction est importante pour les clients qui utilisent un lecteur d'écran, ou dans le cas où l'image ne chargerait pas. Pour plus d'informations, consultez Définir des textes alternatifs pour les images.
  • Modifier les textes de l’image
    Dans cet onglet, vous pouvez ajouter du texte aux images. Pour plus d’informations, consultez la section Comment ajouter du texte à une image.
  • Modifier l’apparence du texte
    Dans cet onglet, vous pouvez personnaliser l’apparence du texte. Pour plus d’informations, consultez la section Comment modifier l’apparence du texte.
Les paramètres de texte ne sont pas disponibles pour les images produit et n’existent que pour certains éléments image spécifiques dans l'Éditeur.

Si l’élément de contenu contient plusieurs images, les paramètres pour le texte s’appliquent généralement à l’image sélectionnée pour modification. Si vous souhaitez ajouter du texte à plusieurs images, vous devrez ajouter le texte pour chaque image individuelle.

Comment ajouter du texte à une image

Les options suivantes sont paramétrables dans le deuxième onglet : Modifier les textes de l’image

Exemple de texte et de bouton sur une image

Option Description
Titre Ce contenu est la première ligne de texte. Cet élément a la taille de police la plus importante.
Texte Cet élément s’affiche sous le titre. La taille de police est beaucoup plus petite.
Lien

Si vous souhaitez ajouter un lien vers votre image, ajoutez-le à ce champ.

  • Si vous voulez ajouter un lien interne correspondant à une page ou un produit de votre boutique, sélectionnez Pages ou Produits. Vous pouvez ensuite sélectionner l'élément vers lequel vous voulez renvoyer les utilisateurs.
    Vous pouvez également saisir des termes de recherche dans le champ Saisir lien ou rechercher produit/page pour trouver plus facilement l'élément vers lequel vous souhaitez faire un lien. Les liens internes s'ouvriront dans le même onglet.

    Attention

    Vous pouvez également sélectionner via le sélecteur de liens des produits qui sont actuellement définis comme non visibles dans les paramètres. Même si produit est défini comme non visible, il reste accessible via son URL. En revanche, il ne peut pas être commandé.
  • Si vous voulez ajouter un lien vers un site Web externe, saisissez le lien en question dans le champ Saisir lien ou rechercher produit/page.

Confirmez en sélectionnant Appliquer le lien à droite du champ de lien.

Le lien ne sera pas visible sur l’image. Pour ouvrir le lien ajouté, les clients peuvent sélectionner n'importe quelle partie de l'image.

Ouvrir le lien dans un nouvel onglet

Si vous voulez que le lien que vous avez ajouté s’ouvre dans un nouvel onglet, cochez cette case. Ceci peut être utile lorsque vous faites un lien vers une page externe, en permettant à vos clients de revenir plus facilement sur votre boutique.

Montrer le bouton sur l'image

Si vous avez ajouté un lien, vous pouvez cocher cette case pour afficher un bouton. Cela permet d’indiquer clairement à vos clients que l'image est un lien.

Même si vous avez ajouté un bouton, vos clients peuvent toujours cliquer n'importe où sur l'image pour ouvrir le lien.

Texte du bouton

Si vous avez décidé d'afficher un bouton, vous devez également ajouter un texte pour celui-ci. Ce texte peut être ce que vous voulez. Utilisez une formulation claire qui incite vos clients à sélectionner le bouton.

Évitez par exemple le terme « Acheter » car vos visiteurs peuvent craindre de faire un achat par accident et ne pas oser cliquer. Optez à la place pour « Découvrir » ou « Voir les produits », entre autres possibilités.

Comment modifier l’apparence du texte

Les options suivantes sont modifiables dans le troisième onglet Modifier l’apparence du texte après avoir ajouté du texte à une image.

Selon le thème sélectionné et le type d'élément image, l’apparence peut varier en termes de position et de style.

Exemple d’apparence de texte

Option Description
Couleur du texte

Utilisez le menu déroulant pour faire un choix parmi les couleurs de la boutique, en plus du noir et du blanc. Veillez à choisir une couleur qui contraste bien avec l’arrière-plan pour que le texte soit facile à lire.

Couleur du bouton

Utilisez le menu déroulant pour faire un choix parmi les couleurs de la boutique, en plus du noir et du blanc. Si vous n’avez pas de bouton, cette option n’est pas disponible.

La couleur du texte du bouton est noire ou blanche, selon la couleur du bouton.

Couleur de superposition

Utilisez le menu déroulant pour faire un choix parmi les couleurs de la boutique, en plus du noir et du blanc. Veillez à choisir une couleur qui contraste bien avec la couleur du texte pour que le texte soit facile à lire.

Pour certains thèmes et en fonction du type d'élément de contenu, la largeur de la superposition de couleur dépend de la longueur du texte ajouté. Dans tous les cas, elle ne dépassera pas un point prédéfini et entraînera un retour à la ligne du texte.

Opacité de la couleur de superposition

Réglez l’opacité de la couleur de superposition en déplaçant le curseur ou en modifiant le chiffre sur le côté droit. Pensez à choisir un niveau d’opacité qui offre un bon contraste entre l'image ajoutée et le texte afin que ce dernier soit facile à lire.

Si vous ne souhaitez pas utiliser de couleur de superposition, définissez l’opacité à 0.

En sélectionnant une opacité de 100% pour la couleur de superposition, l'image sera entièrement recouverte. Vous pouvez ainsi facilement créer des zones de texte de différentes couleurs.

Cet article vous a-t-il été utile ?