ページ毎に異なるトップメニューを表示する方法

通常、どのページ(固定ページ・個別投稿ページ・アーカイブページなど)でも、トップメニューは、管理画面上で設定したメニュー内容が表示されます。、

今回は、固定ページのみ、トップメニューの位置に、フロントページもしくは、アーカイブなどのページと異なった内容のメニューを表示する方法です。

特定の固定ページのトップメニューのみを変更する場合は、page-slug.php などのように、テンプレートファイル名を変更してください。
詳細は、WordPressCodex日本語版 などを参考にしてください。

MENU

  • カスタマイズ後のイメージ
  • 修正するテンプレート
  • カスタマイズ方法の説明
  • ご注意事項

カスタマイズ後のイメージ

トップメニューをカスタマイズ後
トップメニューをカスタマイズ後の固定ページ
フロントページ・トップメニュー・通常
フロントページ・トップメニュー・通常

修正するテンプレート

  • wp-content
    • themes
      • twentyseventeen-child
        • functions.php
        • page.php

カスタマイズ方法の説明

1. 管理画面内で、新しいメニュー位置(テーマ位置)を登録し、新しいメニューを作成

add_action( 'after_setup_theme', 'twentyseventeen_child_setup' );
function twentyseventeen_child_setup() {
  register_nav_menus( array(
    'custom'    => __( 'Custom Menu', 'twentyseventeen-child' ),
  ) );
}

上記の関数を functions.php 内に記載して、新しいメニュー位置(テーマ位置)を登録

管理画面 ⇒ 外観 ⇒ メニュー
管理画面 ⇒ 外観 ⇒ メニュー

管理画面 ⇒ 外観 ⇒ メニュー 画面で、上のように新しいメニュー位置(テーマ位置)(この記事では、「Custom Menu」という名前)が作成されていることが確認できます。

次に、管理画面 ⇒ 外観 ⇒ メニュー で、表示させたいメニューを作成してください。

2. フィルターフックで、トップメニューを、今回作成した新しいメニューに置き換え

page.php の get_header 前に、下の構文を挿入します。

add_filter( 'wp_nav_menu_args', 'modify_nav_menu_args' );
function modify_nav_menu_args( $args ) {
  $args['theme_location'] = 'custom';
  return $args;
}

theme_location を top から custom に置き換えることにより、メニューが置き換えられています。

以上で終了です。

ご注意事項

  • 当サイトでは、不具合なく動作していますが、他の条件下では、正しく動作しない可能性もありますので、ご自身の責任においてご利用ください。
  • 不具合、記載内容間違い、もしくは、ご質問等は、お気軽にご連絡ください。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です