Diverの会話機能では「カスタム」を利用することで好きな色を設定できますが、その場合、グレーの線がどうしても出てしまって、デザインが微妙な感じになってしまうこともあります。
この線は今のところ設定で消すことはできません。
そのため、枠線を消したい場合は、カスタマイズが必要です。
このページでは、会話機能でカスタム機能を使って作った時の枠線を消す方法を紹介します。
注意
カスタマイズは自己責任で行ってください。実施前にバックアップをとっておくと安心です。
ページネーションを真四角に変更
カスタマイズ後のイメージは次のようになります。
そしてコードは次のようになります。
/* 会話の枠線を消す */
.voice.left .text.sc_balloon {
border: none;
}
.sc_balloon.left:after {
border: none;
}
カスタマイズ適用手順
変更手順
- カスタマイズ画面を開く
- 追加 CSSを開く
- コードの貼り付ける
まず、下のようなテーマのカスタマイズ画面を開いてください。
画面を開いたら、メニューの中から「追加CSS」をクリックしてください。
追加CSSを開いたら、先ほどのコードを貼り付けて「公開」ボタンをクリックします。
以上で作業は完了です。
実際に画面を確認して会話の枠線がなくなっていること確認しましょう。
最後に
今回は、「Diver」で会話の枠線をなくすカスタマイズ方法について紹介しました。
また、他にも「Diverでこんなカスタマイズしたいんだけど、どうやったらできるの？」といった質問があれば、コメント欄に是非コメントしてください。
できそうな内容でしたら、まずは自分のサイトで試しにカスタマイズを行い、その方法を別途公開します。
