See Sanity in action 👀 Join us for a live product demo + Q&A →

Adding a preview of a singleton document on Sanity Studio using sanity-plugin-iframe-pane.

14 replies
Last updated: Feb 10, 2023
Hey friends,Can a singleton document like the home page have a preview on the studio?
Feb 10, 2023, 10:46 AM
If youre using the
and have a custom structure for your home page you can do it like this:

import {ListItemBuilder} from 'sanity/desk'
import defineStructure from '../utils/defineStructure'
import Iframe from 'sanity-plugin-iframe-pane'
import {SanityDocument} from 'sanity'

const isDev = window.location.origin === '<http://localhost:3333>';
const liveUrl = 'localUrl'
const liveUrl = 'liveUrl'

// Customise this function to show the correct URL based on the current document
function getPreviewUrl(doc: SanityDocument) {
  if (isDev) {
    return `${localUrl}`
  } else {
    return `${liveUrl}`

export default defineStructure&lt;ListItemBuilder&gt;((S) =&gt;
              url: (doc: SanityDocument) =&gt; getPreviewUrl(doc),
Feb 10, 2023, 10:52 AM
Alright thanks
user U
i will give that a try
Feb 10, 2023, 10:53 AM
hey what does defineStructure look like in the utils directory?
Feb 10, 2023, 11:41 AM
Oh, that was a bit unclear of course. The structure is based on this repo:
So you should be able to find everything concerning the structure there
Feb 10, 2023, 12:12 PM
thanks man
Feb 10, 2023, 12:13 PM
Hey sorry but i keep seeing the json of the doc on top where the title should be, is there a way to change it do you know?
Feb 10, 2023, 1:19 PM
hmm is that in the editor or in the preview mode? 🤔
Feb 10, 2023, 1:21 PM
both have this json on top
Feb 10, 2023, 1:34 PM
Feb 10, 2023, 1:35 PM
doesn't matter really
Feb 10, 2023, 1:35 PM
okey, I guess there must be something that might be setup worng 🤔 Never seen that before
Feb 10, 2023, 1:35 PM
preview section in the document was missing
Feb 10, 2023, 1:48 PM
preview: {
  select: {
    title: "title",
Feb 10, 2023, 1:49 PM
👍 👍 👍
Feb 10, 2023, 4:08 PM – build remarkable experiences at scale

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