To avoid having to create a Story in Storyblok for each collection, we can make use of NextJS dynamic routing.
Let’s say you want all collections to be displayed under the
/collections route. You can create a file called
[...slug].js in a
collections folder under
fallbackoption set to
getStaticPathsfunction, otherwise NextJS will not render the page on the fly
You have two examples below:
The first and recommended way is that you check if the page has been configured in the Storyblok Visual Editor, and if so, render the Story before the
Otherwise, render the
CategoryPage component directly. This will allow anyone using Storyblok to provide template overrides for specific collections.
The second way is a minimal setup, where you only render the
CategoryPage component. This is useful if you don’t want to allow template overrides for specific collections.