UX Builder editing for the Flatsome WooCommerce theme. Shortcode-aware reads and writes that respect Flatsome's nested element model.
Respira gives AI coding agents a structure-aware way to read and write Flatsome content through a duplicate-first workflow. Every write is snapshotted. Every change can be reviewed before going live.
Everything below is read from this repo at build time: tool registrations come from the MCP server adapter files; changelog entries are filtered from the same source the /releases timeline uses.
Build script now blocks Liskov Substitution fatals: Build aborts with a clear error if any builder subclass (Respira_Builder_Flatsome, etc.) overrides a parent method with an incompatible signature. Mirrored in a new php
Flatsome UX Builder as Builder #12: Full support for the most popular WooCommerce theme on ThemeForest (200K+ sales). Extract, inject, element ops, build_page, and snapshots all work. Detection by active theme. Shortcode
ShortcodeParser utility: Shared shortcode parsing and reconstruction for Divi 4 and Flatsome. Parameterized by tag prefix, column format, and detection patterns. Strict tag allowlists prevent cross-builder content confus
Flatsome Intelligence package: 55 element definitions with attributes, types, defaults, nesting rules, and responsive patterns. 6 pre-built page patterns for AI agents
Flatsome UX Builder: Builder #12 with full round-trip shortcode editing, element-level precision, and 55-element intelligence
check_circle
What works
Capabilities shipped today
Concrete features in the current MCP server release. Tool names link directly to the adapter.
Flatsome UX Builder shortcodes parsed with full attribute preservation and nesting support.
Per-element writes via the standard find/update flow work on rows, columns, sections, banners, sliders, and product-related elements.
WooCommerce category, product, and shop-page edits work through the standard Woo addon tools alongside Flatsome layouts.
Flatsome studio templates (header, footer, mega-menus) are readable; per-template per-page assignment is editable.
Custom CSS at theme level (flatsome_options[custom_css]) and per-page level are both writable.
warning
Known limits
Where you still need a human pass
Honest list of edges. If you hit one of these, the snapshot workflow gives you a clean rollback path.
Flatsome Studio (cloud library) imports go through Flatsome's own UI. The MCP can edit a layout once it's on the site, not pull from Studio.
Flatsome's real-time UX Builder preview is not driven from the MCP — Respira writes; you refresh the editor to see results.
Some legacy Flatsome 2.x layouts using unmaintained third-party shortcodes can lose attributes on round-trip. Duplicate first.
construction
Tools
Flatsome uses the universal toolset
Flatsome edits run through Respira's universal tools: respira_find_element, respira_update_element, respira_update_page (for full-page replacement only), respira_get_snapshot, and respira_create_page_duplicate. See the complete tool catalog.
chat
Example prompts
Three prompts you can paste right now
Each one assumes Respira is connected to your WordPress site through the MCP server below. Copy a prompt, paste into your MCP client, run.
Update product-category banners
For every WooCommerce product category, find the banner element in its Flatsome description and swap the headline from "Shop now" to "New collection". Snapshot each first.
Refresh the homepage hero slider
On the homepage, find the first ux_slider element. Replace slide 1's headline with "Holiday edition" and update its CTA URL to /holiday.
Audit color usage
List every distinct hex color value used in Flatsome shortcodes across all pages. Group by frequency.
terminal
Setup
Connect Respira's MCP server
Drop this into your MCP client config (Claude Desktop, Cursor, Codex, Windsurf — any MCP-compatible client). Generate an API key from your Respira dashboard first.