ワードプレスで外部CSSやjsの読み込みコードからtype属性を消す方法
最近は、外部CSSやjsの読み込み時にtype=”text/javascript”とか、type=”text/css”などとtype属性を出力していると、W3Cのバリデーターなどでエラーが出ます。HTML5では書かなくていいですよって事なんですが、これがエラーとなります。エラーって言われると、やはり消したいですよね。
普通のサイトなら、記述しなければいいだけなのですが、ワードプレスの場合は勝手に書き出されているのでちょっと面倒です。私の知る限りでは、Ver.4.9.8現在では直接type属性を記述するかどうかを指定する方法はないと思います。という事で、今回はワードプレスで外部CSSやjsの読み込みコードの不要なtype属性を消去する方法です。
～ 目次 ～
script_loader_tag / style_loader_tag
ソースは割愛しますが、基本的にはscript_loader_tagやstyle_loader_tagといったフックを使用しても削除できます。
ですが、この方法だと使用中のプラグイン内から読み込んでいるスクリプトやCSSのtype属性を削除できません。いくらやっても、type属性が残ってしまい、エラーが消えません。
読み込みコードのtype属性を消すコード
本題のtype属性の消し方ですが、下のコードをこのまんま使用中のテーマのfunctions.phpに貼り付けましょう。貼り付け位置は最終行で大丈夫ですが、最終行に”?>”と書かれた行がある場合はその行を消さないように注意して、その前に貼り付けましょう。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
add_action('wp_loaded', 'prefix_output_buffer_start'); function prefix_output_buffer_start() { ob_start("prefix_output_callback"); } add_action('shutdown', 'prefix_output_buffer_end'); function prefix_output_buffer_end() { ob_end_flush(); } function prefix_output_callback($buffer) { return preg_replace( "%[ ]type=[\'\"]text\/(javascript|css)[\'\"]%", '', $buffer ); } |
いったん出力せずに内部バッファに文字列として保存しておいて、PHPの実行終了直前に書き換えて出力する…みたいな事をやっています（だと思います…）。いろいろな環境で使用していますが、今のところすべて綺麗さっぱり消えてくれます。エラーもスッキリです。
最後に
無事に不要なtype属性は取り除けましたでしょうか。
はっきり言って、こんなのエラーでもなんでもありません。そもそも「省略しちゃってもいいよ♪」って事なので、気にする必要はまったくありません。
「どーしても気になる！」という几帳面な方やマニアの方、何を思ったかクライアントが消せと言い出しちゃった場合などなど、消す必要が発生してしまった時だけにしましょう。書いておいて何なんですが、こんな事をする必要は一切ありません。
そのうち、wp_enqueue_scriptやwp_enqueue_styleにタイプ属性を付けるか付けないかみたいなパラメータが追加されるといいですよね。
参考サイト
このページで記載したコードは、下のページの情報を参考にして（パクって）います。関数名くらい適当に書き換えればオリジナル感が出るのですが、ありがたく使わせて頂いているので、正直に書かせて頂いています。英語ですが、気になる方はどうぞ。
