✨Discover storytelling in the AI age with Pixar's Matthew Luhn at Sanity Connect, May 8th—register now

Organizing documents in Sanity Studio for a custom page-builder schema type

9 replies
Last updated: Nov 24, 2021
Hey there! 🙂 I am using Sanity with NextJS and my goal is to configure Sanity Studio with page-builder functionality. My only challenge in doing this is that I have not yet found a logical/meaningful way of organising the documents created with my custom page-builder schema type. All my dynamic page documents are listed in the same document list regardless of where they belong on the sitemap. For example: pages that are subpages of subpages (like ".com/services/it-consultancy/data-analyst") end up in the same list view as top level pages (like ".com/services" or ".com/about"). This gets messy quickly with 30+ pages to be created.
How can I configure or customise Sanity Studio pane/list behaviour to sort and nest pages based on where they belong on the sitemap? Or do I need to think differently about this - is there an alternative approach that's better? Thank you very much in advance!
Nov 23, 2021, 4:40 PM
user K
I'd be curious about the hierarchy aspect of the project. We can definitely throw a couple of tips your way as we currently have a page builder built over here: https://www.userfylabs.co.uk/ in what I would consider quite a scalable way
Nov 23, 2021, 7:58 PM
Perfect, thanks for the assistance so far! 😊
user C
As per now, all pages are being generated from the same schema document (page.js). For example, using the same page-builder schema template I want to be able to create a page for ".com/services/subpage/nested-subpage" and for ".com/services". I have not applied any filtering to deskStructure.js so all these page documents (from page.js schema model) are listed inside the same view, regardless of what is specified inside the slug field. But I will experiment with this, as proposed by
user A
Nov 24, 2021, 11:13 AM
user C
Can I ask - how do you define parent pages of a new page in your system? Would you recommend using an array of "references" to other page documents in order to create the path?
Nov 24, 2021, 11:19 AM
user K
we're actually in the process of figuring out the best way of doing this ourselves. We're using this tutorial here (https://www.sanity.io/guides/hierarchies-graphs-navigation#7a89a57242da ) to form our baseline. E.g dependent on how rigid your .com/services/subpage/nested-subpage is, this might work, however if you were going to create .com/*dynamic*/subpage/nested-subpage it becomes harder.
Something else that's going to help you for understanding current path is this:
Nov 24, 2021, 11:25 AM
Nov 24, 2021, 11:30 AM
Yes, .com/*dynamic*/subpage/nested-subpage would be representative for what I want to achieve. Nice..! That slug extension looks quite useful indeed
Nov 24, 2021, 12:12 PM
Yes, .com/*dynamic*/subpage/nested-subpage would be representative for what I want to achieve. Nice..! That slug extension looks quite useful indeed
Nov 24, 2021, 12:12 PM
user C
Thank you very much for that gist. Looks like this achieves exactly what I was looking to do 🙏
Nov 24, 2021, 2:10 PM
Hey Mikkel, didn't see this come through. Glad you're getting some progress. If it's any help that slug extension is pretty good but there's some issues with the length of the slug cutting off. That being said, this might help too: https://www.sanity.io/schemas/easy-peasy-url-slug-d2400b42
I've just popped it up earlier today because I was working on it this morning and it was driving me nuts.

Good luck on the project, and please let me know how you get on
Nov 24, 2021, 2:13 PM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?