【THE THOR】カスタマイズメニュー【共通エリア設定】の使い方！

WordPressテーマ【THE THORザ・トール】のカスタマイズメニュー【共通エリア設定】の使い方を詳しく解説します。

【THE THOR】カスタマイズ機能マニュアル【共通エリア設定】の使い方

こちらが共通エリア設定のメニューです。

１つ１つ見ていきましょう。

【共通エリア設定の使い方】：１．ヘッダーエリア設定

ヘッダー設定

■ヘッダーのレイアウトを選択

ヘッダーのスタイルパターンを選ぶことができ、「シンプル」と「ダイナミック」の２種類から選ぶことができます。

シンプル

ダイナミック

サイトデザインに合う方を選びましょう。

■ヘッダーを固定表示するか選択

■ヘッダーのテキストカラーを選択

ヘッダーに表示する文字色を白・黒の２色から選択します。

ヘッダーの背景色によってどちらか選びましょう。

■ヘッダーの背景色を指定

ヘッダーの背景色をカラーグラフで指定します。

■ヘッダーエリアの区切り装飾を選択

「なし」「ボーダー」「シャドウ」から選びます。

グローバルメニュー設定

■グローバルメニューを表示するか選択

当ブログの場合固定ページを載せていますが、カテゴリーなどをグローバルメニューに載せるとサイトの内容が分かりやすくなります。

サブメニュー設定

■PC表示時のサブメニュー表示位置を選択

■注目ボタンのテキストを入力

■ボタンのリンク先URLを入力

サーチパネルの設定

■サーチパネルを表示するか選択

記事数が多いサイトの場合はサーチパネルがあると便利ですね。

■サーチパネル内の検索機能を選択

「複数条件検索」「キーワード検索」から選びます。

画像は「複数条件検索」の場合のサーチパネル内です。

「キーワード検索」を選択するとキーワード検索のみが表示されます。

メニューパネルの設定

■メニューパネルを表示するか選択

「表示」を選択するとハンバーガーメニューが表示されます。

■ウィジェットの見出しデザインを選択

ヘッダーエリアにウィジェットを追加した場合の見出しのデザインを選択します。

ウィジェットを追加していなければ設定する必要ありません。

■ウィジェットの見出しの色を指定

指定をしていない場合「テーマカラー」で指定している色になります。

【共通エリア設定の使い方】：２．ヘッダーボトムエリア設定［検索窓・お知らせ］

ヘッダー検索窓の表示設定

■ヘッダー検索窓を表示するか選択

「表示」を選択するとヘッダーの下の部分に検索窓が表示されます。

サーチパネルを表示しているのであれば重複してしまうので必要ないですね。

どちらかがあればいいと思います。

■注目キーワードを表示するか選択

設定した注目キーワードが表示されます。

■注目キーワードのタイトルを入力

「注目キーワード」の部分を変更できます。

■背景色を指定

サイトデザインに合う好きな背景色を指定しましょう。

ヘッダーお知らせの表示設定

■ヘッダーお知らせを表示するか選択

ヘッダーの下部分に入力設定した文章が横に流れて表示されます。

動きがあるので結構目を引きますね。

■リンク先URLを入力

リンクを貼ることもできます。

誘導したい記事やページのリンクを貼れば効果的に読者を導くことができます。

【共通エリア設定の使い方】：３．メインカラムエリア設定

メインカラムフレーム設定

■メインカラムのフレームを選択

メインカラムの記事一覧部分にフレームが付きます。

「無し」の場合

「シャドウ」フレームの場合

ウィジェット設定

メインカラムにウィジェットを追加している場合の設定なので、ウィジェットがなければ関係ありません。

【共通エリア設定の使い方】：４．サイドカラムエリア設定

サイドカラムフレーム設定

■サイドカラムのフレームを選択

無し

シャドウ

【共通エリア設定の使い方】：５．フッタートップエリア設定［CTA］

フッターCTAの表示設定

■フッターCTAを表示するか選択

表示するテキストや画像を変えることでサイトの目的に合ったCTAを作ることができます。

■見出しを入力

画像の「見出し」部分に表示される文章を入力します。

■本文を入力

画像の「本文」部分に表示される文章を入力します。

■アイキャッチ画像を登録

「アイキャッチ画像」部分に表示する画像を設定します。

■背景画像を登録

CTA全体の背景に表示する画像を設定します。

■画像のマスクを選択

背景画像にかけるマスクを選択します。

「ブラック」の場合

「ブラックメッシュ」の場合

■カラー系マスク利用時の色を指定

マスクに指定した色が反映します。

「カラー」の場合

「カラー＋画像グレー」の場合

■ボタンテキストを入力

ボタンに表示する文章を入力します。

■ボタンリンク先URLを入力

ボタンをクリックした場合のリンク先のURLを記入します。

【共通エリア設定の使い方】：６．フッターエリア設定

SNSフォロー背景色の設定

■SNSフォローエリアの背景色を指定

画像枠部分の背景色を指定します。

ウィジェット見出しデザイン設定

フッターエリアにウィジェットを追加している場合の設定になります。

コピーライトの設定

■フッターエリアのコピーライトを入力

画像の枠部分に表示するテキストを入力します。

画像は未記入の場合に表示されるコピーライトです。

■コピーライト下のリンクを表示するか選択

「表示」を選択するとした画像のものが表示されます。

【共通エリア設定の使い方】：７．固定フッターエリア設定［スマホ専用］

スマホ用固定フッターの設定

■スマホ用固定フッター表示するか選択

スマホ表示の場合のみに固定表示されるフッターです。

■スマホ用固定フッターの区切り装飾を指定

フッターの境目の仕様を指定します。

項目１の設定

■表示する項目を選択

「ホームボタン」を選択するとホームボタンが表示されます。

ホームボタンをタップするとTOPページに移動します。

自由設定リンクボタン

自分の好きなボタンをカスタマイズできます。

自由設定リンクボタン入力例

表示例

■タイトルを入力

タイトルはボタンアイコンの下に表示されます。

■リンク先URLを入力

URLを入力しないと表示されません。

■アイコンを入力

アイコン一覧から表示したいアイコンコードをコピペしてください。

項目２の設定

■表示する項目を選択

「シェアボタン」を選択するとシェアボタンが表示され、タップするとチェックを入れたSNSボタンが一覧で表示されます。

項目３の設定

■表示する項目を選択

「メニューボタン」と「自由設定リンクボタン」から選択します。

「メニューボタン」を選択するとメニューボタンが表示され、タップするとメニューパネルが表示されます。

項目４の設定

■表示する項目を選択

「電話ボタン」と「自由設定リンクボタン」から選択します。

「電話ボタン」を選択すると電話ボタンが表示されます。

■電話番号を入力

入力した電話番号に発信されます。

まとめ〜【THE THOR】カスタマイズ機能マニュアル【共通エリア設定】の使い方

【共通エリア設定】見た目の部分の設定が比較的多かったと思います。

そんなに難しい設定はなく簡単に設定することができたのではないでしょうか。

他の設定メニューの解説記事もぜひ参考にしてください。