ajax で「次のページ」を続きに読み込む

情報を追記している場合はありますが、古い情報を訂正はしていませんので、公開年月日を参照してください。プラグイン・タグ、いずれもワードプレス・PHPのバージョン等によって動作しない場合もあります。

1ページに写真をすべて表示したいが、件数が多くなった時のために分割して「続き」を読み込むようにしたい、ということで、ajax で次のページを読み込むことは出来たのだけど、jquery masonry でレイアウトしているので、読み込みのタイミングでmasonry をリロードしないといけない。
あれこれ色々とやってみたけれど、なかなかスッキリとは解決せず…読み込み部分に条件分岐が多かったり、別のjquery プラグインを利用していたりで。

で、あれこれ検索している時に見掛けたInfinite Scroll を利用すれば良さそう? あ、ワードプレスプラグインもあるのね!

ということで、http://wordpress.org/plugins/infinite-scroll/ を利用することにした。
親要素と、読み込む子要素を指定し、コールバックを記入して、masonry にチェックで、無事に続きを読み込むことが出来ました。*下までスクロールすると自動で読み込みます。

*WordPress ページングはやめてAjaxローディングにする 参照

2017.7 追記
Ajax Load More:https://web-taiyo.com/mfn/wordpress-plugin/170608.html 参照