Comment modifier le texte dans les boutons « Suivant/Terminé »

Last Updated décembre 21, 2023

Demande

Je veux un moyen de modifier le texte dans les boutons « next » (suivant), « back » (retour) ou « done » (terminé) dans mes étapes.

Solution

La modification du texte du bouton des étapes peut actuellement être effectuée à l’aide du CSS.

D’abord, vous devez localiser l’ID de l’étape en effectuant les opérations suivantes :

  1. Cliquez sur l’étape que vous souhaitez mettre à jour
  2. Allez à l’onglet Notes
  3. Faites défiler pour trouver l’ID à côté de « For CSS Adjustments, use balloon ID » (Pour les ajustements CSS, utilisez l’ID de la bulle)
  4. Copiez cet ID et collez-le à la place de « xxxxxx » dans les solutions CSS fournies ci-dessous

Remarque

  • Cet article couvre les paramètres CSS globaux (pas les paramètres locaux pour chaque étape)
  • Si vous souhaitez faire cette modification pour plusieurs étapes, vous devrez ajouter un CSS séparé pour chaque étape
  • Si un CSS local est déjà utilisé, il peut remplacer la solution CSS globale fournie ci-dessous
  • En savoir plus sur les CSS

Modifier le texte du bouton Next (suivant)

Copiez et collez les deux blocs de code ci-dessous dans votre onglet CSS global dans l’éditeur → Personnaliser → CSS.

Remplacez les mots « new text » (nouveau texte) par votre texte préféré.

div#walkme-balloon-XXXXXXX button.walkme-custom-balloon-button.walkme-custom-balloon-normal-button.walkme-custom-balloon-next-button.walkme-action-next.walkme-click-and-hover span.walkme-custom-balloon-button-text {

font-size:0px !important;

}

div#walkme-balloon-xxxxxxx button.walkme-custom-balloon-button.walkme-custom-balloon-normal-button.walkme-custom-balloon-next-button.walkme-action-next.walkme-click-and-hover span.walkme-custom-balloon-button-text::before {

content: "new text" !important;

visibility: visible !important;

font-size: 12px !important;

}

Modifier le texte pour le bouton Back (retour)

Copiez et collez les deux blocs de code ci-dessous dans votre onglet CSS global dans l’éditeur → Personnaliser → CSS.

Remplacez les mots « new text » (nouveau texte) par votre texte préféré.

div#walkme-balloon-XXXXXXX button.walkme-custom-balloon-button.walkme-custom-balloon-normal-button.walkme-custom-balloon-back-button.walkme-action-back.walkme-click-and-hover span.walkme-custom-balloon-button-text {
font-size: 0px!important;
}

div#walkme-balloon-xxxxxxx button.walkme-custom-balloon-button.walkme-custom-balloon-weak-button.walkme-custom-balloon-back-button.walkme-action-back.walkme-click-and-hover span.walkme-custom-balloon-button-text::before {

content: "new text" !important;

visibility: visible !important;

font-size: 12px !important;

}

Modifier le texte pour le bouton Done (terminé)

Copiez et collez les deux blocs de code ci-dessous dans votre onglet CSS global dans l’éditeur → Personnaliser → CSS.

Remplacez les mots « new text » (nouveau texte) par votre texte préféré.

div#walkme-balloon-xxxxxxxbutton.walkme-custom-balloon-button.walkme-custom-balloon-normal-button.walkme-custom-balloon-done-button.walkme-action-done.walkme-click-and-hover span.walkme-custom-balloon-button-text {

font-size: 0px !important;

}

div#walkme-balloon-xxxxxxxbutton.walkme-custom-balloon-button.walkme-custom-balloon-normal-button.walkme-custom-balloon-done-button.walkme-action-done.walkme-click-and-hover span.walkme-custom-balloon-button-text::before {

content: "new text" !important;

visibility: visible !important;

font-size: 12px !important;

}

Remarque

Après avoir ajouté le CSS, vous devez republier le Smart Walk-Thru pour que les modifications entrent en vigueur.

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

Merci pour votre avis!

Be part of something bigger.

Engage with peers, ask questions, share ideas

Ask the Community
×

Sélectionnez le type de compte

Fermer
< Retour

Mobile account login

< Retour