今回は、このブログでも愛用中のWordPressテーマ「WING(AFFINGER5)」における…
「ウィジェット」の色設定をカスタマイズする手順
についてご紹介していきたいと思います
まず「ウィジェット」とは、ブログのサイドバーなどに…
- カテゴリー一覧
- プロフィール
といった、色々なメニューを設置できるツールの総称
例えば…
↑ 右側サイドバーのオレンジで囲ってるとこが、ウィジェットです
で、肝心の「ウィジェットの色設定」とは、設置したウィジェットごとの…
↑ この部分のこと

つまり…
- 任意で名づけた「ウィジェットタイトル」の色
- ボーダー(横線)などのデザイン色
におけるカスタマイズ設定ですね
このカスタマイズは、「WING(AFFINGER5)」だと超簡単です

それではさっそく見ていきましょー🐥
ちなみに
サイドバーに「カテゴリー一覧」を入れる方法はこちら ↓
-
【AFFINGER5】ブログのサイドバーに、「カテゴリー一覧」を設置する方法【WordPressウィジェット】
続きを見る
サイドバーに「プロフィール」などのテキストや画像を入れる方法はこちら ↓
-
【AFFINGER5】ブログのサイドバーに、「プロフィール」などテキストや画像を設置する方法【WordPressウィジェット】
続きを見る
-
【愛用】「WING AFFINGER5」って実際どうなの?気に入ってる点・気になる点をガチレビュー【WordPressのおすすめテーマ】
続きを見る
-
WordPressの「タグ管理」とは?どれだけブログに必須な機能か、3分で解説【よく使う文章や広告をテンプレート化/一括修正が最強に便利】
続きを見る
今回の記事はこちらの章に属しています
About me
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^
【ウィジェット編】WING AFFINGER5で、ブログの「色設定」をカスタマイズする手順
それではカスタマイズ手順です
↑ WordPress管理画面 > 外観 > カスタマイズ をクリックします
↑ カスタマイズ画面が開いたら、左側のメニュー一覧から「各テキストとhタグ(見出し)」という項目をクリックします
↑ つづいて、「ウィジェットタイトル(サイドバー)」をクリックします
↑ ウィジェット設定の画面が開きました
画面右側のプレビューを見てもわかる通り、初期設定ではウィジェットタイトルとデザインの色が…
↑ こんな水色に設定されてます
この色設定の変更は…
↑ この、「文字色」「背景色」「背景色(グラデーション(上部)」「ボーダー色」「ボーダー色(サブ)」で行います
試しに…
↑ こんな感じの「ネイビー系」ベースに変えてみます。 右側のプレビューを見ると…
↑ 色はもちろんですが、ボーダー(横線)がグラデーションになりました
これは、上記の「ボーダー色(サブ)」という項目をホワイトにしたのと…
↑ そもそもデザインの種類が、初期設定だと「グラデーションアンダーライン」というパターンになってるため
こちらも試しに…
↑「2色アンダーラインに変更」という項目を選んでみると…
↑ 左と右で、くっきり2色にわかれました
それ以外にも例えば…
↑「囲みドットデザインに変更」というパターンを選んで、さらに…
↑「文字色」をホワイト、「背景色」と「ボーダー色」をネイビー系にして、「ボーダー色(サブ)」のみホワイトにすると…
↑ こんなボックス型のデザインにもできます
さらにさらに…
↑ この「背景や吹き出しの角を丸くする」にチェックを入れると…
↑ ボックスデザインの四隅が丸くなりました
この要領で、デザインパターンとそのカラーを色々試してみましょう
参考までに、僕のこの新しいサブブログでは…
↑ デザインは、初期設定のままの「グラデーションアンダーライン」
↑ 配色は、この通りです
このネイビー系の正確なカラーコードは、「#1001b2」を使ってます
また、ホワイトは真っ白にあたる「#ffffff」です
またプレビュー画面をチェックしてみると…
↑ こんな感じになりました
カスタマイズってどうしてもあれこれ装飾を加えたくなりますが、個人的には極力シンプルにした方がスマートな見映えになるかなと思ってます

改めてブログの全体感を見てみると…
↑ こんな感じになりました
おしまい♪
あずき🐥
\ このブログでも愛用中!/
―― 検証と改善を重ねた唯一無二のテーマ ――
WING AFFINGER5
✔ 洗練された美しいデザイン性と、「変幻自在」な圧巻のバリエーション
✔ 時間のかかる面倒なカスタマイズも、「クリック1つ」でさくさく実現
✔ 「本気で戦う」ための、最適化されたSEO対策と収益UPの機能が標準装備
今なら超時短ツール「タグ管理プラグイン(4,980円)」の無料配布キャンペーン中!
-
WordPressの「タグ管理」とは?どれだけブログに必須な機能か、3分で解説【よく使う文章や広告をテンプレート化/一括修正が最強に便利】
続きを見る
今回の記事はこちらの章に属しています
About me
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^