WordPressの無限スクロールが動かない？ Ajax Pagination and Infinite Scrollが動作しない時の対処法

どうも、イソップです。

WordPressでの無限スクロール実装は、「Ajax Pagination and Infinite Scroll」というプラグインを使うと便利なんですが、
先日IE11で動作しなかったため、バグ対策をしてみました。

Ajax Pagination and Infinite Scrollとは

記事一覧ページで、Ajaxによる無限スクロールを実装できる、WordPressプラグインです。
ページの下までスクロールしたら、次のページへのリンクのコンテンツを自動的に取得して、今いるページの下に追加します。
みなさんもうお馴染みではないでしょうか。

• プラグインのデモ

設定ページから各設定が行なえて、何よりシンプル設計で便利なんですよね。

IE11やAndroidで動かない時の対処法

実はちゃんと動作テストされていないのか、IEやAndroidで動かなくて、読み込みが止まってしまうんです。
プラグインが正常に動作してくれないと困りますので、バグを解決します。

1. プラグインをダウンロードします。
2. ダウンロードしたファイル内の /js/main.js を編集します。
3. 下のコードをファイルの先頭に追記します。
4. サーバーにアップロードします。

(function () {
    function customevent ( event, params ) {
        params = params || { bubbles: false, cancelable: false, detail: undefined };
        var evt = document.createevent( 'customevent' );
        evt.initcustomevent( event, params.bubbles, params.cancelable, params.detail );
        return evt;
    }

    customevent.prototype = window.event.prototype;

    window.customevent = customevent;
})();

window.CustomEventに問題があるので、定義しなおしています。

もし動かない時に試してみてください。

参考サイト

• CustomEvent() – Web APIs | MDN