WPのナビメニューにタイトル属性を利用したサブキャプションを出す

特にハマったわけではないが、WordPressでサイトのグローバルナビゲーション的なものを作るときにメニューごとのサブキャプション的なものをつけるためのメモ書き。

 

毎回ハードコーディングしたサブキャプション付きのグローバルナビゲーションを直接テンプレート上に書いている人向け。

記事の内容はCodexや他のサイトさんでも取り扱われているので、単にコピペでやりたい場合は他のサイトさんのほうが手っ取り早いかもしれない。

今回の記事はメニュー > 表示オプション > タイトル属性 or 説明と出してること前提だ。

 

グローバルメニューを作る際にいちいちハードコーディングでテンプレートにメニュータイトル→サブキャプションとかやるのがめんどいので、大概のところをWordPressのメニューに委ねて作れないかと思って、フックの仕様を見てちょっと試してみた。

 

よくある方法でwalker_nav_menu_start_elにフックして、説明を出してくる方法、

function theme_walker_nav_menu_start_el( $item_output, $item, $depth, $args ) {
	return preg_replace( '~(</a>)~', '<span class="sub-title">' . esc_html( $item->description ) . '</span>\1', $item_output );
}
add_action( 'walker_nav_menu_start_el', 'theme_walker_nav_menu_start_el', 10, 4 );

こんな感じなのとかあるけど、説明ってテキストエリアだから・・・

 

おおよそのサイトでサブキャプションってだいたい一行。なのに、なんでテキストエリア。一行で済むのになんで複数行。個人的にむずがゆい。

 

ってわけで他の代替案。

function user_walker_nav_menu_start_el( $item_output, $item, $depth, $args ) {
	$string = $item_output;
	$string = preg_replace( '~ title=".+?"~', '', $string );
	return preg_replace( '~(</a>)~', '<span class="sub-title">' . esc_html( $item->attr_title ) . '</span>\1', $string );
}
add_action( 'walker_nav_menu_start_el', 'theme_walker_nav_menu_start_el', 10, 4 );

ぶっちゃけそこまで気にするならタイトル属性の項目を使ったほうがしっくり来るという結論に落ち着いた。

 

上のコードはタイトル属性のポップを気にする場合に備えてそれを一応消してある。

ポップを置き換えることが必要ならば置いておいてもいいし、そうじゃなくてもいい。

 

正直、ワンオフの制作でタイトル属性とか、よほどきちんとしっかりしたサイトを作る場合じゃない限りまず気にしないしね。

 

まぁ、結局好みの問題。

 

一応、こういうやり方もあるってことで。

カテゴリ

この記事のコメント

コメントはないです。

コメントを残す

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