How to Add Previous and Next Links to Your CMS in Framer
Sep 22, 2023
Step 1: Add ID to Your Articles
First, make sure each article in your CMS has a unique ID. For example, you can assign ID 1 to Article 1, ID 2 to Article 2, and so on.
Step 2: Adding Collection Items
Within your Framer project, add two Collection items to your blog pages. These collection items will serve as placeholders for the "Previous" and "Next" links.
Step 3: Configuring the "Previous" Collection
For the "Previous" collection item, you'll need to set up a filter. Here's how:
Add a filter for the ID field.
Set the condition to "Less than."
Specify the value as the current ID of the article.
Reverse the sorting order to ensure you get the previous article.
Add a limit of 1 to fetch only one result.
Step 4: Configuring the "Next" Collection
Now, let's configure the "Next" collection item:
Add a filter for the ID field.
Set the condition to "Greater than."
Specify the value as the current ID of the article.
Add a limit of 1 to fetch only one result.
And there you have it! You've successfully added "Previous" and "Next" links to your CMS blog pages in Framer.