概要説明
WordPress のナビゲーションメニューのリンクに、メニューの名前を title 属性として自動で付ける functions.php のコード。管理画面で 1 つずつ入れる方法、前の str_replace のやり方との違い、作業環境で確かめた結果も。
～ 目次 ～
コード：メニューの名前を title 属性にする
メニューのリンク（a タグ）に title 属性を付けると、マウスを乗せたときにメニューの名前が小さく出ます。1 つずつ入れるのが手間なときは、次のコードでメニューの名前を自動で title 属性にできます。
functions.php
/**
* メニューのリンクに title 属性を付ける（管理画面で入れていないときだけ、メニューの名前を使う）
*/
add_filter( 'nav_menu_link_attributes', function ( $atts, $item ) {
if ( empty( $atts['title'] ) ) {
$atts['title'] = wp_strip_all_tags( $item->title );
}
return $atts;
}, 10, 2 );
| 書き方 | 役目 |
|---|---|
| nav_menu_link_attributes | メニューの a タグに付ける属性（href・title など）を、配列で受け取って書き換えるフィルター |
empty( $atts['title'] ) |
管理画面で title 属性を入れたメニューは、そちらを残す |
| wp_strip_all_tags | メニューの名前にタグ（アイコンなど）が入っていても、文字だけにする |
外観 → メニュー の画面の右上「表示オプション」で「タイトル属性」に印を付けると、メニューごとに title 属性を入れる欄が出ます。数が少なければ、コードを書かずにこちらで足ります。
ソースの確認：変更前
<a href="https://（サイトの URL）/sitemap">サイトマップ</a>
ソースの確認：変更後
<a href="https://（サイトの URL）/sitemap" title="サイトマップ">サイトマップ</a>
前のやり方との違い
前はこの記事で、メニューの HTML の文字を置きかえて title を足す方法を紹介していました。
前のやり方（おすすめしない）
add_filter( 'walker_nav_menu_start_el', function ( $item_output, $item ) {
return str_replace( '">', '" title="' . $item->title . '">', $item_output );
}, 10, 2 );
| 前のやり方（文字の置きかえ） | nav_menu_link_attributes | |
|---|---|---|
| 足す場所 | 「”>」を探して置きかえる。メニューに説明やアイコンがあると、別の場所にも入るおそれがある | a タグの属性として足すので、場所を間違えない |
| 特別な文字 | 名前に「”」などがあると、HTML が崩れるおそれがある | WordPress が属性の値として書き出すので崩れない |
| 管理画面で入れた title | 二重に付くことがある | 入れたものを残す |
確かめた結果
このサイトの作業環境（WordPress 7.1）で、前のコードを外して試しました。
| 試したこと | メニューのリンク |
|---|---|
| コードなし | title 属性なし |
| 上のコードを足す | 「サイトマップ」「お問い合わせ」など、メニューの名前が title 属性に入った |
なお、title 属性はマウスを乗せたときの案内です。検索の順位が上がるような効き目は、あまり期待できません。リンクの文字そのものを分かりやすくするほうが大切です。
