ポップアップの見た目を変更するには?

[ステップ編集]画面で編集する

ポップアップの見た目は[ステップ編集]画面から変更できます。設定方法は「テキストを編集する」を参照してください。[ステップ編集]画面では、文字の大きさや背景色などを設定できます。

CSSを記述してカスタマイズする

[ステップ編集]画面で設定できない内容でも、[見出し]または[本文]エリアを[HTML]モードにしてCSSを記述すれば、もっと細かく調整することが可能です。エンジニア向けの技術情報を掲載している「The Sprocket Developer Hub」にカスタマイズ方法を掲載していますので、参照してください。

ポップアップ全体

ポップアップのデザインを角丸にする

customize-popup-round.png

ポップアップの余白や幅を調整する

customize-popup-button-margin.png

吹き出し型ポップアップ

吹き出し型ポップアップを画面内に収める

customize-popup-balloon-inscreen.png

吹き出し型ポップアップのくちばし(しっぽ)の左右の位置を調整する

customize-popup-balloon-tail.png

ポップアップ内のテキスト

ポップアップのテキストを上下中央に配置する

customize-popup-text-vertical-center.png

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

customize-popup-button-bold.png

ポップアップのボタンの下にテキストを挿入する

customize-popup-text-under-button.png

この記事は役に立ちましたか?
0人中0人がこの記事が役に立ったと言っています