【MORI 様】WordPress4.9.8を使用中です。IEで挙動しなくて困っています。

制作したサイトが「IEで挙動しなくて困っています。」というご相談を頂きました。


WordpressのSEO対策ならRoot-013 Root-013ではWordPress・SEO対策・アフィリエイトなどサイト運営に関するご質問に無料でお答えしております。
WordPress SEO対策 アフィリエイト 無料相談 無料!WPインストール代行・集客サポート

WordPress4.9.8を使用中です。IEで挙動しなくて困っています。

初めまして。色々検索しましたが解決出来ません。お願いします。
WordPress4.9.8を使用してサイトをオリジナルテーマで作成し公開しました。Mac環境でSafari、Chromeでは問題ありません。
WindowsのIEでのみトップページが表示されたまま動かない、クリック出来ないという状態です。何が問題でしょうか?IEのバージョンは11でもダメでした。。。
マイクロソフトEdgeでは不具合ありません。

WordPressで使用しているプラグイン一覧を画像添付しました。

また特別難しいことはしておらず、jQueryを使用している程度です。
何が原因でしょうか?
それと今後WordPressでサイト制作する際にどのようなIE対策が効果的でしょうか?
やっと完成したと一安心した所に思わぬ問題が出てきて参っています。
よろしくお願い致します。

原因の特定方法

MORIさま
ご相談ありがとうございます!

クリックできない系はposition系のCSSが原因であることが多いとは思います。
こちら(win10環境)で確認した所、Edgeは問題ありませんでしたが、IE11では確かにスクールできるがサイト内の要素をクリックできない状態にありました。

とりあえず、

.page {
    position: relative;
    width: 100%;
    height: auto;
}

のposition記述を削除すればリンク等もクリックできるようになりました。試してみてください。(bodyにposition:relativeが効いている状態はあまり見ないのでエラーの元かも知れませんね。)

僕の環境では動作を確認できました。

制作時の注意

オリジナルテーマということで、最初はHTMLから作り始めた感じでしょうか。
そういった場合であればテーマ化する前に一度ブラウザのチェックをしても良かったかもしれませんね。
HTMLで問題が無ければ、とりあえず「WordPress化して問題が生じた」ということが分かります。

プラグインも思わぬ動作をすることがあります。(独自にCSSやJSを読み込んだりします)
プラグインを全部停止or一つずつ停止して様子を見る
これでプラグインに原因があるかどうかが分かります。

JSを切ってみる / CSSを切ってみる
ここまで試すと、HTML / CSS / JS / WPプラグイン どこに原因があるかが見えてくるでしょう。

今回はCSSをいくつか切ってみて(開発者ツールなどで読み込まないようにする)リンクがクリックできるようになったので、あとはbodyやメニュー周りのCSSを無効化して動作を見てみました。

とはいえ僕もたまたま早い段階で原因かな?と思う所を見つけられただけです。JSに原因があったらもっと時間がかかるorちょっと見ただけでは分からなかったと思います。

WordPressに限ったことではなく、エラーがあったら一つずつ可能性を検証して原因と思われる範囲を狭めていくしかないと思います。

参考にして頂ければ幸いです。

コメントをどうぞ

  1. positionの記述を削除して問題なく挙動しました!
    WordPressのトラブルではなかったのですね・・・。あまりに初歩的なミスでお恥ずかしい限りです。
    問題箇所を見つけて頂きありがとうございました。
    初心者なので今後は不具合の見つけ方なども勉強して行きたいと思います!
    また、WordPress実装前に各ブラウザで確認することも肝に命じます。
    速やかなご返答、本当にありがとうございました。今夜はぐっすり眠れそうです。笑
    また、何かあればよろしくお願いします!

    1. >MORIさま
      コメントありがとうございます!
      解決したようでなによりです。たまたま見つけられただけですが^^;

      不具合が出ると焦りますよね!
      またなにかあればご連絡ください!
      デザイン等、素敵だと思いました!

コメントを残す

メールアドレスが公開されることはありません。

wp-puzzle.com logo

コメントの前にご確認ください。

  • コメントは承認制のため、反映・表示までお時間を頂きます。
  • メールアドレス等の入力も必須ではありませんので入力の必要はありません。お気軽にどうぞ。(冷やかしは止めてね!)
  • コメントや返信があっても通知は届きませんのでご注意下さい。
  • 忙しい時はレスが遅れることもあります。
  • 当ページによる一切の不利益および損害に関し、責任を取ることはできません。