wordpressのサイトをIE8に対応させよう!

wordpress-ie8

wordpressで制作したサイトをIE8(Internet Explorer8)で見た場合、端の方が切れていたり表示がくずれていたりする場合がある。そういった場合にも表示がくずれないように対策をする。

自分のサイトがIE8でどのように表示されているか確認する場合は下記のサイトで確認できる。

IE NetRenderer

function.phpを操作する

サイトをIE8で綺麗に表示させるにはfunctions.phpを操作する。functions.phpに次のコードを書き足そう。

<?php if (strpos($_SERVER['HTTP_USER_AGENT'],"MSIE 8")) {
header("X-UA-Compatible: IE=7");} ?>

これはブラウザがIE8だった場合、IE7で表示する、というコードだ。これでサイトをIE8で綺麗に表示する事ができた!

注意:functions.phpの扱いは注意が必要だ。記入するプログラムを間違えると表示がおかしくなる事がある。気をつけよう。

<head>タグにメタ情報を追加する

上記の方法で解決しなかった場合は別の方法でIE8での表示対策をする必要がある。

まずはhtml5shivダウンロードでhtml5.shivをダウンロードしよう。ダウンロードしたzipファイルを展開して、dist内にあるhtml5shiv.jsを好きなフォルダにアップロードしよう。

そして<head>タグ内に以下を追記しよう。

<!--[if lt IE 9]>
<script src="アップロードしたフォルダ/html5shiv.js"></script>
<![endif]-->

次にrespondダウンロードでrespondをダウンロードしよう。これも同じように、ダウンロードしたzipファイルを展開して、dist内にあるrespond.src.js】を好きなフォルダにアップロードしよう。

そして<head>タグ内に以下を追記しよう。

<script src="アップロードしたフォルダ/respond.src.js"></script>

最後に

<meta http-equiv="X-UA-Compatible" content="IE=edge">

を<head>タグ内に入力しよう。このコードは早く読み込ませたいので<head>タグ内のなるべく最初の方に記述しよう。

これでwordpressのサイトをIE8に対応させる事ができた!