# Editing with Claude Code and Cursor

> Frontier templates are built to be edited by coding agents: settings live in a few small, commented files, class names are stable, and every page shares one header, one footer and one set of components. Here is the workflow that works.

## 1. Open the folder in your agent

Claude Code:

```shell
$ cd ~/sites/halden
$ claude
```

Cursor:

```text
File → Open Folder → halden
Open the chat in Agent mode (⌘I / Ctrl+I)
```

Codex:

```shell
$ cd ~/sites/halden
$ codex
```

## 2. Give it the map

Agents read `AGENTS.md` (Codex, Cursor and others) or `CLAUDE.md` (Claude Code) at the start of every session. Copy this into the template folder, under both names if you switch agents. It's written for Halden; for another template swap in the names its **Start here** page gives.

```markdown
# Halden template: notes for the agent

This is a static HTML site. No framework, no build step. Preview with `npx serve .`.

## Where things live
- Brand, contact details, navigation, page list, footer: the SITE object at the top of assets/site.js
- Layouts and switches (header, footer, theme, languages, cookie banner, loader): HALDEN_SETTINGS in assets/boot.js
- Colours, type, radii: CSS custom properties in assets/tokens.css. Never hard-code a colour.
- Shared parts: assets/base.css and assets/components.css. One page's styles: assets/pages.css
- The guide to all of it: start-here.html

## Rules
- Change a setting in its one place; don't copy header or footer markup into pages.
- Keep class names and data-slot attributes: scripts and the brand preview use them.
- Never invent facts about the company (customers, numbers, prices, quotes). Ask, or leave TODO.
- Check every page you touch at 1440 and 390 wide before saying it's done.
```

> The prompt pack ships its own `AGENTS.md` and `CLAUDE.md` with a full build plan; you don't need this one there. See [The prompt pack](https://frontiertemplates.com/docs/prompt-pack).

## 3. Ask for changes

Be specific about what, not how. The agent finds the file. Good first asks:

Rebrand:

```text
Rename the brand to Tidewater (legal name Tidewater Software Ltd), email hello@tidewater.vet, and use #2F7D5B as the accent. Keep the rest of the palette.
```

Pages:

```text
We only need Home V2, Pricing, Company, Careers, Contact and the legal pages. Remove the others from the menus and footer, and delete their files.
```

Layout:

```text
Switch the site to the pill header and the columns footer, default to dark mode, and turn off the loader.
```

Copy:

```text
Rewrite the home page for a vet scheduling product: headline, intro, the three features and the FAQ. Plain, warm, no jargon. Leave customer logos and quotes as TODO.
```

## 4. Check the result

- Keep a local server running (`npx serve .`) and reload after each change.
- Look at the [style guide](https://frontiertemplates.com/docs/html#design) page after any token change: it shows every component.
- Use git. `git init` before the first ask, commit after each good change, and `git diff` shows exactly what the agent did.

```
$ git init && git add -A && git commit -qm start
$ claude
> Switch to the pill header and the columns footer, default to dark mode, turn off the loader.
Read assets/boot.js
Edit assets/boot.js: header 'pill', footer 'columns', theme 'dark', loader false
Updated HALDEN_SETTINGS. Reload any page to see it.
$ git diff --stat
 assets/boot.js | 8 ++++----
```

An example session: your agent's wording will differ, but a settings change really is one file.

## Give it more design

With the [MCP server](https://frontiertemplates.com/docs/mcp-server), your agent can pull real sections, tokens and page blueprints from every Frontier template, so a page you add matches the ones you have.

---
Source: https://frontiertemplates.com/docs/claude-code-and-cursor · All guides: https://frontiertemplates.com/docs