WordPress 投稿記事内の改行タグ を HTML5 対応 に変換する

2015年8月2日

2016年1月2日

WordPress 投稿記事において使用する改行タグは というXHTML の記述方法で、HTML5 では が正しい記述方法となる（一応 でも文法的には正しいと解釈されている）。しかし WordPress では と記述しても自動的に XHTML 記述の に変換されてしまう。

この問題は改行タグだけでなく、WordPress では他にも<hr>等のタグでも XHTML 記述への自動変換という「お節介」が発生し、またヘッダー内の表記内でも XHTML 記述になっている箇所があったりなど、どうも WordPress は XHTML が基準となってしまっている。

　テーマを従来の XHTML で構築するのなら特に何の問題もないが、もし HTML5 対応のコーディングでテーマを構築する場合、正確なマークアップのためにもこれは一刻も早くどうにかしたい問題のひとつとなる。
　そこで色々と調べてみた結果、この問題は function.php への記述で対応できることが判明したので、下手に投稿記事が増えてしまう前に出来る限り早期に対処しておくことに。

Contents

1 WordPress の XHTML 記述への自動変換に対処する方法はふたつ
2 お薦めは → への自動変換
3 XHTMLとHTML5の記述混在はあまり神経質にならなくてもOK
4 参考サイト・ブログ

WordPress の XHTML 記述への自動変換に対処する方法はふたつ

タグの自動変換に対処には、主にふたつの方法がある。双方とも function.php への記述という点が変わらないが、解決のためのアプローチが異なっている。

　まずひとつ目は、WordPressの自動変換そのものを停止する方法。

remove_filter('the_content', 'convert_chars');

1	remove_filter('the_content', 'convert_chars');

WordPress では基本ファイルのひとつとなる ./wp-includes/formatting.php に記述されているふたつの関数で主な自動変換が行われている。
　変換を実行している関数は「wptexturize」と「convert_chars」のふたつで、この内 を に自動変換している関数は「convert_chars」となる。

　上記記述はこの「convert_chars」の記事（the_content）内での自動変換を停止するものだが、これを記述した場合、convert_chars が行うその他の自動変換も全て停止することになる。

もうひとつは WordPress の自動変換を停止するのではなく、既に記述済みの を記事（the_content）を読み込む際に に変換する方法。

add_filter( 'the_content', 'brHTML5' );
function brHTML5( $content ) {
    $content = str_replace('<br />', '<br>', $content);
    return $content;
}

add_filter( 'the_content', 'brHTML5' );

function brHTML5( $content ) {

$content = str_replace(' ', ' ', $content);

return $content;

}

この方法のメリットは、既に記述済みの も に自動変換してくれるため、わざわざ過去記事を手動修正する必要がないこと。新規投稿での 記述もそのまま出力してくれる。

お薦めは → への自動変換

　お薦めする主な理由は以下のふたつ。

convert_chars 関数を停止すると、その他の自動変換も停止してしまう
過去の投稿が大量にある場合、手動修正する手間がかからない

　特に自動変換の不要な停止はW ordPress の動作自体に関わってくる要素のため、WordPress の安定動作やバージョンアップ時のことを考慮に入れれば、例え自動変換停止を行うにしても可能な限り最小限の範囲で留めておいた方が無難。

また個人的な理由もひとつあり、実はこの WordPress の自動変換停止、何故か私の自作オリジナルテーマでは上手く動作しなかったから(笑)
　タグ自体はちゃんと と記述すればXHTML記述に変換することなく のまま出力してくれるのだが、何故か出力されたHTMLのソースを確認するとタグが二重（ ）になっており、これがどうやっても解決できなかった……

その後 → への自動変換の記述を試してみたら、驚くほどあっさりと問題解決。以降製作しているオリジナルテーマでは基本的に → への自動変換記述を用いることに。

もちろんこれは使用しているテーマなどの環境による部分も大きいと思われるが、不要な自動変換の停止による WordPress 本体への影響を考えると、やはりお薦めするのは → への自動変換となる。

XHTMLとHTML5の記述混在はあまり神経質にならなくてもOK

　もちろんSEO対策やコーディングの完成度、あるいは己の美意識等を究極まで突き詰めていくならその限りではないけど(笑)

　というのもHTML5はまだ完全に普及しきっているわけでなく世の主流はまだまだXHTMLで、このふたつは至る所で混在している状態になっている。
　なのでブラウザは基本どちらにも対応できるようになっており、HTML5の中にXHTML記述がある程度混在していても、ブラウザ側でその差違を吸収して適切に表示してくれるようになっている。

　もちろんあまりに支離滅裂フリーダムな記述の混在はあらゆる観点からNGだが、ごく普通にHTMLコーディングを行うのなら必要以上に神経質になる必要は全くないかと。気付いた箇所があったらその都度その部分を修正していく程度の感覚でOK。

参考サイト・ブログ

この と の問題解決において、参考にさせていただいたのは以下のサイト・ブログ。

　双方とも非常に勉強になり、かつ問題解決の決定打となってくれたので、個人的には五体倒地で感謝したいBest5に入るサイト様だったりする(笑)

It's my pc life…