Combining Jquery Quicksand with Pagination

Question

I'm trying to combine a filterable quicksand portfolio with pagination in a Wordpress website. I've searched a lot and there's some examples with a standard Wordpress pagination, but those examples load another url for the pagination and do a new query for the portfolio items. The quicksand filters only work on the items that are queries on that particular page. I would like to let the quicksand filters work on all the portfolio items, also the ones on other pages, so I need some sort of ajax pagination.

I've set up something on http://www.cofoto.tk/portfolio, the jPage pagination works, but when the filters are clicked, the content of the portfolio dynamically changes and the pagination doesn't work anymore. I would somehow like the filter to tell the pagination that the content has changed and the pagination should be re-initiated based on the content currently shown. I lack the technical skills for this particular issue and was hoping someone could help me with this.

Thanx in advance, if more information is needed please let me know.

Arne

Answer 1

I currently try to solve the same issue and found one (rather javascript-heavy) solution that would fit your needs perfectly. It uses the aforementioned "jpages" and the plugin "Filtrify" from the same author instead of Quicksand. This implementation basically updates the pagination whenever a new filter is called.

A demo can be seen here: http://luis-almeida.github.io/filtrify/jpages.html

The code lies here: https://github.com/luis-almeida/filtrify/blob/master/jpages.html

This is a rather javascript-heavy solution, so def/ test for performance. The author recommends using lazy-load on images and I would too. Hope it helped!