Grandparent content-relationships nested content pages

Developing with Prismic
1

Hi,

Last year I posted this question about creating grandparent (or perhaps even infinite) content-relationships using a generic content-page custom type (e.g. ‘http://domain.com/contentpage-one/contentpage-two/contentpage-three’).

This is quite an important feature for our clients, as we often create large and flexible content platforms.

It was stated that a new Link Resolver was being worked on to be able to handle these relationships. Could you tell me if there is any news on this, or whether I can do this any other way? I believe Storyblok has a folder feature that allows users to structure their entries. Do you think this could be a good idea for Prismic?

Thanks in advance!

3

Hey @joep.snijders ,

We have indeed added a utility for generating multi-level routes, called the Route Resolver, which has native support in Nuxt and Next. Here's the documentation for Nuxt:

What technology are you using in your projects?

Sam

4

Hi Sam,

Thanks for your reply!

We normally use the @nuxtjs/prismic module. On the Route Resolver page it states that it only works with Slice Machine. I would rather stay clear from Slice Machine for our client websites for now.

Is there any chance Route Resolver will work without using Slice Machine?

5

Hey @joep.snijders ,

This is a great question. I had to do some tinkering myself to find out the answer :slight_smile:

Yes, you can use the Route Resolver. However, it's only available with repos on Slice Machine clusters. If you let me know your repo name, I can make sure you're on a Slice Machine cluster. (You don't need to use Slice Machine if you're on a cluster, it just makes the features available.)

So, the route resolver is actually just a query option. Here's what it looks like with a simple JavaScript implementation:

const Prismic = require('prismic-javascript')
const endpoint = 'https://sam-onboarding-nuxt-blog.cdn.prismic.io/api/v2'
const Client = Prismic.client(endpoint)

// Route resolver
const routes = JSON.stringify([
  {
    type: 'post',
    path: '/:author/:uid',
    resolvers: {
      author: 'author',
    },
  },
])

const runQuery = async () => {
  const response = await Client.query('', { routes })
  console.log(response)
}

runQuery()

Let me know if you have more questions! I'm happy to talk about it more.

Best,
Sam