※当ブログでは商品・サービスのリンク先にプロモーションを含みます。ご了承ください。

THE THOR

THE THORの全メニュー設定方法を解説!メニューパネルやグローバルメニューも!

アイキャッチ画像
悩める人
「THE THOR」に設置できる各種メニューの設定を、どこから行えるのか分からない。

このような悩みをお持ちの方向けの記事となっています。

 

「THE THOR」には、ヘッダーやフッター、サイドバーなど様々なエリアにメニューを配置できます。

通常のWordPressテーマは、ダッシュボードの「メニュー」画面から設定は完結しますが、「THE THOR」は一部ウィジェットやカスタマイザーの利用が必要です。

豊富なメニューが故に、設定方法が少々分かりにくくなっているので、本記事を参考にメニューを配置していくようにしましょう。

 

 

THE THOR(ザ・トール)の通常メニュー設定方法

WordPressのダッシュボードには通常、メニューを設置できる「外観 > メニュー」の設定項目が用意されています。

外観 > メニュー

 

設定できるメニューはWordPressテーマによって異なり、「THE THOR」の場合は下記通常メニューの設定が可能です。

通常メニュー一覧

  • グローバルメニュー(ヘッダーメニュー)
  • フッターメニュー
  • スマホメニューパネル

 

なお、各メニューの設置イメージとしては、下記の通りです。

グローバルメニュー(ヘッダーメニュー)

グローバルメニュー(ヘッダーメニュー)

 

フッターメニュー

フッターメニュー

 

スマホメニューパネル

スマホメニューパネル

では、順番に設置方法を見ていきましょう。

 

STEP1:新規メニューの作成

最初に新規メニューの作成を行うので、WordPressダッシュボードのメニュー設定画面(外観 > メニュー)へ遷移します。

メニュー設定画面

 

各種項目を設定していきますが、ここではグローバルメニューの作成方法を解説します。

メニューの作成画面から「メニュー名」を入力します。

「メニュー名」の入力

ここでは「グローバルメニュー」というメニュー名にしていますが、名称はサイトに表示されるわけではありません。

メニューの管理画面で表示されるだけなので、分かりやすい名称で設定しておきましょう。

 

次に、メニュー設定の項目で「ヘッダーエリア」にチェックを入れます。

「ヘッダーエリア」にチェック

フッターメニューを作成したい場合は「フッターエリア」にチェック、スマホメニューパネルを作成したい場合は「メニューパネル内エリア」にチェックを入れましょう。

なお、チェックは複数付けることが可能です。

例えば、グローバルメニューとスマホメニューパネルの構成が同じであれば、「ヘッダーエリア」と「メニューパネル内エリア」にチェックを入れ、1つのメニューとしても問題ありません。

 

最後に、「メニューを作成」ボタンをクリックし、新規作成は完了です。

「メニューを作成」ボタン

 

STEP2:メニュー構造の作成

メニューの新規作成が完了すれば、メニューの構造要素を組んでいきます。

ここでは例として、カテゴリーをグローバルメニューへ配置してみます。

カテゴリーをグローバルメニューへ配置

 

まず、メニュー作成画面の「メニュー項目を追加」から「カテゴリー」をクリックし、「すべて表示」タブを選択します。

「カテゴリー」と「すべてを表示」ボタン

 

作成済みのカテゴリー一覧が表示されるので、グローバルメニューに表示したいカテゴリーにチェックを入れ、「メニューに追加」ボタンをクリックします。

「メニューに追加」ボタン

 

追加すると、メニュー構造にカテゴリーの一覧が表示されます。

メニュー構造のカテゴリー一覧

 

グローバルメニューには、カテゴリーが上から順番に表示されます。

グローバルメニューのカテゴリー表示

 

上記グローバルメニューでは一番右に「THE THOR」のカテゴリーが表示されていますが、順番を変更することも可能です。

例えば、「THE THOR」のメニューを一番左へ移動させたい場合、「THE THOR」のカテゴリーを下記動画のように、一番上へドラッグ&ドロップしましょう。

「THE THOR」のカテゴリーの移動動画

 

最後にメニューを保存し、下記のように「THE THOR」のカテゴリーが一番左へ移動していれば、完了です。

「THE THOR」のカテゴリーが一番左へ移動

 

通常メニューの設定方法は以上となります。

 

THE THOR(ザ・トール)のメニューパネル設定方法

「THE THOR」のメニューパネルとは、パソコンの画面右上に表示される「menu」マークのことを言います。

ハンバーガーメニューと呼ばれることもありますね。

メニューパネル

なお、スマホのメニューパネルの設置方法については、先ほどの「THE THOR(ザ・トール)の通常メニュー設定方法」でご紹介しました通りです。

 

パソコンのメニューパネルの設定はウィジェットから行いますが、基本的な使い方を知りたい方は下記記事をご覧ください。

