カスタム投稿タイプページのときにクラスを付与する

SEO的観点からカスタムタクソノミー（カスタム分類）のスラッグをカスタム投稿タイプと同じにする

という記事を書きましたが、あれはサイトの構造のお話＆SEO的にこうしたほうがいい、というお話でした。

今回はその続きで、見栄えを気にしてみようと思います。
WordPressでは、上の記事にも書いた通り、カスタム投稿タイプとカスタムタクソノミー（カスタム分類）を別スラッグとしてデフォルト定義しています。
その考え方はグローバルメニューのクラスの付与の仕方にも出ていて、
たとえばグローバルメニューにカスタム投稿タイプを載せている場合において、そのカスタム投稿タイプに属するカスタムタクソノミーのアーカイブページを表示しているとき、選択状態を意味する current-○○○ クラスを付与してくれません。

つまり、
https://100webdesign.jp/blog/
にいるとき「blog」にcurrentクラスが付与されますが、
そのタームである「term1」にいるとき
https://100webdesign.jp/blog/term1/
ではcurrentクラスが付与されないのです。

これは困ります。

そこで、カスタム投稿タイプのページ表示時にはメニューに強制的にクラスを付与するようにして、アーカイブページでも current表示されるようにしてみます。

テーマのfunctions.phpに以下を記述。

function make_menu_current( $classes, $item ) {
	global $post;
	if ( 'blog' == get_post_type()  ){
		$classes[] = 'blog-page';
	}
    $classes = array_unique( $classes );
    return $classes;
}
add_filter( 'nav_menu_css_class', 'make_menu_current', 10, 2 );

これでカスタム投稿タイプblogのページを開いているときには、メニューにblog-pageというクラスが付与されるようになります。

あとはCSSだけの問題です。
WordPressは、カスタム投稿タイプblogのメニューに自動で menu-item-object-blogクラスを付与してくれますので、それを利用してcuurentクラスのメニューを装飾することできます。

.nav>li.menu-item-object-blog.blog-page>a{
	border-bottom:3px solid #000000;
}

上のCSSの意味は、つまり、
「カスタム投稿タイプblogのページを開いているとき、menu-item-object-blogクラスの要素にボーダーを引く」
ということですね。

---