--- title: LolaCore for Bricks canonical_url: https://lolacore.com/lolacore-for-bricks/ last_updated: 2026-08-22T11:21:45+00:00 plugin_version: 1.2.3 --- # LolaCore for Bricks LolaCore for Bricks · Free Add-on · Requires LolaCore Lola reads your Bricks system, then writes inside it. ===================================================== Lola reads and writes your design system, pages, templates, and components: 65 abilities, 69 when WooCommerce is active. She uses the global classes and variables your site already has, names every page a change will touch, and waits for your confirmation before anything saves. [Get it free →](/install-lolacore-for-bricks) [See what Lola can do →](#bricks-demo) ● 65 abilities, 69 with WooCommerce● Lola writes with your existing classes and variables● Works from Claude, from wp-admin, and from your editor 01 · The Problem The sentence is already finished. The clicking is what takes the afternoon. --------------------------------------------------------------------------- You know what the site needs before you open anything. A naming pattern. A spacing scale. A services hero that repeats across twenty pages with different copy in each. That part is done in your head on the drive home. What is left is transport. Create the variables one at a time. Name the class. Style the first section. Then rebuild that same structure nineteen more times, swapping the heading and the intro paragraph on every pass, checking each page after you save it. An inherited site carries a different weight. Classes nobody applies anymore. Near-identical pairs that came out of one rushed afternoon. Variables defined and never referenced. Theme styles whose conditions overlap. Components with no instances left in the site. None of that is visible from the canvas, and none of it gets fixed by dragging. Both situations share a root. Anything that writes into a Bricks site without reading its system first leaves residue behind: a loose pixel value where a global class already existed, a fresh hex where a variable was waiting to be used. That is the part Lola handles differently. She maps the classes, variables, theme styles, components, and templates first, then writes using what she found. Same Bricks. Same classes. You stopped hopping panels and started asking. 02 · Demo What a Bricks afternoon looks like in conversation -------------------------------------------------- - The class btn-blue is used all over the site. Rename it to btn-primary without breaking the CSS. - btn-blue is on 34 elements across 12 pages, plus the header template and the card-cta component. Index coverage is complete. I'll rename the class, update every reference, and regenerate CSS for those 12 pages. Preview ready. Confirm? - Go. - Done. btn-blue is now btn-primary. 12 pages, header template, one component. CSS regenerated. The front end will match on refresh. - New site. Brand colors: #241828, #6E2E5C, #5BB87E. Headings Fraunces, body Source Sans 3. Naming: role plus variant, like btn-primary. Build a site-wide header with logo, five links, and a Contact button. - I'll save that naming convention, create the color variables in one batch, set typography on the base theme style, then create a header template for the entire site. Four questions first: logo from the media library? The five link labels? Contact URL? Header on every page, or exclude checkout? - Logo is already in the library. Links: Home, Work, About, Journal, Contact. Contact goes to /contact. Entire site. - Preview: 3 color variables, theme style typography, header template covering the whole site. Confirm the batch? - Clone the Services hero from /services/branding onto these 20 service pages. Same layout. Swap the heading and the intro paragraph on each. List is in the next message. - I'll copy that section with new element IDs and apply your per-page copy. Preview names all 20 pages. I'll run them in batches of 5. Confirm the first batch? - Yes. - Batch 1 of 4 written: branding, web, identity, naming, packaging. 15 left. Continue? 03 · Positioning Lola writes in the vocabulary your site already uses. ----------------------------------------------------- If your buttons run on `btn-primary`, that is the class she applies. If your spacing runs on variables, those are the values she reaches for. If your site is named in BEM or in Tailwind-style utilities, she detects the pattern and works inside it rather than inventing a parallel one. That happens because she works from three layers at once. 01 · What you already built Lola maps every global class, variable, theme style, component, and template on the site, and where each one is actually used. Before she styles anything, she knows whether the thing you are describing already exists under another name. 02 · What the model already knows The AI provider behind Lola brings a working understanding of layout, hierarchy, contrast, and how people read an interface. Ask her which of two treatments will hold up at mobile width and she gives you a reasoned answer, not a shrug. 03 · You The palette, the tone, and the typography come from you. Lola will tell you when a loose orange would be better served by the `btn-primary` you already defined. If you want the loose orange anyway, she applies it and remembers that you decided so. The split with the builder falls out naturally. Building twenty service cards with identical structure is long to do by hand and short to say, so Lola takes it. Nudging the padding on a hero until it feels right is fast in Bricks and slow to describe, so the builder stays open for that. 04 · Capabilities With this addon active, Lola can do 65 things on your Bricks site. ------------------------------------------------------------------ What follows is what Lola does while the addon is running. She makes the calls, shows you the preview, and waits. You describe the outcome. ### Reading the system · 13 abilities Lola tells you which Bricks version runs, how the CSS loads, and how many classes, variables, components, and templates the site holds. She lists your global classes with their categories and what is sitting in the trash. She traces where a class is applied and names the pages, templates, and components that carry it. She reads your variables and tells you which elements reference each one. She reads your theme styles with the conditions attached, and lists your components with their instance counts and where each instance lives. She resolves which template wins on a given page and explains why. Before she touches an element type she has not handled yet, she reads its control contract first. ### Governing the library · 5 abilities Lola finds the classes no element applies anymore. She finds the pairs that do the same job under two different names. She finds variables you defined and never referenced, and components left without a single instance. She finds theme styles whose conditions overlap and fight each other. She gives you the finding, then the impact in page names, then waits for you to confirm before she writes. ### Writing the design system · 11 abilities Lola creates a class and warns you when a near-identical one already exists. She edits class settings with the full breakpoint and state grammar. She renames a class across every page, template, and component in one pass, then regenerates the CSS. She merges two classes and shows you how many elements and pages move. She sends classes to the Bricks trash and pulls them back out when you change your mind. She creates and updates variables in batch, so a brand palette lands in one confirmation, and she tells you where a variable was referenced before she removes it. She updates the Bricks color palette. She updates a theme style, conditions included. And she saves your naming convention, then reports what share of your current classes already follows it. ### Building and restyling pages · 17 abilities Lola reads the element tree of a page, a header, or a footer. She inserts any Bricks element, moves it, duplicates a branch with new IDs, or removes one and its children. She applies the 84 universal style controls at any breakpoint or state, so "more padding on tablet" and "change the hover" are one sentence each. She attaches and detaches global classes on a single element or on many at once. She updates element-specific settings with live validation: an unknown key stops the write and comes back with the valid ones, closest match first. And she keeps shortcuts for the elements you ask for every day, so "add a heading and a button under the hero" arrives as a section, container, div, heading, text, image, or button with your site's classes already on it. When you ask for an image, she takes it from your media library. ### Templates · 5 abilities Lola creates headers, footers, content templates, and archives, with conditions attached from the start. She writes the element tree of a template area. She sets where a template applies and always previews how many pages it will cover, listed by name, before she saves. She duplicates a template with fresh element IDs, and sends one to the WordPress trash when you ask her to. ### Components · 6 abilities Lola turns a branch into a component and leaves an instance where it stood. She defines and edits properties, telling you how many instances will change before she commits. She edits component structure and styling with that same preview. She inserts an instance, updates its props and overrides, or detaches one back into regular elements. She nests components up to ten deep. ### Page behavior · 5 abilities Lola updates page-level SEO, layout, and page CSS. She sets the conditions that decide when an element shows, and clears them when you want the element back for everyone. She wires native Bricks interactions: click, hover, entering the viewport, off-canvas toggles, scroll to, animations, WooCommerce events. She lists your dynamic data tags grouped by provider, ACF included when ACF is active, and assigns one to an element setting from the tags she actually found on your site. ### The same change across many pages · 3 abilities Lola copies a branch onto twenty pages with new element IDs and different copy on each destination. She changes text, images, and links on every element that matches by class, by name, or by position. She adds or removes global classes across those same matches. She works five pages at a time, names every destination page before she starts, and tells you exactly where to resume if one of them fails. ### Shop layouts, when WooCommerce is active · 4 more abilities Lola tells you which store templates the shop has and which ones it still needs. She creates product, archive, cart, checkout, and account templates with their conditions. She inserts product elements by name: title, price, gallery, add to cart. And she walks you through a catalog of 47 insertable WooCommerce elements grouped by surface, so you can point at one instead of hunting for it. **On the count.** Bricks ships 86 core elements and 48 WooCommerce elements, and Lola styles and configures any of them. The number lands at 65 because Bricks styling controls are universal: `_padding` is `_padding` on every element, so she works through that shared grammar instead of needing one ability per widget. The shortcuts exist for the handful of elements that come up in every single conversation. 05 · Where you talk to her Claude, wp-admin, or your code editor. Same Lola, same site. ------------------------------------------------------------ Every ability on this page reaches Lola through all three, with the same preview and the same confirmation step. ### From Claude Install LolaCore, press the "Connect with Claude" button in the onboarding, and authorize once. From that point you open Claude and tell her to rename `btn-blue` to `btn-primary`, and she does it inside your Bricks, with your classes, after you confirm. It works with the Claude account you already have, on any plan, and the connection is yours to revoke from your Claude settings. [How the Claude connection works →](/claude/) - Rename btn-blue to btn-primary on this Bricks site. Don't break the CSS. - btn-blue is on 34 elements across 12 pages, plus the header template and the card-cta component. Index coverage is complete. I'll rename the class, update every reference, and regenerate CSS for those 12 pages. Preview ready. Confirm? - Go. - Done. btn-blue is now btn-primary. 12 pages, header template, one component. CSS regenerated. ### From wp-admin The Lola chat inside WordPress, using the AI provider you configured in Settings → Connectors. This is where the designer on your team works, in the panel they already have open. ### From your code editor Claude Code, Cursor, or any MCP client. She inspects class usage, previews a rename with `dry_run`, and writes after you confirm, without you leaving the editor. - Reaching the Bricks site. - rename btn-blue to btn-primary. dry\_run first - lolacore-bricks/get-class-usage - lolacore-bricks/rename-global-class - Waiting for confirmation… This matters more on Bricks than on most domains, because the people who build with Bricks are often the same people who live in a terminal. A designer can work with Lola in the WordPress panel while a developer drives her from an IDE, on the same client site, with the same memory underneath. One note on scale, since this addon hands her 65 more abilities. Claude reads a compact index of what Lola can do rather than the full technical catalogue, so a site running a dozen add-ons connects and stays workable. 06 · Memory The next session does not start from zero. ------------------------------------------ Lola keeps a live picture of the site and refreshes it daily: how many global classes exist and how many go unused, which variables are defined, the naming convention you agreed on, the framework she detected, component and template counts, the CSS loading mode, and how far she has mapped the site. Open a client site you have not touched in six weeks and she already carries its context, so you describe the change instead of re-learning the site first. That memory lives inside your own WordPress install, and it decays over time so stale context fades on its own. She also arrives with a skill and two playbooks that register automatically. The skill, `lolacore-bricks-system-architect`, routes a Bricks question to the right ability and holds her to the site's own vocabulary when she writes. One playbook guides her through a blank site: convention, then tokens, then header and footer, then templates, then the first pages, and she asks at most four questions before proposing the first write. The other orients her in a site somebody else built. 07 · Safety Every write shows a preview, with the page names in it. ------------------------------------------------------- Lola runs read actions directly. Listing your classes, tracing where a variable is referenced, resolving which template wins on a page: none of that changes anything, so none of it waits. On write actions she always stops for your confirmation, and what she shows you is specific. When she renames a class, she names the pages, the templates, and the components affected. When she merges two classes, she tells you how many elements will move. When she sets template conditions, she lists the pages that template will cover. On a bulk operation, she names every destination page before she writes the first one. When a change touches the design system, she regenerates the site CSS on save, so the front end matches what she reported. Two more things worth knowing. Lola declares how much of the site she has mapped: if her map is only 40% complete, she says so before answering a question that depends on it, because finding "unused" classes against a partial map would flag classes that are very much in use. And when you give her custom CSS for a class or a theme style, she checks it for unsafe constructs and rejects those before anything reaches your database. 08 · Cross-domain A product template is rarely only a template problem. ----------------------------------------------------- The field you want to show on a product page has to exist before it can be displayed. The order behind that product lives in a different admin screen. Lola declares affinity with LolaCore's other add-ons, so when a Bricks question crosses into another domain she follows it in the same conversation. With [LolaCore for ACF](/lolacore-for-acf/) active, she creates the custom field and places it in the Bricks template without you switching context. With [LolaCore WooCommerce Pro](/woocommerce-pro/) active, she builds the product layout here and talks to you about the orders it produces there. With [LolaCore for Polylang](/lolacore-for-polylang/) active, she translates Bricks pages into linked language drafts with the layout intact. Install the domains your site actually uses. Lola routes between the ones that are active. 09 · Requirements What you need ------------- LolaCore2.7.0 or higher, free, active on the same site Bricks2.0 or higher, licensed separately from Bricks Builder WordPress7.0 or higher, tested up to 7.1 PHP8.1 or higher WooCommerceOptional. Active means Lola gains 4 additional abilities There is no settings page for this addon and no API key specific to it. Activate LolaCore, Bricks, and this addon, and Lola discovers her Bricks abilities on her own. Then pick how you want to reach her. Press "Connect with Claude" in the LolaCore onboarding and authorize, and she works from the Claude account you already have, on any plan. Or open Settings → Connectors in WordPress, choose the provider and model you prefer, and talk to her in the wp-admin chat. The second button in the onboarding takes you there. Either way, Lola on the site handles execution, previews, and memory. 10 · For developers If you already work through MCP ------------------------------- Most of this page speaks to the designer who experiences Bricks as panels. Three things matter if you experience it as an API. First, every ability runs against Bricks' public APIs. The classes, variables, theme styles, templates, and components Lola writes are the same records the Bricks UI writes, stored the same way, and Bricks reads them back without a translation step. Second, all 65 abilities are exposed through LolaCore's bundled MCP server under `lolacore-bricks/*`, `dry_run` preview included. Connect Claude Code, Cursor, or any MCP client to a LolaCore site and the Bricks tools appear alongside the rest of LolaCore's surface. The addon needs LolaCore active, because LolaCore is what publishes the MCP server. Third, Lola builds her map of the site in batches on install, with progress visible in the chat, and maintains it afterward. Any answer resting on that map reports its coverage, and you can push a rebuild forward in batches until it completes. 11 · Frequently asked questions Questions --------- Do I need LolaCore to use this? Yes. This addon gives Lola the Bricks domain. Install and activate LolaCore first. Do I need Bricks? Yes, the Bricks theme at version 2.0 or higher. Bricks is a commercial product and you license it from Bricks Builder directly. Where does Bricks fit once Lola is installed? Bricks builds and renders the site, exactly as it does today. Lola reads and writes those same records through conversation. The builder is one click away whenever you want to work by hand. What does it cost? Nothing. It is on WordPress.org, with no license key and no subscription for this addon. What if I do not run WooCommerce? Lola keeps all 65 design system, page, template, and component abilities. The 4 store abilities register when WooCommerce is active. Can I use this from Claude? Yes, and it is the shortest route in. Install LolaCore, press "Connect with Claude" in the onboarding, authorize once, and ask Claude to work on your Bricks site. It runs on the Claude account you already have, including the free plan. Does it work from Cursor or Claude Code? Yes. Lola brings the same 65 abilities to any MCP client, with `dry_run` preview before any write. Do I need an AI provider key in WordPress? Only if you want the wp-admin chat. Configure the provider you prefer in Settings → Connectors and Lola uses it there. If you connect through Claude instead, the reasoning runs on your Claude account and Lola on the site executes, previews, and remembers. What happens if Lola has not finished mapping the site? She reports her coverage percentage along with the answer, and she can push the mapping forward in batches until it is complete. On questions that need a full picture, such as finding unused classes, she says so first. Can Lola run PHP or JavaScript in a Code element? She saves custom CSS on classes and theme styles, checking it for unsafe constructs before it reaches your database. Executable code is out of her scope by design, as a security decision. What if I deactivate Bricks? Lola shows an admin notice and her Bricks abilities stop registering. Your site keeps running on whatever theme is active. Is there anything to configure? Activate the three plugins. Lola uses the AI provider you configured in WordPress (Settings → Connectors), and this addon adds no keys or quotas of its own. Is this affiliated with the Bricks team? No. LolaCore for Bricks is an independent addon built by LolaCore. It is not affiliated with, endorsed by, or sponsored by Bricks Builder. Lola reads your Bricks system, then writes inside it. ----------------------------------------------------- Install the addon and Lola discovers all 65 Bricks abilities automatically. There is no settings page to configure. Press "Connect with Claude" in the onboarding and she reaches your Bricks from the Claude account you already have. [Get it free →](/install-lolacore-for-bricks) Don't have LolaCore yet? LolaCore is the free AI agent that lives inside your WordPress admin. It reads your site, takes action with your approval, and remembers everything across sessions. [Get LolaCore free →](https://wordpress.org/plugins/lolacore) Bricks is developed by Bricks Builder. LolaCore for Bricks is an independent addon built by LolaCore. It is not affiliated with, endorsed by, or sponsored by Bricks Builder. You install and license Bricks yourself.