ナビメニューのリンクにclassを追加するスニペット

2022年11月6日2022年11月7日

Man Wearing Brown Suit Jacket Mocking on White Telephone

WordPressのナビメニューの各項目にはclassが追加されています。

WordPress Developer Resources

wp_nav_menu() | Function | WordPress Developer Resources Displays a navigation menu.

多くの場合、Wordpressのナビメニュー内のリンクにはclassが付いていません。

ナビメニュー内のリンクと記事内のリンクをCSSで簡単に区別するためにclassが付いていれば便利だと思いました。

単にCSSの記述量が少なくなるメリットしかないのですが、とにかくセレクタの記述を簡単にしたかった。

classは単なる目印なので一律付けるようにします。

<?php
add_filter( 'nav_menu_link_attributes', 'wpse156165_menu_add_class', 10, 3 );

function wpse156165_menu_add_class( $atts, $item, $args ) {
    $class = 'menu-link'; // or something based on $item
    $atts['class'] = $class;
    return $atts;
}

参考：https://wordpress.stackexchange.com/questions/156165/add-custom-classes-to-anchor-in-wp-nav-menu

役に立ったら他の人にもシェア！