We're using cookies, but you can turn them off in your browser settings. Otherwise, you are agreeing to our use of cookies. Learn more in our Privacy Policy.

Pagination

Page 1 of 10
Previous Next Go to page

HTML

<div class="text-center">
    <div class="cfa-pagination-short">
        <div class="cfa-pagination-pages">Page <span class="active">1</span> of <span>10</span></div>
        <span class="previous disabled"><a href="#">Previous</a></span>
        <span class="next"><a href="#">Next</a></span>
        <span class="go-to-page">Go to page <input /><button>Go</button></span>
    </div>
</div>

Problem Being Solved

Very long sets of content may need to be paginated.

When to Use

Pagination can be used when there are performance or usability concerns about displaying dynamic content. It should primarily be used on search/browse results, or when the user must interact with long tables of dynamic content (membership approval).

When Not to Use

Pagination should not be used for non-dynamic content. If the primary concern is "the page is too long", other solutions should be pursued (content con be shortened, or broken into smaller chunks).

Formatting

  • Wherever possible, the enterprise site will forgo pagination in favor of lazy loading.
  • Pagination on search will likely be handled through Coveo. We will try to match this pattern with their code as best we can.