賢威8のキャラ設定プラグインをカスタマイズ

賢威8では専用のプラグインを使うことで、吹き出しや会話系の記事が簡単に出来るようになりました。

プラグインの設定で、吹き出しの背景色や形、キャラ画像の形などを変更できるのですが、もう少し手をくわえたいと思います。

吹き出しの文字サイズを変更

僕が一番きになったのは、吹き出し内の文字の大きさ。

あと一回り大きくなればと思います。

吹き出し内の文字サイズを変更するには以下のコードを追加CSSか小テーマのbase.cssに追加します。

.bubble_in p {
  font-size:1.5em;
}

確認してみると・・

フォントサイズの 1.5em を変更すると好みのサイズになります。

吹き出しと吹き出しの間隔を変える

デフォルトだと吹き出しと吹き出しの間隔が広くて、ちょっと間延びしたような感じがします。そこで、間隔を狭めてみようと思います。

以下のコードを追加CSSに追加します。

.chat_l,
.chat_r{
	position: relative;
	margin: 0;
	overflow: hidden;
}

margin を0にしてみました。

キャラ画像のサイズを変更

キャラ画像をもう少し小さくしてみます。

以下のコードを追加CSSに追加します。

.talker{
	display: block;
	width: 70px;
	height: auto;
	text-align: center;
}

画像の幅を70pxにしてみました。

最後にオススメの設定です。

文字サイズや画像サイズを以下のようにするとちょうど良いかと思います。

.bubble_in p {
  font-size:1.2em;
}
.chat_l,
.chat_r{
	position: relative;
	margin: 0;
	overflow: hidden;
}
.talker{
	display: block;
	width: 80px;
	height: auto;
	text-align: center;
}

プレビューで確認すると・・・

以上、賢威8のキャラ設定プラグインのカスタマイズでした。