WordPressでjQuery2.x系を使う場合のIE8対応をPHPの条件分岐で行う方法2015年1月6日WordPressでjQuery2.x系を使う場合のIE8対応をPHPの条件分岐で行う方法テーマカスタマイズ僕はWindowsをプライベート&仕事で使ったことはもちろんありますが、買ったことは一度もありません。理由はMac(OSX)の方が圧倒的にシンプルで便利だからです。そんな僕はIEの存在をないがしろにしがちでした。最近ふと「IE8以下対応してねぇ・・。browser)が用意されているのですが、Web制作の現場では嫌われているのをご存知でしょうか?一般的には「どれも同じ」だと思われがちなブラウザは実は得意不得意があり甲乙付けがたいのですが、IEに関しては不得意がありすぎるんですね。最新のIE10や9はまだマシなのですが、IE7,8の為にある程度の施工をしなくてはなりません。IE6対応になるとWeb制作会社では追加料金も発生するぐらいです。動きをつけるためにjQueryを利用しているのですが、IE対応の為にやるべきことがあったのでメモしておきます。src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script><![endif]-->これはおまじないですね。基本はIE=edgeをheadの一番上の方に書き、CSSの後にIE8対応の記述を書いておけばOKです。mkhmarketingWordPressでは自動でjQueryが読み込まれる仕組みになっており、自分で書いてしまうと重複してしまう問題があります。最近までよくわかっていなかったので、とりあえず自分で書いていました。JSというプラグインが動作しなくなったのでダメでした。JSはどうやらWordPress内のjQueryで動作している?ようで、バージョンを変えても動きませんでしたが、試行錯誤の結果、今回紹介するコードで動きました。WordPressではjQueryは自分で書くと重複してしまうので気をつけることと、$が使えないということは頭に入れておいておくべし。NetwebjQuery2.xは高速で軽量なライブラリなのですが、実はIE8以下には対応していません。その為、PCサイトでは2.x系を使うのは微妙なところなのですが、1.x系と2.x系ではスピードが半端無く違うため、本当は2を使いたい。いうことで、記述したコードを紹介します。?>単純にIE用には1.9.0を読み込み、IE以外(Safari,Chrome,Firefoxなど)では最新の2.0.3を読み込むというPHPの条件分岐です。※このコードはwp_head内に書いてください。これだとIE9以上でも1.x系が読み込まれてしまいますが、IEのことを信用していないのでIEは1.x系で十分ではないかと思い、まぁいいかと。JSのような問題の出るjQueryを利用したプラグインを使わない場合は素直にこう書けばいいと思います。?>このコードで読み込みを止め、IE対応のHTMLコメントで分岐をして自分でjQueryを読み込めばOKです。wp_headと同時に書いてもOKです。'2.0.3');?>スマートフォンではIE対応はしなくても良いので単純にWordPressのjQueryを食い止めて、最新版の2.0.3を読み込んでいます。1.x系と2.x系の大きな違いは読み込みスピードです。速度が明らかに違うため、迷わず2.x系を使用した方が幸せになれると思います。古いスマホだと動作が怪しいので1.x系を使うのもありだと思いますよ。1.9.0WordPressは自動的にjQueryを読み込んでいるため、重複を防ぐ必要があるスマホは迷わず2.x系が高速でおすすめブラウザバージョンを気にするなら1.x系で統一しておくと安心もちろん対策方法はJavaScriptを使ったり、他にもたくさんあると思いますが、今回は少し特殊な事例だったのでこんなコードを書いてみました。jQueryをWordPressで使う場合は少し工夫がいりますが、基本的なことを守れば問題なく使うことが出来ます。それにしてもjQueryは便利でいいですね。Theme!!ブログのデザインを変更しました。コメントをキャンセルメールアドレスが公開されることはありません。2017年の新年の挨拶と、このブログのこと。Mitsutoshi。