Table of Contents Plus(TOC+)アンカーリンクID接頭辞をカスタマイズ
- WordPressの目次生成に、Table of Contents Plus(TOC+)を使っている
- 自動生成される、ジャンプ先となるアンカーリンクのIDを自分で制御したい
※アンカーリンクはhttps://yuki.world/xxx/#anchor_id ←コレです
そんなかたへ、自由自在・思い通りにカスタマイズする方法を紹介します。
TOC+は自動で目次を生成してくれてとても便利。
しかし、WordPress自作テーマを改修している時に「自動生成されるアンカーリンクの頭文字が数字になると不都合が出る」という状況に追い込まれ、「頭文字が数字ではなく必ず文字で始まるようにカスタマイズせねば...」となったキッカケでした。
結論、2分もあれば終わります。functions.phpへ4行コピペ追加するだけなので、簡単。
ー もくじ ー
【WordPress】Table of Contents PlusのアンカーリンクID接頭辞をカスタマイズする方法
2ステップで完了。
- functions.phpへコードをコピペ
- アンカーリンクが変わったか確認
1. functions.phpへコードをコピペ
非エンジニアのかた向けに、WordPress管理画面からfunctions.phpを編集する方法で書いていきます。
WordPress管理画面 外観 > テーマエディターをクリック。
画面右側カラムにある「テーマのための関数(functions.php)」をクリック。
以下コードをコピーします(右上のコピーボタンを押すとコピーできます)。
functions.php// toc+のアンカーリンクの頭に'toc_'を追加
function custom_toc_anchor( $anchor ) {
return 't_'.$anchor; // t_ 部分は自由に決めてOK
}
add_filter( 'toc_url_anchor_target', 'custom_toc_anchor' );解説：
上記のコードで全てのアンカーリンクの頭に"t_"が付くようになります。
全てのアンカーリンクの頭に't_'がつく
3行目のt_部分は自分の好きな文字列に変えてください。
例：return 'mokuji_'.$anchor; → アンカーリンクの頭に'mokuji_'が付く
開いている画面のfunctions.phpの最下部(どこでもOKですが、分かりやすさのため...)へ貼り付けます。
もし最終行に " ?> " のPHP閉じタグ文字がある場合は、閉じタグより上の行に貼り付けるようにしてください。閉じタグ" ?> "より下へ貼り付けてしまうと保存時にエラーになってしまいます。
以下画像例のように閉じタグ" ?> "がない場合は気にしなくて大丈夫です。
忘れずに保存し、「ファイルの編集に成功しました。」と出ればOKです。
2. アンカーリンクが変わったか確認
記事ページへアクセスして、TOC+で生成されたリンクを確認してみましょう。
無事、コピペした通りの接頭辞が全てのTOC+のリンクについていれば完了です。
参考サイトdublue.com：For developers How do I customise my anchors?
