SanityPress

Ready, Set, Impress.

A opinionated, fully customizable Next.js and Sanity starter template with Tailwind CSS and pre-built schema for rapid website development.

⚛️ Neutrino, 🔭 Umbra and 🍃 Foliage themes now available as a bundle!

Visit here for more Studio screenshots.

• 🖋️ Published on Sanity.io
• ⚡ Perfect Lighthouse scores on desktop and 99/100 on mobile.
• 🚀 Checkout the demo site, documentation and blog.

Table of Contents

• Key Features
• Getting Started
• Helpful Resources (The SanityPress Blog)
• External References

Key Features

• ✨ Modern Frontend Development with Next.js (App Router, RSC, Typescript) and Tailwind CSS.
• 📕 Pre-configured Sanity schema for rapid content structuring.
• 📘 Pre-built frontend components for rapid website development.
• ✏️ Visual editing right inside the Embedded Sanity Studio.
• 📜 Auto-generated Table of Contents component based on headings.
• ⌨️ Auto-generated sitemap.xml and blog rss.xml.

Getting Started

Directions are also found on the docs.

1. New repo

Clone or fork the template from the GitHub template.

2. Get a new Sanity project ID

From the Sanity.io Manage dashboard, create a new project from scratch (blank schema) with CLI.

3. Update environment variables

# .env.local
NEXT_PUBLIC_BASE_URL = ... # https://sanitypress.dev
NEXT_PUBLIC_SANITY_PROJECT_ID = ... # abcdefgh
NEXT_PUBLIC_SANITY_DATASET = ... # production
NEXT_PUBLIC_SANITY_TOKEN = ... # "Viewer" token from https://sanity.io/manage

4. Populate the Studio with your content

Open your new Sanity Studio (‌https://localhost:3000/admin) and publish the following documents:

1. a Site document with a title field.
2. a Page document with slug: index to use as the Home page.

For websites with a blog, additionally publish the following documents:

1. a Page document with slug: blog to use as the Blog listing page.
2. a Page document with slug: blog/* to use as the Blog post template page.

Optionally, you can publish the following documents:

• a Page document with slug: 404 to use as the Page not found page.

Import a demo dataset

You can run a CLI command to import demo content to get SanityPress up and running in seconds.

sanity dataset import sanity/demo.tar.gz

This will import a Site document and a Page document with slug: index, the minimum requirements for SanityPress to deploy successfully.

5. Set up deployments

Install either of the following plugins to add a widget to your Studio Dashboard:

• Vercel: sanity-plugin-dashboard-widget-vercel
• Netlify: sanity-plugin-dashboard-widget-netlify

6. Customize

Adjust frontend styles, edit/add Sanity schema and modules, and more.

External References

• The official Sanity toolkit for Next.js
• sanity-io/next-sanity README
• Visual Editing with Next.js App Router and Sanity Studio

---

Want to support future updates? Buy me a coffee ☕ or 🩷 Sponsor on GitHub!