User Guide

Adding Pagination to an eeSiteKit Website

ExpressionEngine’s native pagination system will work within eeSiteKit; you’ll just need to add a few lines of code to your templates.

Like EE’s native pagination, this method adds pagination links to the category pages of your site. In eeSiteKit the category pages are displayed with the “kit_display/category” template. If you are looking to add “previous/next” links to your “kit_display/single_entry” template, then you’ll need a slightly different set of tags than outlined in the examples below.

Adding New Segment Conditionals: eeSiteKit adds the segment /page/ to segment_3 of your URI to trigger pagination. You will be adding a conditional to your “kit_system/index” template to check for that.

Site Name ›  Templates ›  Template Management

We recommend you make a backup of this template’s code. One quick way to do that is to copy-and-paste a duplicate of it into the “Template Notes” area just below the template editing area.

In the template “kit_system/index”, look for this complete conditional and carefully add a line or two of extra space above and below it so that you can easily edit it without breaking any of the code around it. 

{if segment_3}
{embed='kit_language/{embed:site_language}' template='kit_display/single_entry' site='{embed:site}' weblog='{embed:weblog}'}
{/if}

Now delete the conditional above, and replace it with the two conditionals below:

{if segment_3 == 'page'}{embed='kit_language/{embed:site_language}' template='kit_display/category' site='{embed:site}' weblog='{embed:weblog}'}{/if}
{if segment_3 != 'page' AND segment_3 != ''}{embed='kit_language/{embed:site_language}' template='kit_display/single_entry' site='{embed:site}' weblog='{embed:weblog}'}{/if}

Remove any empty lines and spaces you added for the purpose of easy editing, and update the template to save your changes.

Updating the Weblog Tag: Add the following parameters to the weblog tag in the “kit_display/category” template:

paginate_base="{segment_1}/{segment_2}/page" paginate="bottom"

In the same weblog tag, also remove “|pagination” from the “disable” parameter.

When you’re done, the parameter should look like this: disable=“categories|category_fields|member_data|trackbacks”

Adding the Dynamic Display Code: The code that goes inside of your weblog tag is below.

We’ve included both methods here; just delete the one you don’t want:
{paginate}

{!-- Previous / Next page example --}

{if previous_page}
<a href="{auto_path}">Previous Page</a>  
{/if}

{if next_page}
<a href="{auto_path}">Next Page</a>
{/if} 

{!-- Multi page example --}

<p>Page {current_page} of {total_pages} pages {{pagination_links}</p>

{/paginate}

When /index.php/ is removed from your URI, you’ll find this method useful. It uses this plugin to strip /index.php/ back out of the “auto_path” EE creates: 

{paginate}

{!-- Previous / Next page example --}

{if previous_page}
<a href="{exp:replace find="/index.php"}{auto_path}{/exp:replace}">Previous Page</a>  
{/if}

{if next_page}
<a href="{exp:replace find="/index.php"}{auto_path}{/exp:replace}">Next Page</a>
{/if} 

{!-- Multi page example --}

<p>Page {current_page} of {total_pages} pages {exp:replace find="/index.php"}{pagination_links}{/exp:replace}</p>

{/paginate}

In most cases, the examples above will be all you need. In some special cases though, you’ll need to have the parameter dynamic=”off” set while using pagination in order for everything to work correctly.