Code Block Editor — for Squarespace developers, designers and site owners

Your Code Blocks look custom.
Now your client can edit them.

The text, links, images, colours and repeated items in your block become plain fields. Your client changes the price, the headline or the photo without seeing a line of code. Your design stays exactly as you built it — and you don't get the email.

Single-site licence
$30
one-time, per site — every future update included
  • Works pre-launch, in trial, or password-protected
  • Updates arrive on their own — nothing to reinstall
  • Install in under 2 minutes
  • No code required for your client
Get the licence

Code Block Editor

What's New

Updates reach your sites on their own. Your version shows next to "Edit content" in the panel.

Version 3.2

· October 9, 2026

Latest

Link to your own pages in one click

Start typing in a Link address and the Editor suggests the pages on your site — including pages that aren't in your menu, and sections you've given an anchor link. Pick one and you're done. Linking to another website still works the usual way.

Version 3.1

· October 6, 2026

Open a link in a new tab

Every link and button now has an "Open in a new tab" switch, right under its address. Switch it on and visitors keep your page open behind the link.

Version 3.0

· September 30, 2026

Images, repeat items and step-by-step undo

Choose any image on your site or in your Squarespace Asset Library, or upload a new one straight from the Editor. Add, remove and reorder repeated items like FAQ entries and cards. Undo walks back every change one step at a time, and each field has its own Undo and Redo. Dock the panel beside your page and click any part of the block to jump to its fields.

Version 2

· 2026

Edit a Code Block without touching HTML

The text, links, images and colours in your block become plain fields, with live changes as you type. Search your content and filter by type. Where your block's CSS sets a text size, give phones their own size. Revert everything in one click.

All future updates are included with every licence.
See it in action

The requests you get every month.
Handled without you.

Pick one. Each clip is the real Editor, step by step — exactly what your client will see.

Retype a heading, pick a new colour, make it bolder. The page updates as you type.

How it works

Your client sees the design.
You keep the code. They get the fields.

The Editor reads the HTML that's already in your block — written by hand or generated with AI — and turns the parts that change into plain fields. Your structure, styling and animation stay exactly as built.

Your client (or you, six months from now) edits the content. Nobody has to touch the raw code again.

What your client sees

Hourly

2 hours (or less)$25
Half Day (2–5 hrs)$29
Full Day (5+ hrs)$40
What it's built from
HTML
<!-- Hourly --> <div class="ds-card"> <h3>Hourly</h3> <ul class="ds-rate"> <li><span>2 hours (or less)</span><span cla… <li><span>Half Day (2–5 hrs)</span><span cl… <li><span>Full Day (5+ hrs)</span><span cla… </ul> </div>
What they edit — no code

Edit content

V3.2
Search your content…
All Text Color Image
HEADING
Hourly
Text type
Heading 3
PRICE
$25
Undo this edit
+ Add an item
For developers

It edits values, not your markup.

When your client changes the price, that is the only thing that changes in your code. No wrappers, no new classes, no reformatting.

Code Block · after your client's edit1 value changed
  <ul class="ds-rate">    <li><span>2 hours (or less)</span>-     <span class="price">$20</span></li>+     <span class="price">$25</span></li>    <li><span>Half Day (2–5 hrs)</span>      <span class="price">$29</span></li>

Everything else — structure, CSS, scripts, animation — stays byte for byte as you wrote it.

  • Only what's already in your HTML

    Text, links, images, colours and repeated items become fields. It can't invent a field that isn't in your code, and it never writes outside the block.

  • Your CSS and animation stay locked

    The client sees fields, never code. Where adding or removing an item could break your layout, the Editor doesn't offer it.

  • Hand-written or AI-generated

    It doesn't care how the block was made. Dense, unfamiliar output is exactly where plain fields help most.

  • A phone size, only when someone sets one

    Where your CSS sets a text size, a phone size can be added — as a single media rule for phones. Desktop stays exactly as it was.

  • The raw code, whenever you need it

    There's a developer-only way back to the HTML, explained in your tutorial. Your client never sees it.

What it does

The content layer for every Code Block.

It works with what's already in your block: the text, links, colours and images in your HTML become plain fields. Nothing is added that you didn't build. Cards marked New arrived in Version 3 — on every installed site, automatically.

