🔮 Sanity Create is here. Writing is reinvented. Try now, no developer setup

Drag and drop ordering of content in Sanity.io discussed, with suggestions for implementation.

6 replies
Last updated: Apr 30, 2020
Also need to know wether you can re-order content via drag ‘n’ drop, any ideas on that?
Apr 30, 2020, 11:41 AM
Sanity has an array type field that allows drag & drop ordering of items if that’s what you’re looking for? In the attached screenshot, the little hamburger-menu-like icons to the left of the content allow you to change the order of the individual items. These items can be all kinds of things, from simple images to more complex custom input components.
Apr 30, 2020, 11:49 AM
That’s super handy… thanks! Though does that apply to content types, as in can you sort order Posts by drag/drop, or is it just within some of the components in a single Post?
Apr 30, 2020, 11:57 AM
Just to clarify, if I’m calling Posts from the frontend… I can order by date etc, can I order by ‘sort order’ which would be the result of how Posts have been ordered via Drag/Drop in the admin?
Apr 30, 2020, 12:02 PM
This would only apply to an array field inside of a Post document in this case, not the actual ordering of Posts. However, you could set up some kind of workflow where, for example, you have a singleton ‘Blog’ document and automatically add references to new posts to an array field in that document. This would essentially enable drag & drop on a list of Posts, if that’s not too far-fetched a way to go. Also depends on the amount of Posts in this case I suppose.
If you do something like what I described above, you would get the Posts in the order defined in the array field, but you would have to query this singleton document and then resolve the references from the array to get the Post content. Does that make enough sense?
Apr 30, 2020, 12:11 PM
Although it might feel a bit cumbersome, one advantage of this approach is that you can define different sort orders for different situations, so you’re not tied to a single order.
There are also sort orders you can define for a document list, but those are just for how docs are ordered inside the Studio itself, not for the front-end.

Or you could sort on the front-end side by any other field you define, but that doesn’t enable the drag & drop functionality you seem to be looking for.
Apr 30, 2020, 12:13 PM
That is a more than acceptable solution, thanks so much for taking the time to get back to me. Cheers! 🙌
Apr 30, 2020, 12:43 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?