Prev Next

Example 1: Previous Next on a CMS template page

Previous and Next items on a template page based on any order rules you want

See Finsweet
Walkthrough

What we will cover

  • The structure of our CMS Collection List that holds our previous and next items

  • Why we have a contentId and what it does

  • Efficient loading of images with loadImages

  • The .prevnext() component to create a CMS powered previous and next buttons.

This walkthrough is CMS template based.

Let's go to our "Previous Next" template to see this in action.

This link will navigate to Project #7.

You'll see the previous item as #6 and the next item as #8.

If you continue clicking through to other numbers, you'll see previous next continuing to work

Clone me!

You are almost there! Clone this template by clicking the link above. Learn, play around, test, use your own content, and have fun.

You can delete all .delete-me divs! All of the How-To content is in the .clonable divs.