What Is Editable In Sanity
Files: sanity.config.ts, sanity/, src/config/config.toml · Skill level: Beginner
Run npm run dev:all, open the Studio at http://localhost:3333, and log in with your Sanity account. Content has one entry per language, then Site settings. Sanity has the full guide, including npm run setup for your first project. Everything below exists in English, French, and Arabic, and each language has its own documents.
Where Each Page Is Edited
All locations are under Content, then your language. Sections on this page rows change a section for that page only: a field you leave empty keeps the section’s own content. Any other section on the page comes from Sections.
| Address | Studio location | Rows in Sections on this page |
|---|---|---|
/ | Homepages > Home 1 | CTA |
/home-two/ | Homepages > Home 2 | Hero, Company, Benefits, Impact, Services, Blog, CTA, Process, Projects |
/home-three/ | Homepages > Home 3 | Hero, Logo Strip, Mission, Impact, Testimonial, Blog |
/home-four/ | Homepages > Home 4 | Hero, Tabs, Pricing, Projects, FAQ, CTA |
/about/ | Main pages > About page | Impact, Testimonial |
/services/ | Main pages > Services page | Services |
/services/{slug}/ | Services | None |
/projects/ | Main pages > Projects page | CTA |
/projects/{slug}/ | Projects | Quote |
/pricing/ | Main pages > Pricing page | Pricing, Benefits, FAQ, CTA |
/calculator/ | Main pages > Calculator page | Calculator, FAQ, CTA |
/team/ | Main pages > Team page | Team |
/careers/ | Main pages > Careers page | Benefits, Careers List, CTA, Labels, Apply |
/careers/{slug}/ | Jobs | None |
/faq/ | Main pages > FAQ page | FAQ |
/contact/ | Main pages > Contact page | Contact, Coverage, CTA |
/blog/ | Main pages > Blog page | None |
/blog/{slug}/ | Blog posts | None |
/blog/category/..., /blog/tag/... | Made from the categories and tags on Blog posts | None |
/privacy-policy/, /terms-conditions/, /components/ | Other pages | None |
| 404 | Interface labels, under Not Found | None |
Use the + button to add a service, project, job, post, author, or other page. Authors holds the writers, and Main pages > Testimonials the reviews. A new entry with only a title won’t break the site, and it builds. Its card or page shows what you filled in, and images and other fields stay empty until you add them, so fill them in before you publish. We tested this in the bundled demo content, not on a real project.
Page options: Ecozen’s Studio has no separate group with this name. A page’s options are fields in its document, such as Draft and Meta Description. Header Layout and Footer Layout are on the four homepages, and Exclude From AI on Other pages.
Sections
Sections holds one document per section, for each language. Click its row to edit it. A change there shows on every page that uses the section, unless the page changes that field in its own row.
| Section | Where it appears |
|---|---|
| Hero section | All four homepages |
| Logo strip section | /, /home-three/ |
| Company section | /, /home-two/ |
| Services section | /, /home-two/, /services/ |
| Benefits section | /, /home-two/, /services/, /pricing/, /careers/ |
| Process section | /, /home-two/ |
| Testimonial section | /, /home-three/, /home-four/, /about/, /services/ |
| Impact section | /, /home-two/, /home-three/, /about/ |
| Projects section | /home-two/, /home-four/ |
| Coverage section | /, /contact/ |
| Comparison section, Careers band section | /home-two/ |
| Statement section, Bento section, Feature slider section, Contact band section | /home-three/ |
| Tabs section, Charge speed section | /home-four/ |
| Why us section | /, /about/ |
| FAQ section | /, /home-four/, /pricing/, /calculator/, /faq/ |
| Blog section | /, /home-two/, /home-three/ |
| CTA section | Most pages, above the footer |
| Pricing section | /pricing/, /home-four/ |
| Calculator section | /calculator/, / |
| Contact section two | /contact/ |
| About intro section, Values section | /about/ |
| Mission section | /about/, /home-three/ |
| Team section | /team/ |
| Careers list section | /careers/ |
| Cookie consent | The cookie banner on every page |
| Monitoring panel | The <MonitoringPanel /> shortcode |
Site-Wide Content
- Menus, for each language: Header menu with dropdowns and mega menus, Footer links, and Legal links. See Menus for what the options do.
- Interface labels, for each language: buttons, form messages, the 404 page, footer text, and the AI labels.
- Site settings, one for the whole site, below the languages: Site (title, Base URL, logo), SEO (including AI and Local Business), Settings, Opengraph, Head for analytics tags, and Social. Settings holds the forms, Newsletter, Smooth Scroll, Animation, Cookie Consent, Page Actions, Copyright, Theme Credit, Contact Info, and the Header layout (
classic,transparent,floating, orpromo) and Footer layout (wordmark,newsletter,cta, orcontact).
Site settings apply when the site builds. While npm run dev:all runs, they apply when you publish them, and the page reloads. They don’t change as you type, and click-to-edit doesn’t reach them.
Click-to-edit also doesn’t reach option values, links, classes, icon names, or images set as a CSS background. Edit those in the form.
Plans And Attributes
At the time of writing, Sanity’s free plan allows 2,000 attributes, one for each distinct field path in your content. Ecozen’s demo content, with its images, measured 1,253 on a real project, so it fits. New fields use more. Sanity’s pricing page has the current limits.
Online Preview
Click-to-edit and draft preview work out of the box on your own computer, with npm run dev:all. To use them online, your editors need a second copy of the site running as a small Node.js server, because drafts can’t be shown from static files. A static host can’t do this. See Sanity for the steps. Without a preview server, editors online can still edit in the Studio’s forms and publish.
What We Tested
- Tested: importing the demo content into a Sanity project, and the preview server running on
localhost. - Not tested: any online host, a deployed Studio, or Netlify or Vercel functions, which this doesn’t support. We have also not tested a publish webhook end to end on any host.
- Not run by hand:
npm run setupas a new buyer from start to finish (only its dry run), uploading an image in the Studio, and editing a mega menu in the browser.
What Stays In Code
- The page routes and the order of sections on a page:
src/pages/[...lang]/ - Section and component design, colors, type scale, and fonts
- The list of languages:
src/config/language.json - Favicons, and the language settings and collection folder names in
src/config/config.toml - Which sections and fields exist: to add one, see
SKILLS.md
Do It With AI
I use the Sanity edition. Tell me where to edit [TEXT OR SETTING] in the Studio: the language entry,the document, and the field. If it comes from a section document, say which pages will change, andhow to change it on one page only. Don't change any files, and don't print anything from .env.