親子ページ等でサブメニューを表示するのに、カスタムメニューをショートコードで出してみました

リニューアル案件の構築で親子関係をもつ固定ページがあったのですが、
グローバルナビに表示する程でもない・・・
メインである親ページに来たときに、サブページがあるのが分かればよい・・・
という内容だったので、

投稿内にカスタムメニューを表示しよう!!

ということになりました。

もちろん、
・親子ページ全てに静的リンクを作る
・テンプレートファイルに分岐を作って表示させる
色々と方法はありますが、

管理画面から変更したい
メニューの管理を簡単に
表示位置をある程度自由に

というご要望もあり、今回はカスタムメニューを作りつつ、
投稿(固定ページ)内にカスタムメニューをショートコードで出力する方法を採用しました。

導入例

例えば、ページ階層が
・(親)会社概要 (about)
・(子)役員紹介 (about/officer)
・(子)沿革 (about/history)
・(子)代表メッセージ (about/message)
のような場合ですね。

それぞれのページに親子ページのナビゲーションを表示したい場合があると思います。
カスタムメニューを利用することで、担当者が更新や変更をしやすくなり、
ショートコードを利用することで、表示位置の変更も簡単に行えます。
※新規子ページを作ったらショトコードを追加しなくてはいけないというデメリットもありますが。

カスタムメニューをPHPで表示するには??

では、まずカスタムメニューについて。
カスタムメニューが利用できる環境であれば、

外観 > メニュー からカスタムメニューを作成できます。

導入例にならって「about」というメニューを作成したとします。

custom-menu-shortcode01

カスタムメニューが作れないんだけど??
という人はこちらの記事が参考になりそうです。
カスタムメニュー導入から、テンプレートへの記述の仕方もあって大変親切!

記事
固定ページでカスタムメニューを実装してみよう!
URL
http://bashalog.c-brains.jp/14/06/25-150000.php

ショートコードを作るには??

まず、ショートコードを作るには、functions.phpに、以下のコードを追加します。

//ショートコード追加
function 関数名() {
wp_nav_menu( array('menu' => 'カスタムメニュー名' ));
}
add_shortcode('ショートコード文字列', '関数名');

今回の導入例から、

//ショートコード追加
function aboutNavigation() {
wp_nav_menu( array('menu' => 'about' ));
}
add_shortcode('aboutNav', 'aboutNavigation');

としてみます。

ショートコードでカスタムメニューを表示

あとは投稿内に

[aboutNav]

としてあげるだけですね!

出力されるコードを調整したい場合はコーデックス

テンプレートタグ/wp nav menu

を参考にして下さい!

コメントを残す

メールアドレスが公開されることはありません。

スパム対策にご協力ください *

コメントの前にご確認ください。なにか不具合などあればtwitterまでご連絡ください

  • 具体的なエラー画面などがある場合は添付してください。(1ファイルの上限は2メガバイト・3枚までUP可能です。)
  • メールアドレス等の入力も必須ではありませんので入力の必要はありません。お気軽にどうぞ。(冷やかしは止めてね!)
  • コメントや返信があっても通知は届きませんのでご注意下さい。
  • 忙しい時はレスが遅れることもあります。
  • 実作業は行いません。ご依頼の場合はお問い合わせからお願い致します。
  • コメントの回答による一切の不利益および損害に関し、責任を取ることはできません。(実作業をご依頼いただいた場合は別です。)