# What Is Editable In Sanity

## What Is Editable In Sanity

**Files:** `sanity/`, `sanity.config.ts`, `src/config/` · **Skill level:** Beginner

Run `npm run dev:all`, open the Studio at `http://localhost:3333`, and log in. **Content** has one entry per language, then **Site settings**. The full guide is at [Sanity](../sanity/).

### Where Each Page Is Edited
These are under Content, then your language. **Sections on this page** rows change a section on that page only, and a field you leave empty keeps the section's own content. On a page with no rows, you change a section under **Sections**, which changes every page that uses it.

| Address | Studio location | Sections on this page |
| ------- | --------------- | --------------------- |
| `/` | Homepages > Home | Services Section, Call To Action Section |
| `/about/` | Main pages > About page | None |
| `/contact/` | Main pages > Contact page | None |
| `/faq/` | Main pages > FAQ page. The questions are in this document | None |
| `/pricing/` | Main pages > Pricing page. The questions come from the FAQ page | FAQ Section |
| `/team/` | Main pages > Team page. The team members are in this document | Our Team, Leadership Team |
| `/services/` | Main pages > Services page | Index Services Section, Service Details Marquee, Services Section, FAQ Section |
| `/services/{slug}/` | Services | Intro, Details, Impact |
| `/case-studies/` | Main pages > Case studies page | Index Portfolio Section |
| `/case-studies/classic/`, `/case-studies/classic-masonry/`, `/case-studies/overlay/` | Main pages > Case studies page. The layout stays in code | Index Portfolio Section |
| `/case-studies/{slug}/` | Case studies | None |
| `/career/` | Main pages > Careers page | Intro, Apply Block, Benefits, Social |
| `/career/{slug}/` | Jobs | None |
| `/blog/` | Main pages > Blog page | Settings, Single |
| `/blog/modern/` | Main pages > Blog page. The layout stays in code | Settings, Single |
| `/blog/category/...`, `/blog/page/...` | Main pages > Blog page, and the **Categories** of each post. The number of posts per page is under **Site settings > Settings > Pagination** | Settings, Single |
| `/blog/{slug}/` | Blog posts | None |
| `/blog/single-minimal/` | Blog posts, the first post. The layout stays in code | None |
| `/privacy-policy/`, `/terms-conditions/`, `/elements/` | Other pages | None |
| 404 | Interface labels > Not Found | None |
| `/llms.txt`, `/llms-full.txt`, `.md` copies | Built from your documents. The switches are in **Site settings > SEO > AI** | None |
| `/robots.txt` | **Site settings > SEO > Robots Txt** | None |

Each page also has a collapsed **Page options** group: title and description for search results, sharing image, keywords, robots, whether it appears in the sitemap and the AI-readable files, and a custom address on collection entries.

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.

### Sections
These are under Content, your language, then **Sections**, with one document for each language.

| Section | Where it appears |
| ------- | ---------------- |
| Home banner, Customers, About us, How it works, Blog section | The homepage |
| Services section | The homepage, `/services/`, and each service page |
| Portfolio section | The homepage and the case study lists |
| Testimonial section | The homepage and `/pricing/` |
| About banner, Achievements | `/about/` |
| Our team | `/about/` and `/team/` |
| Join us | `/team/` |
| Pricing section | `/pricing/` |
| Contact section, Office locations | `/contact/` |
| Our values, Career openings | `/career/` |
| Call to action | Near the bottom of most pages, including posts, case studies, jobs, and services |

**Sidebar call to action**, under **Main pages**, is the box in the sidebar of the blog list and case study pages. **Authors** are under their own entry.

### Site-Wide Content
- **Menus**, under each language: **Header menu**, **Footer quick links**, **Footer resources**, **Footer legal links**, and **Footer bottom row**. See [Menus](../../customization/menus/).
- **Interface labels**, under each language: buttons, labels, form messages, footer copy, the 404 page, and the site's tagline and description.
- **Site settings**, below the languages, one for the whole site: **Site** (title, address, logo), **SEO**, **Settings** (sticky header, brand name, forms, footer signup, copyright, theme credit, contact details, Ask AI links, smooth scroll, header button), **Opengraph**, **Head** for analytics tags, and **Social**.

Looka has one header and one footer, so a page doesn't choose a layout for them.

**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.

### 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. Looka's demo content, with its images, measured **1,013** on a real Sanity project, right after importing it. Using Live preview adds a few. That fits the free plan. New fields use more. See [Sanity's pricing](https://www.sanity.io/pricing) for current limits.

### Online Preview
Click-to-edit and draft preview online need a second copy of the site running as a small Node.js server. A static host can't do it. Without one, editors online can still edit in the Studio's forms and publish, but they don't see the page beside the form. See [Sanity](../sanity/).

### What We Tested
- **On a real Sanity project:** we imported the demo content, then edited a heading in Live preview in English and in Arabic, and published it. A draft showed in the preview after a few seconds. In a plain browser tab on `http://localhost:4321`, a published change took up to about 2 minutes to appear.
- **Fresh starts:** the first minutes after `npm run dev:all` starts can be rough while the dev server prepares its files. In 2 fresh starts, one showed `Failed to fetch dynamically imported module` and one had a heading click that opened nothing. The same checks passed on the next try. If you see either, reload the page.
- **The preview server:** on `localhost`, opened in a Studio that also ran on `localhost`. Every page answered, click-to-edit marks were on the page, and draft mode worked.
- **Not tested:** any online host, a deployed Studio, and a webhook on any host. Netlify and Vercel functions aren't supported for the preview server.
- **Also not tested:** `npm run setup` creating a brand-new project from start to finish, and `npm run remove-multilingual -- --delete-online`.

### What Stays In Code
- The page routes and the order of sections on a page: `src/pages/[...lang]/`.
- The layouts of the sample pages that each show one layout: `/case-studies/classic/`, `/case-studies/classic-masonry/`, `/case-studies/overlay/`, `/blog/modern/`, and `/blog/single-minimal/`.
- Section and component design, colors, type scale, and fonts.
- The white footer logo: `src/assets/images/logo-white.svg`.
- 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
```text
I use the Sanity edition of Looka. Tell me where to edit [WHAT I WANT TO CHANGE] in the Studio:
the language, the document, and the field. If it is a section, say whether to change it under
Sections (every page that uses it) or in a Sections on this page row (that page only). If it stays
in code, make the change, don't print or change anything in .env, then run npm run astro-check and
tell me the result.
```