WORDPRESS

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・表示設定をカスタマイズする方法【WordPressブログ/初心者向け】

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・表示設定をカスタマイズする方法 アイキャッチ
 

あずきです🐥

このブログでも愛用中のWordPressテーマ「WING(AFFINGER5)」における…

「ブログタイトル&キャッチフレーズ」の色・表示設定をカスタマイズする方法

について、ブログ初心者さん向けに1から解説していきます

具体的には、例えば…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 top-01

↑ このような状態から…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 top-02

↑ こんな風に色を変えたり、もしくは…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 top-03

↑ こんな風に、ヘッダー背景色とセットで変えたり、もしくは…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 top-04

↑ こんな風に、配置を逆転させられるようになります

手順も超簡単!
 

さっそく見ていきましょー🐥

 

AFFINGER5における、「ブログタイトル&キャッチフレーズ」の色設定・表示設定をカスタマイズする方法

色設定のカスタマイズ

WordPress ヘッダー a-01

 

まずはWordPress管理画面から…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-1-01

↑ 外観 > カスタマイズ をクリックします

カスタマイズ画面が開けたら…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-1-02

↑「基本エリア設定」タブをクリックします

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-1-03

↑ さらに、「ヘッダーエリア」タブをクリックします

そのなかの…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-1-04

↑「サイトタイトルとキャッチフレーズの文字色」という項目で…

  • ブログタイトル
  • キャッチフレーズ

この2つのテキスト色を指定できます

変更したら、上部の「公開」ボタンで保存を忘れずに!

ちなみに今回は…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-1-05

↑ こちらの状態から…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-1-06

↑ このように、ネイビー系の文字色に変更してみました

補足

【1】WordPressの各種設定が反映されない場合、ブラウザキャッシュ(=ブラウザ側に一時保存される、以前の読み込み情報)が影響している可能性があります

 

ブラウザキャッシュの干渉を受けずに最新のページを表示させるには、「スーパーリロード」という方法がおすすめです

  • Windows → 「Ctrl+Shift+R」 ※もしくは「Shift+F5」
  • Mac → 「Command+Shift+R」

【2】上記の方法でも反映されない場合、ページキャッシュ(=サーバー側に保存される、以前の読み込み情報)が影響している可能性があります

 

ページキャッシュを自動生成するプラグイン(例 WP Fastest Cache / Autoptimize )を導入している場合、そのなかの「キャッシュ削除」ボタンを試してみてください

 
「Autoptimize」の設定方法と使い方
【2021年】「Autoptimize」の設定方法と使い方を初心者向けに解説【WordPressプラグイン/コードの最適化でサイトスピードを高速化】

続きを見る

もしくは!

同じく「ヘッダーエリア」タブ内における…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-1-07

↑ こちらの「背景色」という項目で、ブラックやネイビーなどの「濃色系」カラーを指定し、かつ「サイトタイトル&キャッチフレーズ」の文字色をホワイト系などにすると…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-1-08

↑ このようなデザインにもできます

今度は、ブログタイトル&キャッチフレーズにおける「色設定以外の表示設定」について見ていきましょう🐥

 

表示設定のカスタマイズ

WordPress ヘッダー a-02

 

まずはWordPress管理画面から…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-2-01

↑「AFFINGER5管理」をクリックします

「AFFINGER5管理」画面が開けたら…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-2-02

↑「ヘッダー」タブをクリックします

そのなかの…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-2-03

↑ こちらの「ヘッダー設定」というところで、「ブログタイトル&キャッチフレーズ」の細かい表示設定を指定できます

今回は例として…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-2-04

↑「サイト名とキャッチフレーズを上下反対にする」という項目にチェックを入れてみます

設定したら、株の「SAVE」ボタンで保存を忘れずに!

プレビューで見てみると…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-2-05

↑ こちらの状態から…

AFFINGER5で、「ブログタイトル&キャッチフレーズ」の色・配置をカスタマイズする方法 1-2-06

↑ このように、ブログタイトルとキャッチフレーズの配置が逆転されました

今回の記事はこちらの章に属しています

 第6章 デザイン 編          

全9章のTOPです

あずきのワードプレスブログ「完全初心者」ガイド

\ 当ブログで愛用しています /

ACTION AFFINGER6 バナー 01-300px

検証と改善を重ねた唯一無二のテーマ

「稼ぐ」に特化したワードプレステーマ『ACTION AFFINGER6』

今ならプラグイン「すごいもくじLITE」を期間限定で配布中!

関連:【1番の本質】ACTION AFFINGER6って実際どう?気に入ってる点・気になる点を、専業ブロガーが本気レビュー【愛用テーマ】

 
 

About me

あずきアイコン main-01 背景透過

- 専業ブロガー・フリーランス -

あずき

 

独立4年目 / 元アパレル → 歴10年

 

20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます。 普段はTwitter(@azuki_rinrin)にわりといるので、覗いてもらえると嬉しいです^^

-WORDPRESS