How AI is powering better personalization in e-commerce [with Vercel]. Sign up now

How to reflect Sanity document order/sort in Gatsby site queries

16 repliesLast updated: Dec 1, 2025

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!
AI Update

I understand you're trying to connect manual ordering in Sanity Studio to your Gatsby site's display order. Let me clarify how this works, because there are actually two separate concepts at play here.

The key distinction:

To make ordering work in your Gatsby site:

The @sanity/orderable-document-list plugin adds an orderRank field to your documents when you drag and drop them in Studio. This is the field you need to sort by in your GROQ queries.

First, make sure you've added the orderRank field to your schema:

import {orderRankField} from '@sanity/orderable-document-list'

{
  name: 'yourDocumentType',
  type: 'document',
  fields: [
    orderRankField({ type: 'yourDocumentType' }),
    // ... other fields
  ]
}

Then in your Gatsby queries, sort by the orderRank field:

*[_type == "yourDocumentType"] | order(orderRank)

The orderRank field will only exist on documents that have been manually ordered using the plugin. For documents without it, you can provide a fallback:

*[_type == "yourDocumentType"] | order(orderRank asc, _createdAt desc)

This way, manually ordered documents appear first (in your chosen order), and any unordered documents follow, sorted by creation date.

Important notes:

The plugin's GitHub README has complete setup instructions, including how to configure the desk structure to enable the drag-and-drop interface.

Show original thread
16 replies

Was this answer helpful?

Sanity – Build the way you think, not the way your CMS thinks

Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.

Related contributions