![](https://chiharudesign-thethor1.com/wp-content/uploads/2024/03/透過猫4-150x150.png)
今回は、WordPressテーマ「THE THOR(ザ・トール)」ロゴのカスタマイズについてお伝えします。
ロゴとは
ロゴとは「logotype」を省略したもので、イラスト化・装飾された文字・文字列のことです。
![the thor ロゴ](https://chiharudesign-thethor1.com/wp-content/uploads/2023/07/logoC.png)
THE THORでできるロゴのカスタマイズ
THE THORのロゴは、以下のカスタマイズができます。
- ロゴの登録する/しない(表示/非表示)
- ロゴの大きさ
- ロゴを設置するレイアウト
![](https://chiharudesign-thethor1.com/wp-content/uploads/2024/03/透過猫4-150x150.png)
ロゴに使う画像をあらかじめ準備してから、作業をすすめてください。
1.ロゴを登録する/しない(表示/非表示)
THE THORに登録するとロゴが表示され、登録されないとサイトタイトルが表示されます。
下記のサンプル画像を参考に、ロゴを登録する/しない(表示/非表示)を選択してください。
![](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/menu-off.png)
![スマホ ロゴを登録する](https://chiharudesign-thethor1.com/wp-content/uploads/2023/07/menu-on-sp.png)
![PC ロゴを登録しない](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/logoOff-1.png)
![スマホ ロゴを登録しない](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/logoOffSp03.png)
では、ロゴを登録する/しない(表示/非表示)のカスタマイズ手順を紹介します。
カスタマイザーを開く
- ダッシュボード
- 外観
- カスタマイズ
![ダッシュボード 外観 カスタマイズ](https://chiharudesign-thethor1.com/wp-content/uploads/2023/07/DB01-1024x573.png)
ロゴの登録する/しないの選択
- 基本設定
- サイトロゴの設定
- ロゴ画像の設定
![ロゴ 登録する/しない](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/LogoSet01-1024x573.png)
以上でロゴのロゴを登録する/しない(表示/非表示)のカスタマイズは完了です。
ロゴ画像を新しく登録するには、下記を参考にしてください。
アップロード先へ移動する
- 基本設定
- サイトロゴの設定
- ロゴ画像の設定「画像を変更」
![ロゴ 登録する/しない](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/LogoSet01-1024x573.png)
「ファイルをアップロード」をクリック
![](https://chiharudesign-thethor1.com/wp-content/uploads/2023/07/imgNew01-1024x573.png)
「ファイルを選択」をクリック
![](https://chiharudesign-thethor1.com/wp-content/uploads/2023/07/imgNew02-1024x573.png)
ロゴ画像をアップロードする
- ロゴ画像を選択
- 「アップロード」をクリック
![](https://chiharudesign-thethor1.com/wp-content/uploads/2023/07/logoUp01-1024x572.png)
ロゴ画像を選択する
- ロゴに使う画像を選択
- 「画像を選択」をクリック
![](https://chiharudesign-thethor1.com/wp-content/uploads/2023/07/logoUp02-1024x573.png)
これで画像がアップロードは完了です。
2.ロゴの大きさ
THE THORに設置できるロゴの大きさは、スマホ・PCそれぞれ3種類。
下記のサンプル画像を参考に大きさの指定をしてください。
![ロゴ PC 30px](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/30-02.png)
![ロゴ スマホ 20px](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/sp20-02.png)
![ロゴ PC 40px](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/40-02.png)
![ロゴ スマホ 25px](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/sp25-02.png)
![ロゴ PC 50px](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/50-02.png)
![ロゴ スマホ 30px](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/sp30-02.png)
では、ロゴの大きさのカスタマイズ手順を紹介します。
カスタマイザーを開く
- ダッシュボード
- 外観
- カスタマイズ
![ダッシュボード 外観 カスタマイズ](https://chiharudesign-thethor1.com/wp-content/uploads/2023/07/DB01-1024x573.png)
ロゴの高さの指定
- 基本設定
- サイトロゴの設定
- ヘッダー表示時のロゴの高さの設定
![](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/LogoSet03-1024x573.png)
以上で、ロゴの大きさのカスタマイズは完了です。
3.ロゴを設置するレイアウト
THE THORにロゴを設置できるレイアウトは、シンプル・ダイナミックの2種類。
ロゴだけでなく、メニューも連動してレイアウトが変わるので、下記サンプル画像を確認ください。
![](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/menu-off-1024x213.png)
![ロゴ レイアウト ダイナミック](https://chiharudesign-thethor1.com/wp-content/uploads/2021/07/dynamic-1024x213.png)
では、ロゴを設置するレイアウトのカスタマイズ手順を紹介します。
カスタマイザーを開く
- ダッシュボード
- 外観
- カスタマイズ
![ダッシュボード 外観 カスタマイズ](https://chiharudesign-thethor1.com/wp-content/uploads/2023/07/DB01-1024x573.png)
ロゴを設置するレイアウトの選択
- 共通エリア設定
- ヘッダーエリア設定
- ヘッダー設定
![共通エリアの設定 ヘッダーエリアの設定 ヘッダー設定](https://chiharudesign-thethor1.com/wp-content/uploads/2023/06/menuLayout01-1024x573.png)
以上で、ロゴを設置するレイアウトのカスタマイズは完了です。
以上、【THE THORロゴのカスタマイズ】初心者向に画像付きで解説でした。
お読みいただき、ありがとうございました。