最近タイトルが「ちょっと」「ちょっと」ばかりですみません。
来週からちゃんとOsukiniサーバー再開できるように頑張ります…( ﾉД`)

昨日はSaaSesのWEBサイトにGoogleのサイト内検索を設置しました。
ブラウザによって位置がずれたり見え方がおかしかったりで泣きたくなった…。

「ブラウザによって」で1つ思い出したので、WordPressのプラグインのことをお話します。

WordPressのデザインがIE8で崩れる

Internet Explorer 8でこのブログを見たことがある方は知っていると思います。デザインが崩れていたことを。

スタイルシートが全然効いてないんですよ。他のブラウザでは問題ないのに、なぜこうなるのか全くわかりませんでした。ナビゲーションバーが特に無残。
「ブログを更新させることが優先」だったので、修正は後回しでそのまま更新していました。
それが今週…

直ったー！！

後から入れたプラグインが原因でした。
あれだけ悩んだのに「こんなことだったのか」と拍子抜けでしたけど…

WordPressのプラグイン「Head Cleaner」

このブログには、ヘッダやフッタを整形し最適化&高速化する「Head Cleaner」というプラグインをインストールしていました。
複数のプラグインを使っているとhead内のコードが増え、サイトが重くなる原因にもなるので、Head Cleanerでそれを防げれば、と。
WordPress › Head Cleaner « WordPress Plugins

Head Cleanerの設定項目はこんな感じになっています。

• CSS と JavaScript を、サーバ上にキャッシュする
• CSS, JS を動的生成する。
• CSS に適用するデフォルト media 属性
• 複数の CSS を結合する
• CSS を最適化する
• CSS に含まれる画像の URL を、データスキーマ URI に変換する
• 複数の JavaScript を結合する
• JavaScript を小さくする
• フッタ領域の JavaScript も対象にする
• 内の JavaScript を、フッタ領域に移動
• Google Ajax Libraries を利用する
• XML宣言を付与
• メタタグ “canonical” を追加
• OGP(Open Graph Protocol) 対応のメタタグを追加
• メタタグ “generator” を削除
• リンクタグ “RSD” を削除
• リンクタグ “wlwmanifest” を削除
• IEコンディショナルタグを削除
• メタタグ “Last Modified” を追加
• “パラノイアモード” を有効にする。HTMLソースから無駄を省き、できるだけサイズを小さくしようとします。
• デバッグモード

この他にもフィルタの設定などありますがそこはちょっと省いて…。
私は「 内の JavaScript を、フッタ領域に移動」にチェックを入れていました。
そのチェックを外したら直ったんです。必要なコードまでheadから省かれて、デザインが読み込まれなくなっていたんですね。
jQueryが動作しないのではなくデザインが崩れた、というのがよくわかりませんが…

ちなみにWordPressのバージョンは最新の3.5.1。テンプレートは公式のTwenty Twelveです。

影響範囲をちゃんと考えずにむやみやたらと設定するものではないですね。反省。
実際にサイトが重く感じるようになってきたら見直そう、ということで、今はかなり項目を外しました。



——————–

現在初期費用無料のヘリオスシリーズ、「キャンペーンを開始したとのことで早速～」とお申し込みをいただいています。
ありがとうございます。これで夕ご飯が食べれます。

おまけ：

今日の岡ちゃん

(岡ちゃんとはSaaSesの重要人物のことです)

「今日の岡ちゃんはデータセンターへ行って大手顧客と商談中」って自分で言ってました。