aaronksaunders/payload-custom-listview-1-2025

custom image gallery with pagination in Payload CMS using React and Next.js! In this tutorial, I walk through creating a custom list view component for a media collection, showcasing how to display images in a grid and manage navigation between pages.

Payload CMS Custom List View Example

See video here - https://youtu.be/6avHMMyM8Eg

Overview

Learn how to build a custom image gallery with pagination in Payload CMS using React and Next.js! In this tutorial, I walk through creating a custom list view component for a media collection, showcasing how to display images in a grid and manage navigation between pages.

🔗 Helpful Links

• uselistquery hook https://payloadcms.com/docs/admin/hooks#uselistquery
• List Component https://github.com/payloadcms/payload/blob/main/packages/ui/src/views/List/index.tsx#L109
• Learn more about Payload CMS: https://payloadcms.com/docs/getting-started/what-is-payload