Unlock seamless workflows and faster delivery with our latest releases - Join the deep dive

Gatsby Site - How to Make Sanity Sort Orders reflected in the Site?

16 replies
Last updated: May 25, 2021
I'm building a Gatsby site, and I'm trying to make it so that the order of items in Sanity becomes the order of items on the live site, so that a non-technical user can change the order. I can sort, and I've built custom sorts using https://www.sanity.io/docs/sort-orders , but I haven't found how to make those sorts reflected in the site. I've found sanity-plugin-order-documents, and that works great for small data sets, and I'm just wondering if there's some kind of query field I can sort by to make the Gatsby site always reflect the current Sanity sort, whether it's by hand through order-documents, a custom sort, or something standard like date. Thanks y'all!
May 25, 2021, 7:46 PM
are the items in question being sorted within an array field?
May 25, 2021, 8:13 PM
if so, i found that they are returned in the same order you see them on the screen from top to bottom (at least so far)
May 25, 2021, 8:14 PM
They're not, they're the top-level items. So far there's just one schema, and I'm trying to sort the items in the schema.
May 25, 2021, 8:17 PM
Oh sorry, do you mean sorted within an array field in Gatsby? They are mapped over to display, but not sorted
May 25, 2021, 8:18 PM
No worries! My question wasn't clear : )
Trying to figure out if the items you're trying to sort are part of an array schema within Sanity like this:
https://www.sanity.io/docs/array-type
Let's say you're displaying a bunch of cast members on a page with information on a particular film to stay consistent with the docs.

Do do that, you would create a "Cast Members" schema which is made up of a single field - an array of actors.

That creates the UI pictured in said docs where you can drag cast members into a particular order.

When you do that, I've found that the sanity API returns those cast members in the same order that you see within the Studio UI
May 25, 2021, 9:22 PM
Does that make sense?
May 25, 2021, 9:22 PM
It does, thanks for the clarification. So say I'm trying to do this with my top-level schema, maybe "Movie" in your example. Do I make a wrapper-schema that just contains a single field: an array of Movies?
May 25, 2021, 9:30 PM
yep!
May 25, 2021, 9:33 PM
Awesome! Thanks man, I appreciate your help.
May 25, 2021, 9:34 PM
other more blunt options is adding an "order" field in your existing schema which the user can set. IE 1,2,3,4
May 25, 2021, 9:34 PM
and then sorting it on the front end
May 25, 2021, 9:34 PM
Yep, that's what order-documents does, I believe
May 25, 2021, 9:35 PM
i want to say that might only do it in the sanity studio front end, but didn't read into that much
May 25, 2021, 9:35 PM
It does, but then you can set the graphQL query to sort by 'order' and it works
May 25, 2021, 9:36 PM
ah nice
May 25, 2021, 9:36 PM
Yep! Caveat: I found that the snippet they give on their page didn't work, I had to build mine out in GraphiQL and then it ran fine
May 25, 2021, 9:37 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?