[Next/Done（次へ／完了）]ボタンでテキストを変更する方法

Download as PDF

リクエスト

ステップの［Next（次へ）］、［Back（戻る］、［Done（完了）］ボタンのテキストを変更する方法を知りたいです。

ソリューション

ステップのボタンテキストの変更は、CSSを使用して行うことができます。

まず、以下の手順でステップIDを見つける必要があります。

1. 更新するステップをクリックします
2. メモタブに移動します
3. スクロールして、「For CSS Adjustments, use balloon ID」の横にあるIDを見つけてください
4. このIDをコピーし、以下に示すCSSソリューションの「xxxxxx」の場所に貼り付けます

［Next（次へ）］ボタンのテキストを変更する

以下の両方のコードブロックをコピーして、Editor – Customize – CSSの［Global CSS（グローバルCSS）］タブに貼り付けます。

「new text（新しいテキスト）」を、お好みのテキストに置き換えます。

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;

}

［Back（戻る）］ボタンのテキストを変更する

以下の両方のコードブロックをコピーして、Editor – Customize – CSSの［Global CSS（グローバルCSS）］タブに貼り付けます。

「new text（新しいテキスト）」を、お好みのテキストに置き換えます。

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;

}

［Done（完了）］ボタンのテキストを変更する

以下の両方のコードブロックをコピーして、Editor – Customize – CSSの［Global CSS（グローバルCSS）］タブに貼り付けます。

「new text（新しいテキスト）」を、お好みのテキストに置き換えます。

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;

}