AB Pagination adds a lot of flexibility and power to the default {exp:channel:entries} pagination functionality in ExpressionEngine.
Some benefits over the standard EE pagination functionality:
AB Pagination has a single setting that lets you modify the tag prefix. By default it it set to "abp_". Changing it will modify all variables mentioned in this documentation (all conditionals, all variables). If you rename it from "abp_" to "myprefix_" for instance, {if abp_has_next} becomes {if myprefix_has_next} etc.
AB Pagination will make a bunch of additional conditionals and variables available inside the {paginate} tag pair that resides inside the {exp:channel:entries} tag.
On each page these variables are available:
On each page these conditionals are available:
The {abp_pages} tag pair has its own set of variables and conditionals, and since this is the most important tag it gets its own section here in the documentation.
Flickr has probably spent a good deal of man hours perfecting their pagination so we can only assume it's about as good as it gets(?). On the first page Flickr's pagination looks like this:
When paginating it looks like this:
So, this means we'd like to gray out the prev/next links if we do not have any more pages. Also, we want the initial number of pagination links to be 7, and we'd like to display 3 page links on each side of the current page. We'd also need the {abp_total_entries} tag to display the number of uploads. The code would look something like this:
{paginate}
{if abp_has_previous}
<a class="next" href="{abp_previous_link}">← prev</a>
{if:else}
<span class="atStart">← prev</span>
{/if}
{abp_pages padding="2" initial_size="5"}
{if abp_is_current}
<span class="this-page">{abp_num}</span>
{if:else}
<a href="{abp_link}">{abp_num}</a>
{/if}
{/abp_pages}
{if abp_has_next}
<a class="next" href="{abp_next_link}">next →</a>
{if:else}
<span class="atStart">next →</span>
{/if}
<div class="results">({abp_total_entries} uploads)</div>
{/paginate}
If we wanted we could even throw in the {abp_entry_from} to {abp_entry_to} variables in the mix to produce text like "Displaying X to XXX of XXX results":
We want the normal rules to apply, but in addition we want to link up the last page if it isn't already linked.
Here's where we need the {if abp_last_page_not_linked} conditional - we use it to add the three dots + the link to the last page in the numbered pagination links.
{paginate}
{if abp_has_previous}
<a class="next" href="{abp_previous_link}">&larr; previous</a>
{if:else}
<span class="atStart">&larr; previous</span>
{/if}
{abp_pages padding="6"}
{if abp_is_current}
<span class="this-page">{abp_num}</span>
{if:else}
<a href="{abp_link}">{abp_num}</a>
{/if}
{/abp_pages}
{if abp_has_next}
<a class="next" href="{abp_next_link}">next &rarr;</a>
{if:else}
<span class="atStart">next &rarr;</span>
{/if}
{if abp_last_page_not_linked}
[..] <a href="{abp_last_link}">{abp_total_pages}</a>
{/if}
{/paginate}
We want to display a link to each page.
This is an easy one with AB Pagination, just set padding="no" .. check out the code:
{paginate}
{abp_pages padding="no"}
{if abp_is_current}
<span class="this-page">{abp_num}</span>
{if:else}
<a href="{abp_link}">{abp_num}</a>
{/if}
{/abp_pages}
{/paginate}
Here's a pagination example we found over at thebestdesigns.com:
AB Pagination code to implement this:
{paginate}
<span class="count-span">Page {abp_current_page_num_liber} of {abp_total_pages}</span>
{abp_pages}
{if abp_is_current}
<span class="this-page">{abp_num}</span>
{if:else}
<a href="{abp_link}">{abp_num}</a>
{/if}
{/abp_pages}
<span class="padding">...</span>
<span class="last-page"> <a href="{abp_last_link}">Last→</a> </span>
{/paginate}
Switchee is a more efficient alternative to EE's standard {if}/{else} tags. Here's an example AB Paginaiton using Switchee, courtesy of Curtis Blackwell
{!--
This will only work if embedded in another switchee tag pair.
If it's not embedded, change the {switchee} tags to {exp:switchee}.
--}
{paginate}
{switchee variable="{abp_has_previous}"}
{case value="1"}
<a class="paginate_more" href="{abp_previous_link}">←</a>
{/case}
{case value=""}
<span class="paginate_end">←</span>
{/case}
{/switchee}
{abp_pages padding="5"}
{switchee variable="{abp_is_current}"}
{case value="1"}
<span class="paginate_current">{abp_num}</span>
{/case}
{case value=""}
<a href="{abp_link}">{abp_num}</a>
{/case}
{/switchee}
{/abp_pages}
{switchee variable="{abp_has_next}"}
{case value="1"}
<a class="paginate_more" href="{abp_next_link}">→</a>
{/case}
{case value=""}
<span class="paginate_end">→</span>
{/case}
{/switchee}
{/paginate}
So far AB Pagination has been tested and found working with:
That won't work since {exp:query} will overwrite whatever pagination produced by the {exp:channel:entries} tag. Not to worry though, we have a solution for this.
Download our AB Entry IDs addon and use that instead of {exp:query}. Check out the docs for an example on how to use it with AB Pagination.