What Is Composer?
Composer is the flexible, design-first widget the UiChemy plugin adds to Elementor, build any section visually, in code, or with AI chat.
UiChemy is the WordPress plugin, built around a single widget called Composer. Instead of giving you a library of fixed widgets, it gives you one flexible container that holds any HTML, CSS, and JavaScript design, and lets you edit that design through a visual layer editor, a code editor, or a built-in AI chat, without leaving Elementor.
The Composer widget works with Elementor (Free or Pro), Gutenberg (WordPress's built-in editor), and Bricks Builder.
What Composer Adds to Your Site
Installing UiChemy gives you access to:
| Capability | What it does |
|---|---|
| Composer widget | One Elementor widget that holds any section design: hero, pricing table, team grid, navigation bar, or anything else |
| Two editing modes | Visual layer editor (Design mode) and raw HTML/CSS/JS code editor (Developer mode), both available in Free |
| In-editor Chat AI (Pro) | Describe any section or change in plain English using your own connected AI, and it writes the HTML, CSS, and JavaScript directly into the widget |
| Theme Builder | Build headers, footers, single post templates, archive pages, WooCommerce product templates, and 404 pages using the same Composer widget |
| Global Style Manager | Define CSS variables, typography classes, and layout utilities once and use them across every section on your site |
| Forms | Any HTML form inside a Composer widget becomes a managed form: captures submissions to your database, sends email notifications, and fires webhooks |
| AI over MCP | Connect Claude, Cursor, or any MCP-compatible AI client directly to your WordPress site so the AI can read, create, and edit pages through natural language, included in Free |
| Role Manager | Control which WordPress user roles can access the visual editor, code editor, AI chat, and theme builder |
| White Label | Replace UiChemy branding with your own product name and logo when delivering sites to clients |
How the Composer Differs From Other Widgets
A standard Elementor widget has a fixed structure. A Heading widget always outputs a heading. An Image widget always outputs an image. You configure these widgets through dropdowns and fields, but you cannot change what they fundamentally output.
The Composer has no fixed structure. It stores whatever HTML, CSS, and JavaScript design you put inside it. That design can come from the AI chat, an imported Figma file, or your own code. Because the output is real code, the widget can render anything: a three-column testimonial grid, a full-bleed video section, an animated counter, a responsive pricing table.
One widget, unlimited section types.
A Typical Workflow
Building with code (Free):
- Add a Composer widget to any Elementor section.
- Click Edit Code to open the HTML/CSS/JS editor.
- Paste or write your section's HTML, CSS, and JavaScript.
- Update text, images, and links through the Elementor panel using slots.
Building with Chat AI (Pro):
- Add a Composer widget to any Elementor section.
- Open the Chat AI tab and describe the section you want in plain English.
- Your connected AI writes the HTML, CSS, and JavaScript directly into the widget.
- Update text, images, and links through the Elementor panel without touching code.
- For structural changes, ask again or switch to the code editor.
Who Composer Is For
- Developers and freelancers who want to write clean, scoped HTML/CSS/JS inside Elementor without fighting its component system.
- Designers who want full visual control over sections without being limited to what a pre-built widget can do.
- Agencies who need to deliver finished sites to clients with controlled access, clients can update content, but cannot break the design.
- AI-first workflows, if you work with Claude, Cursor, or any MCP-compatible AI client, UiChemy turns your WordPress site into something the AI can read and edit directly.
The Composer widget, its Editor and Code tabs, MCP integration, Global Style (with limits), and Theme Builder (Header, Footer, Single Post/Page, 404) are available in the free version. Chat AI, archive/search/WooCommerce Theme Builder templates, most dynamic data providers (Site, User, Term, Request), Role Manager, and White Label require UiChemy Pro, and Pro unlocks fully once the plugin is active, no license key needed. See Free vs Pro for the full breakdown.