Page Builder Support

Respira understands 12 WordPress page builders at the module level. AI can update specific sections, buttons, or text blocks without affecting the rest of your page.

Supported Builders

New in v6.0: Flatsome UX Builder

Flatsome is the most popular WooCommerce theme on ThemeForest (200,000+ sales). Respira 6.0 adds full support:

• Shortcode-based storage (section > row > col > elements), same architecture as Divi 4
• 55 element definitions with attributes, nesting rules, and responsive patterns
• 6 pre-built page patterns for AI agents
• Theme-based detection (not plugin), with mixed-builder site support
• WooCommerce shortcodes preserved through round-trip editing

See the full Flatsome documentation for element reference and nesting rules.

TagDiv / Newspaper detection

Sites running the Newspaper or Newsmag theme with TagDiv Composer are detected as "WPBakery (TagDiv)" and handled through the WPBakery builder class.

How It Works

1. Extract: Respira reads your page and parses the builder's data format
2. Identify: AI finds the specific module you want to change
3. Update: Changes are applied to just that module
4. Preserve: All other content, styling, and settings remain intact

Key Tools

• respira_get_builder_info — detect active builder, version, module count
• respira_extract_builder_content — view full page structure
• respira_find_element — search by text, CSS class, type, or ID
• respira_update_element — update a single element's settings or content
• respira_build_page — create a complete page from declarative JSON
• respira_inject_builder_content — replace full page structure

Example Workflow

You: "What page builder is my site using?"
AI: Uses respira_get_builder_info → "Your site uses Flatsome UX Builder"

You: "Show me the structure of the homepage"
AI: Uses respira_extract_builder_content → Shows sections, rows, columns, elements

You: "Update the hero banner heading to 'Welcome to Our Store'"
AI: Uses respira_find_element → Finds the text_box inside ux_banner
AI: Uses respira_update_element → Updates just that text

Context-Aware Tool Filtering

As of v6.0, the MCP server automatically filters the tool list based on your site's detected builder. A Divi site without WooCommerce sees ~130 tools instead of ~170. Less noise, faster AI responses.

Best Practice: Use Admin Labels

Set descriptive admin labels on important modules. This makes them easy to target:

• "Hero CTA Button"
• "Footer Contact Form"
• "Pricing Table Section"

Then: "Update the module labeled 'Hero CTA Button' to say 'Contact Us'"

FAQ

Which page builder has the best Respira support?

All 12 supported builders have full module-level editing support. Divi and Elementor have the most comprehensive intelligence packages. Bricks has 20 dedicated deep tools. Flatsome has a 55-element intelligence package with nesting rules and page patterns.

Can Respira edit Global Modules in Divi?

Yes. Respira detects Divi Global Modules and can update them. Changes to global modules propagate everywhere they are used on your site.

Does Respira work with custom builder modules?

Core modules from all 12 builders are fully supported. Third-party add-on modules have varying support depending on how they store data. Most text-based custom modules work well.

What happens to my styling when Respira updates a module?

Respira preserves all existing styling, settings, and structure. Only the specific content you ask to change is modified. Colors, fonts, spacing, animations, and responsive settings remain intact.

Can I undo changes made by Respira?

Yes. Every write operation creates a before/after snapshot. Use the Changes page in WordPress admin to review, diff, and restore any previous state.