関連記事THE THOR(ザ・トール)ウィジェットのパーツ・エリア詳細を解説!

 

メニューパネルの設定方法ですが、WordPressのダッシュボード画面から「外観 > ウィジェット」と進みます。

外観 > ウィジェット

 

「メニューパネル」のウィジェットエリアがあるので、ウィジェットパーツから利用したい項目を選択します。

「メニューパネル」のウィジェットエリア

 

もし、ウィジェットエリアにカテゴリーを表示したい場合は、ウィジェットパーツから「カテゴリー」の項目を追加しましょう。

ウィジェットパーツのカテゴリーを追加

 

下記のようにカテゴリーが表示されれば完了です。

メニューパネルのカテゴリー表示

 

メニューパネルにはSNSボタンを設置できますが、設定場所はウィジェットではありません。

詳細については下記記事でご紹介しておりますので、よろしければチェックしてくださいね。

関連記事THE THOR(ザ・トール)の全てのSNS設定方法を解説!

 

THE THOR(ザ・トール)のスマホ固定フッター設定方法

スマホ固定フッターとは、画面下に常に表示されるメニューのことを言います。

例えば、下記が「THE THOR」のスマホ固定フッターです。

「THE THOR」のスマホ固定フッター

こちらのメニューについて、設定方法を解説していきます。

 

STEP1:スマホ固定フッターメニューの表示

スマホ固定フッターメニューは初期状態で非表示となっているので、表示する設定から行います。

まず、WordPressのカスタマイザーから「共通エリア設定 > 固定フッターエリア設定 [スマホ専用]」と遷移します。

共通エリア設定 > 固定フッターエリア設定 [スマホ専用]

 

「スマホ用固定フッター表示するか選択」の項目があるので、「表示」と変更しましょう。

「スマホ用固定フッター表示するか選択」の項目

 

STEP2:各種メニューボタンの設定

スマホ固定フッターには、下記5つのボタンが用意されています。

ボタン 内容
ホームボタン サイトのトップへ遷移します。
シェアボタン SNSシェアボタンを表示します。
メニューボタン メニューパネルを表示します。
電話ボタン 登録の電話番号へかける画面を表示します。
トップへ戻るボタン 表示しているページのトップへ移動します。

これらのボタンをそのまま利用することも可能ですが、自由設定リンクボタンを使えば、異なる機能を持たせられます。

例えば、個人ブログで電話ボタンを利用する方は少ないと思うので、自由設定リンクボタンでTwitterのプロフィールページへ遷移するボタンに変更してみます。

Twitterのプロフィールページへ遷移するボタン

 

スマホ固定フッター設定画面の「項目4の設定」にて、下記の通り内容を変更してください。

スマホ固定フッター設定画面の「項目4の設定」

項目名 内容
①表示する項目を選択 自由設定リンクボタンを選択します。
②電話番号を入力 電話番号は空欄とします。
③タイトルを入力 ボタン上に表示されるタイトル名です。
④リンク先URLを入力 ボタンタップ時のリンク先URLです。
⑤アイコンを入力 「アイコン一覧」ボタンから、利用したいアイコンのコードを入力します。

設定完了後、スマホ固定フッターメニューが変更されるか確認しましょう。

「公開」ボタンをクリックしても、すぐに設定内容が反映されない場合もあります。

キャッシュが残っているケースがほとんどなので、スマホのキャッシュを削除するか、少し時間を空けてから再度確認しましょう。

 

STEP3:不要なボタンの削除

ページトップへ戻るのボタンを除けば、最大4つまでボタンを表示できます。

しかし、4つもいらないという方は、ボタンを非表示にすることが可能です。

 

ここでは例として、「項目4の設定」にあたる電話ボタンを非表示にしてみます。

設定方法は至って簡単で、「表示する項目を選択」を「自由設定リンクボタン」へ変更し、3つの「自由設定リンクボタン」の項目を空欄にすれば完了です。

電話ボタンを非表示にする設定

 

メニュー設定方法は以上となります。

なお、「THE THOR」に備わっている機能について、下記記事でマニュアル化してみました。

使い方をもっと知りたいという方は、是非ご覧くださいね。

関連記事THE THOR(ザ・トール)の使い方・カスタマイズ操作マニュアル【完全版】

 

THE THOR(ザ・トール)のメニュー設定方法まとめ

「THE THOR」で利用できる各種メニューの設定方法について、解説しました。

メニューの設置位置としては、基本的なヘッダーやフッターだけでなく、スマホ固定フッターなど、多種多様です。

しかし、設定メニューがWordPressダッシュボードの至るところにあるので、設定方法を分かっていなければ、少々時間を要してしまいます。

本記事を参考にメニューの設定を手早く済ませ、記事作成に取り掛かってくださいね。

読者の見やすいサイトへ仕上げるためにも、メニューは適切に配置しておきましょう!
はらちゃん
 

-THE THOR

© 2024 アフィリエイトゼミ