
Can I edit my site in Claude Design and push the changes back?
Bernard moved your site. Now the content needs work: a headline that is not landing, copy that reads like it was written for a different buyer, a section in the wrong order. You can do that in bernard’s own editor. You can also do it from Claude, which is useful when you want to see the change in context before it goes anywhere near your live site.
The prompt
“Read the homepage of my [site name] site and rebuild it as an editable mockup. Use the real copy and the real colours and fonts from the site itself, not your interpretation of the brand.”
Signed in, Get my prompt fills in your site for you. Otherwise press Copy and fill in the [bracketed] parts. First time? Connect your AI to bernard once: Use your own AI (opens in a new tab).
What you get
Claude can read your bernard site, rebuild a page as an editable design file, let you push individual changes back, and publish when you say so. The useful part is the middle: you edit a faithful copy of the page, not a wireframe, and the changes you make map back to specific elements on the real thing.
Connecting the two
Think of it as introducing Claude to your site once and giving it a specific, limited set of permissions, the same way you would add a new person to your team’s tools. You do this from your account settings: you approve the connection, and from then on Claude can see the sites you can see. Revoke it from the same place when you want to. The connection itself is explained in What can a connected AI read, check and take out of my site?, and the family overview is What can I do with Claude Design and my bernard site?.
What Claude can do once connected: look at your pages, read your styling, make changes, and publish if you ask. What it cannot do: make anything public on its own.
Every change lands in a draft first. There is a preview link for the draft you can open as many times as you like. And changes cannot quietly overwrite each other: when Claude edits a heading it checks the current wording first, and if the page has changed underneath, the edit is refused rather than stamped over work it has not seen.
The workflow
Four steps, and the middle two are where you spend your time.
- Claude reads the real page: structure, copy, and the actual colours and fonts the site uses.
- It rebuilds the page as an editable design file. You edit that.
- You tell it to push what you changed. It goes to the draft.
- You review the draft, then publish.
Step 1 matters more than it sounds. Ask Claude to build “a page like my homepage” and you get its guess at your brand. Ask it to read the real page first and you get your actual accent colour, your actual fonts, your actual words. Brand notes describe a palette in words, and words are not a colour.
What to tell Claude
Start with the import. Be specific about which site; if you have a few, the names look similar in a list.
Read the homepage of my [site name] site and rebuild it as an editable mockup. Use the real copy and the real colours and fonts from the site itself, not your interpretation of the brand.
Then edit. Change things directly in the design file, or describe what you want:
The h1 is doing too much. Split it so “[first phrase]” sits on its own line above the claim.
When you are happy, push:
Push that change back to bernard.
Claude works out which element changed and updates that one. Ask for a look first if you want it:
Dry run it first and tell me what would change.
Before publishing, get the summary:
What is in the draft right now? One page or several, and what is the net effect on the live site?
That answer is worth reading. Three separate edits to one heading show up as three changes, but the net effect on your live site is one heading. Those are different things and you want to know which you are approving. Then:
Publish it.
You get two links back: one that shows the change immediately, and your normal address, which can serve an older cached copy for a few minutes longer.
Prompts that earn their keep
Why is this heading that colour? Show me what is overriding what.
Useful when a change does not seem to take effect and you are about to blame the cache.
Read the words on every page and tell me where I have used “platform” when I mean “product”.
Cheap across a whole site, and the sort of consistency pass nobody does by hand.
Check this page does not scroll sideways on a phone, and tell me whether the body text is readable enough against its background.
Numbers, not a screenshot you squint at.
Before you change anything, show me the current wording so I can check it is the bit I think it is.
Where it stops
Photos do not travel inside the design file; they show up as empty slots you fill; ask Claude for the file itself rather than a link, because a link expires. And the blocks bernard builds itself, shop and course pages and its own sign-up forms, are edited in bernard rather than on the page (see How forms and signups work on my site). Given those forms often carry the highest-value words on the page, it is worth knowing which side of the line they sit on before you start.
Worth doing
The reason to work this way is not speed. It is that you see the change in the context of the page, on your real colours with your real type, before it touches anything public. A copy decision made in a text field and the same decision made looking at the actual hero are not the same decision.
Questions people ask
- Does anything go live while I am editing?
- No. Every change lands in your draft first. Your live site is untouched until you approve a publish, either by pressing Approve in bernard or by asking your connected Claude to publish. You can make twenty changes, look at them all on the preview link, and throw them away, and nobody outside your business will have seen anything.
- What if I or a colleague changed the page in bernard while Claude was working?
- The change is refused rather than stamped over. Before Claude replaces a heading or a paragraph, it checks the current wording. If the page has changed underneath, it stops and tells you, so it never overwrites work it has not seen.
- Do my photos come across into the design?
- Not inside the design file itself. Claude reads your page’s words, structure, colours and fonts; the photographs show up as empty slots. Ask Claude to hand you the photo file itself and drop it into the slot. Do not paste a short-lived link into the design: it expires within minutes and the slot goes blank again. Every link handed out is recorded either way.
- Which parts of a page cannot be edited this way?
- Blocks that bernard builds itself: shop and course pages, which bernard regenerates from your products and lessons, and the sign-up and registration forms it makes for you. Edit the words on those in bernard directly, or ask Claude to change them through bernard’s own form and product tools rather than the page.
- Do I need to paste a key?
- Not for Claude on the web. You press Connect in Account, sign in and press Allow. A desktop app such as Claude Desktop takes the pasted setup prompt instead. Either way you revoke it from the same place when you want to.