WordPress テンプレートタグ the_category の出力内容を HTML5 準拠にするメモです。
the_category の出力する rel属性 が HTML5 準拠ではないと気付いたので、 WordPress のフィルターフックを利用して調整しました。
ちなみに、カスタマイズ中の TwentyTwelve でこれに引っかかったのはこの部分。
TwentyTwelveに独自追加した投稿情報
※ the_category で表示させています。
このフィルターフックで動作変更する方法は以下に記載します。
スポンサーリンク
the_categoryをフィルターフックして動作変更する方法
まずフィルターフックとは何なのかという事ですが、ここでは the_category の出力がブラウザに表示される直前に 実行したい PHP 処理を追加する事と覚えておけば大体 OK だと思います。
the_category でカテゴリ名 WordPress を実行すると rel=”category tag” というコードが出力されますので、この rel 属性を HTML5 準拠に修正します。
フィルターフック前のthe_categoryの出力内容
<a href="https://worklog.be/archives/category/wordpress" title="WordPress の投稿をすべて表示" rel="category tag">WordPress</a>
この rel 属性は wp-includes/category-template.php の 163行目 で設定されています。
$rel = ( is_object( $wp_rewrite ) && $wp_rewrite->using_permalinks() ) ? 'rel="category tag"' : 'rel="category"';
category-template.php を直接変更しても良いですが WordPress のアップデートが面倒になるので、子テーマ内だけで修正するために functions.php にフィルターフックを追加します。
function replace_category_rel($url){
$url = preg_replace( '/rel="category(|[_a-zA-Z0-9\s]+)"/', 'rel="tag"', $url );
return $url;
}
add_filter( 'the_category', 'replace_category_rel', 10, 1);
※ rel=”category を含む文字列を rel=”tag” に置換。
WordPress 関数メモ
add_filter() は WordPress システム関数に、(独自処理等の) 関数を追加するための関数です。
add_filter(‘WordPress システム関数名’, ‘フィルター関数名’, ‘優先度’, ‘受け取る引数の数’) で設定します。
- WordPress システム関数名は the_XXXXX, get_XXXX 等。
- フィルター関数名には function で独自に定義したもの等。
- 優先度は数値が小さいほど処理優先度が高い。初期値は 10。
- WordPress システム関数から受け取る引数の数は任意指定。初期値は 1。
たったこれだけですが the_category の出力する rel 属性が下記のように変更できます。
フィルターフック後のthe_categoryの出力内容
<a href="https://worklog.be/archives/category/wordpress" title="WordPress の投稿をすべて表示" rel="tag">WordPress</a>
修正後は HTML5 構文チェックも無事にパスしました。(トップページのみ)
the_categoryの動作修正後
簡単ですがthe_categoryをフィルターフックして動作変更する方法は以上になります。
フィルターフックについてもっと知りたい場合は下記ページが参考になると思います。
参考にしたページ
WordPress の add_action と add_filter などのフックが分からないから調べた！
WordPress プラグイン作成前の基礎知識