Version 3.2 New

Link to your own pages in one click

Start typing in a Link address and the Editor suggests the pages on your site — including pages that aren't in your menu, and sections you've given an anchor link. Linking to another website still works the usual way.

01

Opens itself

No toolbar to find — open the Code Block's editor and the panel appears automatically.

02 New

Dock it beside your page

Dock the panel to the side and your page stays in view. Click any text, button or image in the block to jump straight to its fields — edits show as you type.

03 New

Swap images, no files sent

Every image in your block gets a field. Replace it with any image on your site or in your Squarespace Asset Library — or upload a new one. Search by filename.

04 New

Add, remove and reorder items

When your block repeats a pattern — FAQ entries, cards, testimonials — your client can add one, remove one, or drag them into a new order. Where that isn't safe for the layout, the panel says so instead.

05 New

Undo, one step at a time

Every change can be walked back in order, and the button names what it will undo — “Undo change to ‘Text color’”. Each field has its own Undo, Redo brings a change back, and Revert resets everything.

06 New

Open links in a new tab

Every link and button gets an "Open in a new tab" switch, right under its address. Leave it alone and nothing changes.

07

A separate size for phones

Where your block's CSS sets a text size, the panel offers a phone size right next to it. Change it for phones and the desktop size stays exactly as it was.

08

Reorder columns Beta

When your block has a multi-column layout, swap the columns from the panel — image on the right instead of the left — without touching the grid.

09

Search and filter

Big block, lots of fields? Search your content or filter by text, colour or image to find the one you need.

The problem

The client emails again. It is a two minute change.

Change the price from $20 to $25. Swap the headline. Replace the photo. Add one more question to the FAQ. It sits inside a Code Block, so the client cannot touch it, so it comes to you.

You do it, because invoicing fifteen minutes feels petty and because saying no costs more than saying yes. Then it happens again next month.

Client sites you look after9
Small edits per site, per year6
Minutes each, door to door15
Your hourly rate$85
Unbilled, every year
$1,148
That is 14 hours you did not invoice. Licensing those 9 sites is a one time $270. It pays for itself 4.3 times over in the first year.
Questions

Before you ask.

Only what's already inside that Code Block's HTML. The Editor reads the markup you (or your AI tool) wrote and turns whatever's in there — text, links, colours, images, repeated items — into editable fields. It can't invent a field that isn't in the code, and it never writes outside that block. Image fields can choose any image already on your site or in your Asset Library, but the change itself only ever lands in the block you're editing.
They can't reach it. Your client only ever sees plain fields — text boxes, colour pickers, image fields — never the HTML, CSS or animation behind them. Where adding or removing an item could upset a layout, the Editor doesn't offer it. And every change can be undone one step at a time, or reverted in one click.
Yes — that's one of the main reasons it exists. It doesn't care how the HTML was written or which tool generated it. It sits on top of whatever's already in the block.
Yes. Every image field has Choose from this site, which shows the images on the page, across the site, and in the Squarespace Asset Library — plus Upload an image to add a new photo (up to 20 MB) straight into the block. Nothing is stored anywhere but your own Squarespace account.
Yes — it's already on your sites. Updates arrive on their own: nothing to reinstall, no code to change. Open any Code Block and you'll see the version number next to "Edit content" at the top of the panel.
Yes. There’s a developer-only way to reveal the raw HTML whenever you need it — your client never sees it. The tutorial that comes with your licence shows you how.
Yes. It works the same regardless of whether the site is published, in a Squarespace trial, or sitting behind a password.
Yes — a 5-day trial with every feature. Enter your email under the price card and your trial code and install steps arrive in your inbox.
No. It's a one-time cost per site, and every future update is included — it arrives on its own. No dashboard, no recurring charge, no account to manage.
Each licence covers one site. If you're maintaining several client sites, you'll need one licence per site — which is exactly what the calculator above is working out for you.
No meaningful impact. The editing panel only loads when someone actually opens a Code Block to edit it — it's not doing anything on your normal, published page.
Code Block Editor

Hand over the site.
Keep the design.

$30 per site, one time. Every future update included. Install in under 2 minutes.

Get the licence