Strapi

AI editing for your Strapi site.

Avocado Studio adds an AI editor and a click-to-edit live preview to a website whose content lives in Strapi. With a self-hosted Strapi, the whole stack — CMS, editor and AI layer — runs on infrastructure you control, on your own model key.

Connect your site and CMS Try the live demo

Content store: Strapi — a template and a self-hosted working example are included
Rich text: Strapi 5 Blocks, read and written back
Publishing: Only the fields that changed
Images: The editor’s image picker searches your Strapi media library
Framework: Next.js 15 or 16, App Router
Licence: Apache-2.0, free to self-host

An open-source stack, end to end

Strapi is open source and self-hostable; so is Avocado Studio. Put them together and nothing in the editing path is rented: your Strapi, your Next.js site, the Avocado orchestrator running inside that site, and an Anthropic, OpenAI or Gemini key billed to you directly. Avocado runs on your key and never resells tokens.

Integrating an existing Next.js site? Run npm create avocado-site@latest inside it — the Strapi template is one of the options.

Strapi 5 Blocks round-trip

Rich text in Strapi 5’s Blocks format converts into the editor’s document and back. Node types the converter does not know pass through unchanged rather than being dropped.

One documented gap: Strapi Blocks has no horizontal rule, so a rule typed in the editor is dropped rather than faked as a paragraph of dashes.

Publishing writes only what changed

Avocado diffs the edited page against what Strapi held and writes only the changed fields, so media relations and rich text are not replaced by their flattened copies. Changes a field diff cannot express safely — a replaced image, a new block — are reported back instead of guessed. Until you publish, drafts, undo history and chat live in Avocado’s own working copy, not in Strapi.

Your Strapi media library in the editor

cmsMediaSource fills the editor’s image picker from your Strapi media library. Credentials stay on your server.

import { cmsMediaSource } from "@avocadostudio-ai/site-sdk/server"

// In your CmsAdapter:
getMedia: cmsMediaSource({
  provider: "strapi",
  url: process.env.STRAPI_URL!,
  token: process.env.STRAPI_TOKEN,
})

FAQ

Strapi: common questions

Is Avocado Studio made by Strapi?

No. Avocado Studio is an independent open-source project, licensed Apache-2.0, that works with Strapi through its API.

Which Strapi version does it support?

The rich-text converter targets the Strapi 5 Blocks format. Check the docs for the version the Strapi template is built on.

Can I self-host everything?

Yes. Strapi, your site and Avocado Studio can all run on your own infrastructure; the only outside call is to the AI provider whose key you configure.

Will it replace the Strapi admin panel?

No. Strapi remains your CMS. Avocado Studio adds AI and visual editing on the website itself and writes changes back to Strapi.

Which AI models does it use?

Whichever you bring: an Anthropic, OpenAI or Google Gemini API key.

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