lula

【wordpress】インフィニティスクロールをAjax Load Moreプラグインで実装

Date 2017.03.31 Category blog

WordPressプラグイン「Ajax Load More」で無限スクロールを設定

無限スクロール、インフィニティスクロールを実装する方法はいくつかありますが、wordpressで実装する場合はプラグインの「Infinite Scroll」を使用している方がおおいようですが、このプラグインの最終更新が4年前なのでなかなか導入に踏み出せず、他のプラグインがないか探したところ、良さそうなプラグインが「Ajax Load More」です。

 

「Ajax Load More」のオススメポイント

  • 設定画面は英語だが、わかりやすいインターフェイス
  • ショートコードを読み込みさせたい箇所に設置するだけ
  • カテゴリ、ターム、固定ページなど様々な条件で設定が可能
  • 無料版は読み込むテンプレートはひとつだけですが、有料版にすれば更に細かい設定が可能

 

まずはプラグインの設定より詳細設定をしてショートコードを生成する

生成されたショートコードを実装してみる

プラグインの設定画面の右側に設定した項目を反映したショートコードが生成されます、これをロードをさせたい箇所に設置するだけで動作します。

このサイトのアーカイブページに設置しているショートコードは下記です。

ただ、今回はアーカイブのテンプレートに自動でカテゴリ毎の記事を出したい!

しかもタクソノミのページにも自動で該当タクソノミのみ出したい!

それに、テンプレートにショートコードを直接設置したい!

そんな時はこれ!

プラグインダウンロードはこちら

Ajax Load More – Infinite Scroll