• 2014年3月26日

WordPressのレイアウトが崩れる ?! 何が原因?

WordPressのレイアウトが崩れる ?! 何が原因?

WordPressのレイアウトが崩れる ?! 何が原因? 424 283 パソコン生活サポート Pasonal

WordPressの特徴の一つに便利なプラグインの存在があります。

セキュリティを高めるプラウグインや、投稿機能を向上させるプラグインまで幅広く活用できるのが強みと言ってもいいでしょう。しかし、あまり沢山のプラグインをインストールすると、かえって悪い影響もあります。よくあるのが、「WordPressのレイアウトが崩れる」「jQueryが動かない」といった現象です。

今回は、その問題を解決すべく四苦八苦した経験を書きたいと思います。

>WordPressのレイアウトが崩れる ?!

WPのレイアウト崩れ

 

普段はキチンを揃っているレイアウトが何らかの原因で大きく崩れています。また、TOPページにはjQueryで画像をスライドさせているのですが、画像自体が表示されない又は動かないという現象になってしまいました。

上記のような場合、考えられるのは「プラグイン」の可能性が大きいです。特に、プラグインのバージョンアップの際に起きやすいのが原因でしょう。

 

使用しているプラグイン

使用しているプラグインはざっとこんな感じです。数は27個ほど。これを一つ一つ検証して、原因を探っていくのは骨が折れる作業です。

プラグイン名 Ver  内容
001 Prime Strategy Translate Accelerator 1.0.9 翻訳ファイルの読み込みをキャッシュ化する。
Acunetix Secure WordPress 3.0.1 脆弱性をスキャンし、セキュリティ対策を行う。
Akismet 2.6.0 言わずと知れたスパムブロック
BackUpWordPress 2.6 WordPressをフルバックアップする
Better WP Security 3.6.6 セキュリティ対策を一元管理する
Broken Link Checker 1.9.2 リンク切れを発見する
Count Per Day 3.2.9 カウンターで計測する
Crazy Bone (狂骨) 0.5.2 不正アクセスを発見する
DB Cache Reloaded Fix 2.3 データベースのやり取りをキャッシュ化する
Digg Digg 5.3.6 ソーシャル系のボタンを設置する
Download Manager 2.5.99 ファイルダウンロードを一元管理する
Google Analytics Dashboard for WP 4.2.14 カウンターで計測
Google XML Sitemaps 3.4 XNLサイトマップを生成する
head cleaner WP高速化 & 不要ヘッダーを削除
Jetpack by WordPress.com 2.9.2 WordPress.comの便利機能を一元管理する
jQuery Colorbox 4.6 イメージ画像をポップアップ表示する
Lazy Load 0.5 画像を遅延読み込みし、パフォーマンスを向上する
Limit Login Attempts 1.7.1 不正アクセスをシャットアウトする
MapPress Easy Google Maps 2.40.7 Google Mapsを使用でkるようにする
PuSHPress 0.1.7.2 Gooogleエンジンに瞬時にインデックスさせる
Trust Form 1.8.4 お問い合わせフォーム
WordPress Popular Posts 2.3.7 サムネイルをランキング表示
WordPress SEO 1.5.25 SEOを向上させる
WP Hyper Response 1.3 WordPress管理画面を高速化させる
WP Multibyte Patch 1.9 マルチバイト文字の強化
WP to Twitter 2.7.7 Twitterに自動投稿する
WPtouch Mobile Plugin 3.2.1 モバイルに自動最適化させる

 

とりあえず、どうすれば?

下記のような手順で原因であるプラグインを探っていきました。

  1. まずは、全てのプラグインを停止。
  2. プラグインを上から順番に有効化して様子をみる。
  3. 問題のプラウグインを特定する。
  4. 問題のプラグインの処遇を検討する。

 

すべてのプラグインを停止させる

どのプラグインが影響しているのか分からない場合、一度すべてのプラグインを停止して様子を見てみましょう。これで状況が改善されれば、停止させたプラグインの中に原因があります。逆に停止させても変化がない場合は、WordPress本体のファイル(phpファイルやcss)などに問題がありそうです。

 

問題のプラグインの処遇を検討する

問題であろうプラグインが見つかったら、「削除」するか「バージョンを変えて継続」するかを検討してみます。どうしても外せないプラグインなら、バージョンを変更して再度インストールしてみるのもアリだと思います。

 

原因のプラグインは?

今回検証した結果、原因であろうプラグインは以下の3つでした。

 

1.Better WP Security

Better WP Securityは確かに優れたプラグインです。WPのセキュリティを向上してくれます。しかし、このプラグインはhtaccessを勝手に書き換えたりもします。その影響で、以前は問題なく閲覧できていた記事が突然見れなくなったり、管理画面に入れない等の問題を引き起こします。

バージョンにもよると思いますが、このプラグインを利用する際は細心の注意を払う必要があります。

 

.Lazy Load

Lazy Loadは画像の描画を遅延読み込みし、ページのパフォーマンスを向上させるプラグインです。しかし、何故か、ページが完全にロードされているにも関わらず、画像が全く表示されなくなる場合があります。リンクが間違っていないのにも関わらず、画像が表示されない場合は、このプラグインが原因である可能性があります。

 

3.head cleaner

head cleanerは不要なヘッダーの削除、WPのパフォーマンスを向上するプラグインです。結構有名なプラグインなので使用している人も多いでしょう。しかし、項目の選択によっては著しくレイアウトが崩れる原因にもなり、jQueryが動かなくなることもしばしばあります。

 

上記の3つはバージョンだけを変更して継続することも考えましたが、またいつトラブルになるかわからないため、今回は削除をしました。WordPressはすごく便利だし、今では無くてはならないツールです。便利なプラグインも豊富です。しかし、プラグインのバージョンアップをすぐに行うのは細心の注意が必要です。

思わぬ原因でシステムトラブルに見舞われることになります。最近は、プラグインのバージョンアップが怖くてしかたありません。

私は、バージョンアップをする際には必ずバックアップを取っています。皆様もくれぐれもプラグインには気を付けてください!