blanc note.カスタマイズ

blanc note. 吹き出しの色を変える方法

こんにちは、るこです。

blanc note.を使ってくださっている諭吉さんからこんな質問をいただきました。

そういえば、吹き出しって、カスタマイザーからの色変更に対応していないんですよね。
アクセントカラーかサブカラーと統一させるのもいいかと思いましたが、ご自分でお色を変えたいことも多いかと思いましたので、チップを残します。

blanc note.で使っている吹き出しのHTML

るこるこ
ショートコードを入れると表示される仕組みですが、ソースはこんなhtmlになっています。

CSS

cssで背景色と三角の吹き出しマークをつけています

上のCSSでいうと「#FFF3DB」となっている箇所が、吹き出しの色を指定している箇所です。

すべてのCSSをコピペして書き直しても色は変わります。
ですが、すべてコピペすると長くなってしまうため、色だけ上書きしましょう。

吹き出しの色だけ上書きする

テーマをそのままお使いいただいている場合は、カスタマイザー>カスタムCSSに、
子テーマをお使いなら子テーマのstyle.css またはカスタマイザーのカスタムCSSに、下記のCSSをコピペします。

#efefefは明るいグレーですので、グレーの吹き出しに変わります。

お気軽におためしくださいませ。
ご質問をくださった、諭吉さん、ありがとうございました!!

Category : blanc note.カスタマイズ

メルマガはじめました

WordPressでのブログ運営に興味のあるあなたへ♡

プチマガでは、井戸端会議のおばさん風味の軽〜いノリで、
「今週のblanc note.(WordPress無料テーマblanc noteのアップデート情報)」
「\これであなたも耳年増/ブログよもやまばなし」
「メルマガっておいしいの?」
など、ゆる〜〜く発信しています。

メンバー特典 blanc note.のテンプレートも鋭意開発中。 ほぼ週1配信です〜。

ご登録はこちらから

この記事がお気に召したら、いいね!お願いします♪

最新情報をお届けします

Web / Graphic Designer 丸山るこ

大人カワイイデザイン&イラストが得意なデザイナー、丸山るこです。 想いを持った、起業女性・スモールビジネスを応援しています。 様々な業種の案件に関わってきましたので、女性向けサービスからビジネスライクなデザインまで幅広く対応できます。 現在は、起業を考え半常駐ワークに励んでいます。一児の母。