今回は、このブログでも愛用中のWordPressテーマ「WING(AFFINGER5)」における…
「Webアイコン」の色設定
をカスタマイズする手順
をご紹介していきたいと思います
まずWebアイコンとは、記事のなかに挿入する色んな「デザインパーツ」のこと
具体的には…
↑ こちらのアイコンのこと
「WING(AFFINGER5)」の場合、これらの色設定をカスタマイズする方法は超簡単です
それではさっそく見ていきましょー🐥
Webアイコンの使い方自体は、↓ をどうぞ♪
-
AFFINGER5で便利な「Webアイコン」の種類と使い方【WordPressブログ】
続きを見る
このブログのWordPress環境
- 使用中のテーマ:WING AFFINGER5
- 使用中のエディタ:クラシックエディタ
- 使用中のプラグイン:おすすめプラグイン17選 の記事にて公開しています
About me
- 専業ブロガー・フリーランス -
あずき
独立4年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^
【Webアイコン編】AFFINGER5における「色設定」のカスタマイズ手順
まずは、カスタマイズ画面を開きましょう(下記手順です)
↑ WordPress管理画面 > 外観 > カスタマイズ をクリックします
↑ 左側のメニュー一覧から、「オプションカラー」をクリックします
↑ 左側のメニュー一覧から、「記事内のWebアイコン」という項目をクリックします
各Webアイコンの色設定は…
↑ こちらの「はてなマーク」~「初心者マーク」までの項目で、それぞれカスタマイズできます
初期設定では…
↑ このように ! アイコンのみ赤色で、あとはブラックに設定されてます
今回は参考例として、僕が実際に使ってる…
↑ このような配色に設定してみます
具体的なカラーコードは、
- オレンジ色 = #ffb049
- 赤色 = #f54e6a
- 緑色 = #81d742
この通りです
改めてプレビューで見てみると…
↑ こんな感じになりました
設定できたら…
↑ 画面上部の 公開 をクリックして、設定を保存しましょう
これで、「Webアイコン」の色設定はOKです
お疲れさまでした♪
あずき🐥
About me
- 専業ブロガー・フリーランス -
あずき
独立4年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^