Set up and configure Dashboard

Get started with Sanity Dashboard, the hub of all your content operations.

The Sanity Dashboard is the hub for your organization's content operations. Here you'll find your deployed studios, custom apps, and official Sanity apps like Canvas or Media Library.

Your dashboard is centered around your organization, and gives access to all deployed studios and apps within the organization, across projects and datasets.

For almost everyone: Your pre-dashboard studios will automatically work as before, with all your customization intact. To fully enjoy the benefits of the integrated dashboard, a studio deployment is required. Depending on your setup, this process will differ slightly.

Dashboard should mostly work with studios going all the way back to v2.28.0 (shoutout to OGs still running v2), but for the best experience we heartily recommend upgrading to @latest.

• Studio version must be:
  • At least >= v2.28.0
  • Preferably >= v3.88.1
  • Ideally @latest
• Schema and manifest files must be extracted and made available. For a detailed look at how schema deployment works, visit this article.
• Self-hosted and embedded studios must also define the canonical studio URL in the project management settings.
• For self-hosted and embedded studios that are not compiled using Sanity build tools (sanity build or sanity deploy), you'll also need to add a small bridge script to connect with the dashboard.

If you are using Sanity's hosting service, you get the most straightforward route. To set up your project to automatically generate the necessary schema and manifest files on every deployment, follow these steps:

• Make sure your project is upgraded to v3.88.1 or later of Sanity Studio. @latest is always recommended!
• Deploy your studio by running the commmand npx sanity deploy.

The Sanity CLI will automatically build your studio and manifest files and deploy them to the configured host. The manifest file should be available at <studioHost>.sanity.studio/static/create-manifest.json

If you are not using Sanity's hosting service, you will need to manually deploy your studio schema and make sure the resulting files are available at the expected location.

• Make sure your project is updated to v3.88.1 or later of Sanity Studio. @latest is always recommended!
• Generate and deploy the schema and manifest files by running npx sanity schema deploy.
• Serve the manifest files over HTTP GET from <custom-studio-url>/static/<manifest-file> (see filenames above).
• You can control where the manifest will be stored in your project by using the --manifest-dir parameter. For example, in Next.js it would be common to use npx sanity schema deploy --manifest-dir /public/static.
• Ensure the manifest files are publicly accessible on the internet without authentication.
• Add the studio URL in your project management settings.

For Next.js projects with embedded studios, you should follow the same steps as in the previous section, with a small change to how you generate the manifest files.

• Make sure your project is upgraded to v3.88.1 or later of Sanity Studio. @latest is always recommended!
• Generate the manifest files running npx sanity manifest extract. You'll need to specify a --path for the generated files that corresponds to the path of your studio relative to the root of your Next.js project. E.g., npx sanity manifest extract --path public/studio/static
• Generate and deploy your schema by running npx sanity schema deploy.
• Next.js will handle serving your manifest over HTTP GET for Dashboard when you deploy your application.
• Add the studio URL in your project management settings. Make sure you include the full path to your studio. E.g., https://cool-domain.com/admin.
• Finally, add the dashboard bridge script to your studio route as shown in the next section, and deploy your project.

For self-hosted and embedded studios that are not compiled using sanity build or sanity deploy, OR using next-sanity you will also need to add a small script to enable the dashboard to properly interact with your studios.

<script src="https://core.sanity-cdn.com/bridge.js" async type="module" />

Exactly where you should put the script will vary depending on your exact setup, but a generalized example might look as follows:

import {preloadModule} from 'react-dom'

const bridgeScript = 'https://core.sanity-cdn.com/bridge.js'

export default function StudioLayout({
  children,
}: {
  children: React.ReactNode
}) {
  preloadModule(bridgeScript, {as: 'script'})
  return (
    <>
      <script src={bridgeScript} async type="module" />
      {children}
    </>
  )
}

If you deploy your studio as part of an automated workflow, you will need to add a deploy token to your project in the Sanity project management settings and include a schema deployment step with the following command:

SANITY_AUTH_TOKEN=<deploy_token> npx sanity schema deploy

A deploy token can be obtained by navigating to the API section of your project management dashboard.