ポップアップ内のボタンのテキスト(ラベル)を太字にする

ボタンのテキストをCSSで太字にする方法を解説します。

ステップの編集画面にCSSを記述することで、ポップアップ内にあるボタンのテキスト(ラベル)を太字にすることが可能です。

869

サンプルコード

Sprocketの管理画面で、ステップ内のHTMLに以下のようなCSSを記述します。CSSは[見出し]と[本文]どちらのHTMLに記述しても構いません。
CSSの中で、太字にしたいボタンの連結先となるステップIDを指定します。ボタンを表示するステップのIDではなく、ボタンをクリックした先に連結するステップのIDを入力する点に注意してください。
例えば、ポップアップ内に2つのボタンがあり、2つのステップに分岐する場合は、太字にしたいほうの分岐先となるステップIDを入力します。

<style>
body > .spg-tour02 * .spg-tour02-nav .spg-tour02-nav-row .spg-tour02-nav-button[data-next="step_02"]{
  font-weight: bold;
}
</style>

📘

補足

上記サンプルコードのstep_02部分は、ラベルを太字にするボタンが連結しているステップIDを記述してください。