• 赤色のリンクは、まだ日本語Codexに存在しないページ・画像です。英語版と併せてご覧ください。(詳細

このWikiはいつでも誰でも編集できます

ナビゲーションメニュー

提供: WordPress Codex 日本語版
2015年7月26日 (日) 11:23時点におけるH84m (トーク | 投稿記録)による版 (テンプレートファイルに場所を追加: 部分的に翻訳しました。)

移動先: 案内検索

このページ「ナビゲーションメニュー」は未翻訳です。和訳や日本語情報を加筆してくださる協力者を求めています

ナビゲーションメニューtheme featureVersion 3.0で導入されました. WordPressのテーマにカスタマイズされたナビゲーションメニューを簡単に導入する仕組みです。テーマにメニューを組み込むためには、テーマファイルにいくつかのコードセグメントを追加する必要があります。

関数リファレンス

ナビゲーションメニューの登録
ナビゲーションメニューの表示


functions.phpを編集し、メニューを登録

まず初めに、テーマのfunctions.phpにあなたのメニューの名前を登録するためのファンクションを書く必要があります(このように、それらは管理画面の外観 -> メニューに現れます)。以下例では、メニューは「テーマロケーション」ボックスに「ヘッダメニュー」として現れるでしょう。

function register_my_menu() {
  register_nav_menu('header-menu',__( 'Header Menu' ));
}
add_action( 'init', 'register_my_menu' );

そしてこの場合は、2つのメニュー(ヘッダメニューとエクストラメニュー)が現れます。

function register_my_menus() {
  register_nav_menus(
    array(
      'header-menu' => __( 'Header Menu' ),
      'extra-menu' => __( 'Extra Menu' )
    )
  );
}
add_action( 'init', 'register_my_menus' );

テンプレートファイルに場所を追加

ここまでの作業が終了したらテーマの準備がほぼ整います。最後の準備工程は、あなたが望むメニューを選択することです。これは関連するテーマファイルで行います。たとえば、ヘッダメニューにheader.phpを選択することです。テーマから該当のファイルを開けてください、そして、どこにメニューを置きたいか決めてください。ここで使用するコードはここにあります。wp_nav_menuこれは設定する場所ごとに必要です。例えば、

<?php wp_nav_menu( array( 'theme_location' => 'header-menu' ) ); ?>

です。

あなたが確実に行わなければならない事は、theme_location が、上記の function.php の中であなたがメニューのために提供した名前を確実に指し示すように指定する事だけです。(Note that it's the header-menu being used here rather than Header Menu without a hyphen. header-menu is the name that the code understands, Header Menu is the human-readable version that you see in the admin page.)

To complete the code, you can put your extra menu someplace else. Maybe you want a menu on one of your pages, for example, and you might even want it to be jazzed up a little with a containing DIV of a certain class -

wp_nav_menu( array( 'theme_location' => 'extra-menu', 'container_class' => 'my_extra_menu_class' ) );

So you'd put the above into your Page template, and not only would the menu show up wherever you put it, it'd be styled as my_extra_menu_class so that you can work with that in CSS.

メニューパネルに戻る

この機能は、バックグランウドで実行されます。完了するためには、単に 管理画面の Appearance -> Menusに移動するだけです。 あなたのテーマで元々サポートされていないメニューについて説明している文章を参照する代わりに、テーマロケーションのオプションをみることができます。

管理画面のGUIメニュー作成機能を使ってメニューをまとめることができます。まとめたメニューに名前をつけて、一つのプルダウンメニューとして配置できます。

(新しいメニューを追加すれば、新しいナビゲーションとして表示されます。)

外部リソース

関連

ナビゲーションメニュー: register_nav_menus(), register_nav_menu(), unregister_nav_menu() /en , has_nav_menu(), wp_nav_menu(), wp_get_nav_menu_items()

テーマサポート: add_theme_support(), remove_theme_support(), current_theme_supports()
テーマ機能: サイドバー, ナビゲーションメニュー, 投稿フォーマット, 投稿サムネイル, カスタム背景, カスタムヘッダー, 自動フィードリンク, html5, コンテンツ幅, editor-style



ナビゲーションメニュー: register_nav_menus(), register_nav_menu(), unregister_nav_menu() /en , has_nav_menu(), wp_nav_menu(), wp_get_nav_menu_items()

最新英語版: WordPress Codex » Navigation Menus最新版との差分


関数リファレンステンプレートタグ目次もご覧ください。