How to use the AI agent

An AI coding agent like Claude Code or Cursor can read your PageProofer notes, find the code behind each issue, fix it, and report back on the note. This guide covers the quickest way to get set up, then the tips and prompts that get the best results.

Getting set up

You need a paid plan and an agent that supports MCP servers.

1. Go to My Settings in PageProofer, open the AI agents tab and create a token. Copy it straight away, it’s only shown once.
2. For Claude Code, copy the command from the AI agents tab (your token is already filled in) and run it in your project folder. For other agents, add an MCP server with the URL https://app.pageproofer.com/mcp and the header Authorization: Bearer YOUR_TOKEN.
3. Start your agent in the project folder for the website and ask it about your notes.

The full setup steps, and how to keep your token safe, are in Connect an AI agent.

Talk to it in plain language

There’s no special syntax to learn. Ask the way you would ask a teammate, and name the site the first time. The agent remembers it for the rest of the conversation.

“Which PageProofer sites can I work on?”

“How many open notes are there on Northwind Coffee?”

Run the agent from the folder that holds the website’s code. It can read your notes from anywhere, but it can only find and fix the code it can see.

Find the right notes first

By default the agent looks at open notes (anything that isn’t Complete or Closed), newest first. Narrowing the list keeps the agent focused and makes its answers easier to check. You can filter by:

• Status: Feedback, Backlog, Todo, In Progress, Review, Complete or Closed
• Text: words in the note or its comments
• Tags: one or more #tags, for example “#checkout #mobile”
• Note number: “note 12” or “#12”
• Page: part of the page address, such as “/pricing”
• Assignee: notes assigned to you
• Overdue: open notes past their due date

“Show me the open notes tagged #checkout.”

“What’s assigned to me on the Northwind site?”

“List the overdue notes, oldest due date first.”

“Are there any notes about the pricing page?”

The agent fetches 25 notes at a time, and up to 100 if you ask for more. For a big backlog, work through it a tag or a page at a time.

Let it read the whole note before touching code

Ask about a note by its number and the agent reads everything on it: the feedback and every comment, the page address, the element the note was pinned to (its CSS selector and a snippet of the HTML), the reporter’s browser and window size, and any console errors and failed network requests captured with the note. It can also look at screenshots and read attached text files.

“What’s wrong in note 12? Summarise it and tell me which page it’s on.”

“Look at the screenshot on note 7 and describe what’s broken.”

“Note 7 has console errors. What do they point to?”

Tips for finding the code

• The element selector and HTML snippet are the best clues. Ask the agent to search the project for them.
• Console errors usually name a file and line number. Point the agent at them for JavaScript problems.
• The reporter’s browser and window size tell you whether it’s a mobile or browser-specific bug, so ask the agent to check the responsive styles for that breakpoint.
• Screen recordings can’t be played by the agent. If a note relies on a video, ask it to work from the comments, or add a short comment describing what the video shows.

Ask for a plan before a fix

A good habit is to have the agent find the code and explain what it intends to change before it edits anything. It costs one extra message and catches misunderstandings early.

“Find the code behind note 12 and tell me what you’d change. Don’t edit anything yet.”

“That looks right, go ahead and fix it.”

If the feedback is unclear, have the agent ask instead of guessing:

“Ask the reporter on note 9 which browser they were using.”

Report back on the note

Comments from the agent are posted as you, and everyone on the note is emailed as usual. A useful comment says what changed and where, so your team and clients can follow along.

“Comment on note 12 with what you changed and the commit hash.”

To keep a comment between your team, ask for it to be internal. Internal comments are locked so clients and guests can’t see them.

“Add an internal comment to note 5 saying this needs a design decision first.”

You can mention teammates with their @username, the same way you would in PageProofer.

Keep the workflow moving

The agent can move notes along as it works, assign them, and set due dates.

“Move note 12 to In Progress while you work on it.”

“Make note 4 high priority.”

“Assign all the open #mobile notes to Milo.”

“Make everything tagged #launch due next Friday.”

It can only assign people who have access to that site, and it works out exact dates from phrases like “next Friday” or “the 15th”.

Check the fix in the browser

Every note has a link that opens it on your website with PageProofer showing the note, and one that opens it in the dashboard. Ask for either.

“Give me the link to note 12 on the website.”

“Open note 12 in the dashboard.”

Agents that can run commands on your computer, such as Claude Code, can open the link in your browser for you. Others give you the link to click. Viewing the note on the page is the quickest way to confirm a fix, especially for layout issues.

Hand it a whole job

Once you trust the routine, give the agent a complete task:

“Work through the open #checkout notes on Northwind Coffee. For each one, find the code, fix it, commit, comment on the note with what you changed and the commit hash, then move it to Review.”

Your team sees every step in each note’s Activity tab as it happens, marked “via AI agent”.

A person closes the note

The agent can’t mark a note Complete or Closed. When it has fixed something it moves the note to Review, so someone can check the fix on the website and close it. Filtering the dashboard by Review gives you a ready-made checklist of everything the agent has worked on.

Feedback that’s easy for an agent to fix

The better the note, the better the fix. A few habits help both people and agents:

• Pin notes to the element, not the whole page, so the note carries the selector and HTML snippet.
• Add a screenshot when something looks wrong. See How do I add attachments and screenshots?.
• Tag related notes, such as #checkout or #mobile, so the agent can work through them as a batch.
• Leave console capture switched on in Site Settings unless your pages log personal data. Those errors are often the fastest route to the cause.