MoreGallery v1 Pagination

MoreGallery is designed to work with getPage. After installing getPage from MODX.com, you will be able of paginating through your gallery by simply wrapping the mgGetImages snippet with getPage.

The minimal usage for a paginated gallery with getPage is as follows:

[[!getPage?
  &element=`mgGetImages`
]]
[[!+page.nav]]

To match it with the Foundation framework, you could add some minimal styling and markup:

<div class="text-center">
[[!getPage?
  &element=`mgGetImages`
  &limit=`2`

  &pageActiveTpl=`<li class="current"><a[[+title]] href="[[+href]]">[[+pageNo]]</a></li>`
]]
</div>

<div class="pagination-centered">
  <ul class="pagination">
    [[!+page.nav]]
  </ul>
</div>

You can find a lot more information and options specific to getPage in the getPage documentation.

If you get stuck integrating MoreGallery with getPage, feel free to contact support for help.

More information about using the mgGetImages snippet and the available properties can be found in the Snippet Usage documentation.

Using MoreGallery, getPage, a connector resource and a bit of JavaScript (jQuery) you can also create a "load more"-style functionality, which loads more images via AJAX.