Contentful
AI editing for your Contentful site.
Avocado Studio adds an AI editor and a click-to-edit live preview to a website whose content lives in Contentful. Editors change the page by describing the change or clicking it; Contentful receives only the fields that changed.
- Content store
- Contentful — a template and a working example are included
- Rich text
- Contentful Rich Text, read and written back
- Publishing
- Only the fields that changed
- Images
- The editor’s image picker searches your Contentful assets
- Framework
- Next.js 15 or 16, App Router
- Licence
- Apache-2.0, free to self-host
Edit the website, not the entry form
Contentful’s entry editor shows fields; Avocado shows the page. Editors ask for a change in chat or click a block in the live preview of your real site, review the result, and publish. The content model does not change and Contentful remains the source of truth — Avocado keeps drafts, undo history and chat in its own working copy until you publish.
Integrating an existing Next.js site? Run npm create avocado-site@latest inside it — the Contentful template is one of the options.
Rich Text and embedded entries survive
Contentful Rich Text converts into the editor’s document and back. Node and mark types are open, not a fixed list, so an embedded entry or a mark the converter has never heard of rides through the edit and comes back out unchanged instead of being thrown away.
One documented gap: Contentful has no code block, so a code block typed in the editor is stored as a code-formatted paragraph.
Publishing sends a diff
A CMS read is a projection — an asset link flattened to a URL, a reference resolved to one locale’s link — and writing it back wholesale would destroy what it was projected from. Avocado diffs the edited page against what Contentful held and writes only what changed.
- Changes a field diff cannot express safely, such as a replaced image or a new block, are reported back to you rather than guessed.
- A publish that would remove every page is refused.
Your Contentful media library in the editor
cmsMediaSource fills the editor’s image picker from your Contentful assets. Credentials stay on your server.
import { cmsMediaSource } from "@avocadostudio-ai/site-sdk/server"
// In your CmsAdapter:
getMedia: cmsMediaSource({
provider: "contentful",
spaceId: process.env.CONTENTFUL_SPACE_ID!,
deliveryToken: process.env.CONTENTFUL_DELIVERY_TOKEN!,
})FAQ
Contentful: common questions
Is Avocado Studio made by Contentful?
No. Avocado Studio is an independent open-source project, licensed Apache-2.0, that works with Contentful through its APIs.
Do I have to change my Contentful content model?
No. A small adapter maps your entries to pages and blocks for the editor and maps edits back as field changes. Your content types stay as they are.
Will AI edits break my Rich Text or embedded entries?
No. Unknown nodes, including embedded entries, pass through the edit unchanged, and publishing writes only the fields that changed.
Can marketers edit a Contentful site without a developer?
Yes, once a developer has wired Avocado Studio in and marked which components are editable. After that, copy, images and sections are changed in chat or by clicking the page, then approved in a preview.
Which AI models does it use?
Whichever you bring: an Anthropic, OpenAI or Google Gemini API key. Avocado runs on your key and never resells tokens.
Try it on a real site in one command.
Scaffold the demo site with the editor, or run it inside an existing Next.js project to wire Avocado Studio in. Open source under Apache-2.0; bring your own Anthropic, OpenAI or Gemini key.
npm create avocado-site@latest