Framer Component
CMS Previous / Next Page Button
Add buttons to CMS detail pages that dynamically link to the previous and next pages in your CMS collection. Useful for linking to the previous and next blog post at the end of blog pages.
Get over 60 components and code overrides for building websites with Framer!
No subscription - pay once, use forever.
Type
Code Component
Free
No
Last Updated
Jun 1, 2024
Copy and paste the component into your Framer project and use the property controls on the right side to customize and configure it for your website.
On a CMS detail page, create a CMS collection outside of the page breakpoint, then connect it using the handle on the right side of the component or by selecting it from the dropdown. Then connect the "Slug" CMS field to the "Slug" property. When you preview your project, the previous/next item from the collection list will be displayed in the component.
On the first or last CMS item, there won't be anything to display in the component. To show a placeholder when on the first or last item, connect the "Placeholder" property to a layer outside of the page breakpoint.
This component only shows one item - either the previous item or the next item. To show both on the same page, create two copies of the component and switch the Direction toggle to "Next" on one of them.