あずきです🐥
このブログでも愛用中のWordPressテーマ、「WING（AFFINGER5）」における…
「リンクボタン」の色設定をカスタマイズする方法
について、初心者さん向けに1から解説していきます（簡単です♪）
まず「WING（AFFINGER5）」における「リンクボタン」とは、例えば…
↑ こういったもの
で、「AFFINGER5」ならこの「リンクボタン」の色設定は、初期設定から自由にカスタマイズできます
それではさっそく見ていきましょー🐥
このブログのWordPress環境
- 使用中のテーマ：WING AFFINGER5
- 使用中のエディタ：クラシックエディタ
- 使用中のプラグイン：おすすめプラグイン17選 の記事で公開しています
関連：「AFFINGER5」の購入・導入方法を1から解説
関連：「AFFINGER5」導入後にまず行うべきステップまとめ
著者
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^
AFFINGER5における、「リンクボタン」の色設定をカスタマイズする方法
まずは、WordPress管理画面から…
↑「ランキング管理」をクリックしましょう
つづいて、左側のメニュー一覧から…
↑「CSS」タブをクリックします
「CSS」が開けたら…
↑ こちらの「リンクボタン」という項目で、リンクボタンの初期設定となるカラーをカスタマイズできます
まずは、1番上の…
↑「リンク文字カラー」という項目で、リンクボタンのテキスト色を指定しましょう
初期設定では、真っ白にあたる #ffffff になってます
ちなみに今回の例では、このテキスト色はこのままにします
つづいて、その下の…
↑ こちらの2項目で、「リンクボタンA」「リンクボタンB」の初期設定カラーをカスタマイズしていきます
初期設定では、それぞれ…
↑ このように赤系と水色系になってます
今回は例として…
↑ こんな配色に変えてみました
一通り設定できたら、画面右側（もしくは下側）の 保存 をクリックしましょう
プレビューで確認してみると…
↑ こんな感じに反映されました
おしまい♪
あずき🐥
関連：「AFFINGER5」の購入・導入方法を1から解説
関連：「AFFINGER5」導入後にまず行うべきステップまとめ
著者
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^