--- title: LolaCore para Bricks canonical_url: https://lolacore.com/es/lolacore-para-bricks/ last_updated: 2026-08-22T11:21:51+00:00 plugin_version: 1.2.3 --- # LolaCore para Bricks LolaCore para Bricks · Addon gratuito · Requiere LolaCore Lola lee tu sistema Bricks, y escribe dentro. ============================================= Lola lee y escribe tu sistema de diseño, tus páginas, plantillas y componentes: 65 habilidades, 69 si WooCommerce está activo. Usa las clases globales y las variables que tu sitio ya tiene, nombra cada página que va a tocar y espera tu confirmación antes de guardar nada. [Consíguelo gratis →](/install-lolacore-for-bricks) [Mira lo que Lola puede hacer →](#bricks-demo) ● 65 habilidades, 69 con WooCommerce● Lola escribe con tus clases y variables de ahora● Funciona desde Claude, desde wp-admin y desde tu editor 01 · El problema La frase ya la tienes. Lo que se come la tarde es hacer clic. ------------------------------------------------------------- Sabes lo que el sitio necesita antes de abrir nada. Un patrón de nombres. Una escala de espaciado. Un hero de servicios que se repite en veinte páginas con copy distinto en cada una. Eso ya lo tienes resuelto de camino a casa. Lo que queda es el transporte. Crear las variables de una en una. Nombrar la clase. Estilar la primera sección. Y luego reconstruir esa misma estructura diecinueve veces más, cambiando el titular y el párrafo de intro en cada pase, y revisando cada página después de guardar. Un sitio heredado pesa de otra manera. Clases que ya no aplica nadie. Parejas casi iguales que salieron de una tarde con prisa. Variables definidas y nunca referenciadas. Estilos de tema cuyas condiciones se pisan. Componentes sin una sola instancia en el sitio. Nada de eso se ve desde el lienzo, y nada de eso se arregla arrastrando. Las dos situaciones tienen la misma raíz. Cualquier cosa que escriba en un sitio Bricks sin leer antes su sistema deja residuo: un valor suelto en píxeles donde ya existía una clase global, un hex nuevo donde había una variable esperando. Eso es lo que Lola hace distinto. Primero mapea las clases, las variables, los estilos de tema, los componentes y las plantillas, y luego escribe con lo que encontró. Mismo Bricks. Mismas clases. Dejaste de saltar de panel en panel y empezaste a preguntar. 02 · Demo Una tarde de Bricks, en conversación ------------------------------------ - La clase btn-blue se usa por todo el sitio. Renómbrala a btn-primary sin romper el CSS. - btn-blue está en 34 elementos de 12 páginas, más la plantilla del header y el componente card-cta. La cobertura del índice está completa. Renombro la clase, actualizo cada referencia y regenero el CSS de esas 12 páginas. Vista previa lista. ¿Confirmas? - Adelante. - Hecho. btn-blue ahora es btn-primary. 12 páginas, plantilla del header, un componente. CSS regenerado. El front coincidirá al recargar. - Sitio nuevo. Colores de marca: #241828, #6E2E5C, #5BB87E. Titulares Fraunces, cuerpo Source Sans 3. Nombres: rol más variante, como btn-primary. Monta un header para todo el sitio con logo, cinco enlaces y un botón de Contacto. - Guardo esa convención de nombres, creo las variables de color de una vez, dejo la tipografía en el estilo de tema base y creo una plantilla de header para todo el sitio. Primero cuatro preguntas: ¿el logo de la biblioteca de medios? ¿Las etiquetas de los cinco enlaces? ¿URL de Contacto? ¿Header en todas las páginas, o excluimos el checkout? - El logo ya está en la biblioteca. Enlaces: Inicio, Trabajo, Estudio, Diario, Contacto. Contacto va a /contact. Todo el sitio. - Vista previa: 3 variables de color, tipografía del estilo de tema, plantilla de header para todo el sitio. ¿Confirmas el lote? - Clona el hero de Servicios de /services/branding en estas 20 páginas de servicios. Mismo layout. Cambia el titular y el párrafo de intro en cada una. La lista va en el siguiente mensaje. - Copio esa sección con IDs de elemento nuevos y aplico el copy de cada página. La vista previa nombra las 20 páginas. Las haré en lotes de 5. ¿Confirmas el primer lote? - Sí. - Lote 1 de 4 escrito: branding, web, identity, naming, packaging. Quedan 15. ¿Sigo? 03 · Posicionamiento Lola escribe con el vocabulario que tu sitio ya usa. ---------------------------------------------------- Si tus botones van con `btn-primary`, esa es la clase que aplica. Si el espaciado va con variables, esos son los valores que coge. Si el sitio está nombrado en BEM o en utilidades al estilo Tailwind, detecta el patrón y trabaja dentro, en vez de inventar uno paralelo. Eso ocurre porque trabaja desde tres capas a la vez. 01 · Lo que ya construiste Lola mapea cada clase global, variable, estilo de tema, componente y plantilla del sitio, y dónde se usa de verdad. Antes de estilar nada, sabe si eso que describes ya existe con otro nombre. 02 · Lo que el modelo ya sabe El proveedor de IA detrás de Lola trae un entendimiento de layout, jerarquía, contraste y de cómo se lee una interfaz. Pregúntale cuál de dos tratamientos aguanta en móvil y te da una respuesta razonada, no un encogimiento de hombros. 03 · Tú La paleta, el tono y la tipografía salen de ti. Lola te dirá cuando un naranja suelto estaría mejor servido por el `btn-primary` que ya definiste. Si quieres el naranja suelto de todas formas, lo aplica y recuerda que lo decidiste tú. El reparto con el builder sale solo. Montar veinte tarjetas de servicios con la misma estructura es largo a mano y corto de decir, así que lo coge Lola. Ajustar el padding de un hero hasta que quede bien es rápido en Bricks y lento de describir, así que el builder se queda abierto para eso. 04 · Habilidades Con este addon activo, Lola puede hacer 65 cosas en tu sitio Bricks. -------------------------------------------------------------------- Lo que sigue es lo que Lola hace mientras el addon está en marcha. Ella hace las llamadas, te enseña la vista previa y espera. Tú describes el resultado. ### Leer el sistema · 13 habilidades Lola te dice qué versión de Bricks corre, cómo carga el CSS y cuántas clases, variables, componentes y plantillas tiene el sitio. Lista tus clases globales con sus categorías y lo que hay en la papelera. Sigue dónde se aplica una clase y nombra las páginas, plantillas y componentes que la llevan. Lee tus variables y te dice qué elementos referencia cada una. Lee tus estilos de tema con las condiciones encima, y lista tus componentes con el recuento de instancias y dónde vive cada una. Resuelve qué plantilla gana en una página concreta y explica por qué. Antes de tocar un tipo de elemento que aún no ha tratado, lee primero su contrato de controles. ### Gobernar la biblioteca · 5 habilidades Lola encuentra las clases que ya no aplica ningún elemento. Encuentra las parejas que hacen el mismo trabajo con dos nombres distintos. Encuentra variables que definiste y nunca referenciaste, y componentes dejados sin una sola instancia. Encuentra estilos de tema cuyas condiciones se pisan y se pelean. Te da el hallazgo, luego el impacto con nombres de página, y espera a que confirmes antes de escribir. ### Escribir el sistema de diseño · 11 habilidades Lola crea una clase y te avisa cuando ya existe una casi igual. Edita los ajustes de clase con la gramática completa de breakpoints y estados. Renombra una clase en todas las páginas, plantillas y componentes de una pasada, y luego regenera el CSS. Fusiona dos clases y te muestra cuántos elementos y páginas se mueven. Manda clases a la papelera de Bricks y las saca cuando cambias de opinión. Crea y actualiza variables en lote, para que una paleta de marca aterrice en una confirmación, y te dice dónde se referenciaba una variable antes de quitarla. Actualiza la paleta de color de Bricks. Actualiza un estilo de tema, condiciones incluidas. Y guarda tu convención de nombres, y luego te dice qué parte de tus clases actuales ya la sigue. ### Construir y reestilar páginas · 17 habilidades Lola lee el árbol de elementos de una página, un header o un footer. Inserta cualquier elemento de Bricks, lo mueve, duplica una rama con IDs nuevos o quita uno y sus hijos. Aplica los 84 controles de estilo universales en cualquier breakpoint o estado, así que “más padding en tablet” y “cambia el hover” son una frase cada uno. Engancha y desengancha clases globales en un solo elemento o en muchos a la vez. Actualiza ajustes propios de cada elemento con validación en vivo: una clave desconocida para la escritura y vuelve con las válidas, la más cercana primero. Y guarda atajos para los elementos que pides cada día, así que “añade un titular y un botón bajo el hero” llega como section, container, div, heading, text, image o button con las clases de tu sitio ya puestas. Cuando pides una imagen, la coge de tu biblioteca de medios. ### Plantillas · 5 habilidades Lola crea headers, footers, plantillas de contenido y archivos, con las condiciones puestas desde el principio. Escribe el árbol de elementos de un área de plantilla. Define dónde aplica una plantilla y siempre previsualiza cuántas páginas va a cubrir, listadas por nombre, antes de guardar. Duplica una plantilla con IDs de elemento nuevos, y la manda a la papelera de WordPress cuando se lo pides. ### Componentes · 6 habilidades Lola convierte una rama en un componente y deja una instancia donde estaba. Define y edita propiedades, y te dice cuántas instancias van a cambiar antes de confirmar. Edita la estructura y el estilo del componente con esa misma vista previa. Inserta una instancia, actualiza sus props y overrides, o la desengancha otra vez a elementos normales. Anida componentes hasta diez de profundidad. ### Comportamiento de página · 5 habilidades Lola actualiza el SEO a nivel de página, el layout y el CSS de página. Pone las condiciones que deciden cuándo se muestra un elemento, y las quita cuando quieres el elemento de vuelta para todos. Cablea las interacciones nativas de Bricks: click, hover, entrar en el viewport, toggles off-canvas, scroll to, animaciones, eventos de WooCommerce. Lista tus etiquetas de dynamic data agrupadas por proveedor, ACF incluido cuando ACF está activo, y asigna una a un ajuste de elemento eligiendo entre las etiquetas que de verdad encontró en tu sitio. ### El mismo cambio en muchas páginas · 3 habilidades Lola copia una rama a veinte páginas con IDs de elemento nuevos y copy distinto en cada destino. Cambia textos, imágenes y enlaces en cada elemento que coincida por clase, por nombre o por posición. Añade o quita clases globales en esas mismas coincidencias. Trabaja de cinco páginas en cinco, nombra cada página de destino antes de empezar y te dice exactamente por dónde retomar si una falla. ### Layouts de tienda, cuando WooCommerce está activo · 4 habilidades más Lola te dice qué plantillas de tienda tiene la tienda y cuáles le faltan. Crea plantillas de producto, archivo, carrito, checkout y cuenta con sus condiciones. Inserta elementos de producto por nombre: título, precio, galería, añadir al carrito. Y te recorre un catálogo de 47 elementos de WooCommerce insertables, agrupados por superficie, para que señales uno en vez de ir a cazarlo. **Sobre el recuento.** Bricks trae 86 elementos core y 48 de WooCommerce, y Lola estila y configura cualquiera de ellos. El número queda en 65 porque los controles de estilo de Bricks son universales: `_padding` es `_padding` en cada elemento, así que trabaja con esa gramática compartida en vez de necesitar una habilidad por widget. Los atajos existen para el puñado de elementos que salen en todas las conversaciones. 05 · Dónde le hablas Claude, wp-admin o tu editor. La misma Lola, el mismo sitio. ------------------------------------------------------------ Cada habilidad de esta página llega a Lola por los tres caminos, con la misma vista previa y el mismo paso de confirmación. ### Desde Claude Instala LolaCore, pulsa el botón «Conectar con Claude» en el onboarding y autoriza una vez. A partir de ahí abres Claude y le dices que renombre `btn-blue` a `btn-primary`, y lo hace dentro de tu Bricks, con tus clases, después de que confirmes. Funciona con la cuenta de Claude que ya tienes, en cualquier plan, y la conexión la revocas tú desde los ajustes de Claude. [Cómo funciona la conexión con Claude →](/es/claude/) - Renombra btn-blue a btn-primary en este sitio Bricks. Sin romper el CSS. - btn-blue está en 34 elementos de 12 páginas, más la plantilla del header y el componente card-cta. La cobertura del índice está completa. Renombro la clase, actualizo cada referencia y regenero el CSS de esas 12 páginas. Vista previa lista. ¿Confirmas? - Adelante. - Hecho. btn-blue ahora es btn-primary. 12 páginas, plantilla del header, un componente. CSS regenerado. ### Desde wp-admin El chat de Lola dentro de WordPress, con el proveedor de IA que configuraste en Ajustes → Conectores. Aquí trabaja el diseñador de tu equipo, en el panel que ya tiene abierto. ### Desde tu editor Claude Code, Cursor o cualquier cliente MCP. Inspecciona el uso de una clase, previsualiza un cambio de nombre con `dry_run` y escribe después de que confirmes, sin salir del editor. - Llegando al sitio Bricks. - renombra btn-blue a btn-primary. dry\_run primero - lolacore-bricks/get-class-usage - lolacore-bricks/rename-global-class - Esperando confirmación… Esto importa más en Bricks que en la mayoría de dominios, porque quien construye con Bricks suele ser la misma persona que vive en un terminal. El diseñador puede trabajar con Lola en el panel de WordPress mientras el desarrollador la conduce desde un IDE, en el mismo sitio de cliente, con la misma memoria debajo. Una nota sobre la escala, porque este addon le pone 65 habilidades más. Claude lee un índice compacto de lo que Lola puede hacer, no el catálogo técnico completo, así que un sitio con una docena de addons conecta y se sigue pudiendo trabajar. 06 · Memoria La siguiente sesión no empieza de cero. --------------------------------------- Lola guarda un retrato vivo del sitio y lo refresca cada día: cuántas clases globales hay y cuántas no se usan, qué variables están definidas, la convención de nombres que acordaste, el framework que detectó, el recuento de componentes y plantillas, el modo de carga del CSS y hasta dónde ha mapeado el sitio. Abres un sitio de cliente que no tocas desde hace seis semanas y ella ya lleva su contexto, así que describes el cambio en vez de reaprender el sitio primero. Esa memoria vive dentro de tu propia instalación de WordPress, y decae con el tiempo para que el contexto viejo se apague solo. También llega con un skill y dos playbooks que se registran solos. El skill, `lolacore-bricks-system-architect`, lleva una pregunta de Bricks a la habilidad correcta y la sujeta al vocabulario del propio sitio cuando escribe. Un playbook la guía en un sitio en blanco: convención, luego tokens, luego header y footer, luego plantillas, luego las primeras páginas, y hace como máximo cuatro preguntas antes de proponer la primera escritura. El otro la orienta en un sitio que construyó otra persona. 07 · Seguridad Cada escritura enseña una vista previa, con los nombres de las páginas. ----------------------------------------------------------------------- Lola ejecuta las lecturas al momento. Listar tus clases, seguir dónde se referencia una variable, resolver qué plantilla gana en una página: eso no cambia nada, así que no espera. En las acciones de escritura siempre para a que confirmes, y lo que te enseña es concreto. Cuando renombra una clase, nombra las páginas, las plantillas y los componentes afectados. Cuando fusiona dos clases, te dice cuántos elementos se van a mover. Cuando pone condiciones de plantilla, lista las páginas que esa plantilla va a cubrir. En una operación en lote, nombra cada página de destino antes de escribir la primera. Cuando un cambio toca el sistema de diseño, regenera el CSS del sitio al guardar, para que el front coincida con lo que te contó. Otras dos cosas que conviene saber. Lola declara cuánto del sitio ha mapeado: si su mapa está solo al 40%, lo dice antes de responder a una pregunta que depende de ello, porque buscar clases “sin uso” contra un mapa a medias marcaría clases que se usan de sobra. Y cuando le das CSS personalizado para una clase o un estilo de tema, lo revisa en busca de construcciones inseguras y las rechaza antes de que nada llegue a tu base de datos. 08 · Entre dominios Una plantilla de producto casi nunca se queda en la plantilla. -------------------------------------------------------------- El campo que quieres mostrar en una página de producto tiene que existir antes de poder mostrarse. El pedido detrás de ese producto vive en otra pantalla del admin. Lola declara afinidad con los demás addons de LolaCore, así que cuando una pregunta de Bricks cruza a otro dominio la sigue en la misma conversación. Con [LolaCore para ACF](/es/lolacore-para-acf/) activo, crea el campo personalizado y lo coloca en la plantilla de Bricks sin que cambies de contexto. Con [LolaCore WooCommerce Pro](/es/woocommerce-pro/) activo, monta el layout de producto aquí y habla contigo de los pedidos que produce allí. Con [LolaCore para Polylang](/es/lolacore-para-polylang/) activo, traduce páginas de Bricks a borradores de idioma enlazados, con el layout intacto. Instala los dominios que tu sitio usa de verdad. Lola enruta entre los que están activos. 09 · Requisitos Qué necesitas ------------- LolaCore2.7.0 o superior, gratuito, activo en el mismo sitio Bricks2.0 o superior, con licencia aparte de Bricks Builder WordPress7.0 o superior, probado hasta 7.1 PHP8.1 o superior WooCommerceOpcional. Si está activo, Lola gana 4 habilidades más Este addon no tiene página de ajustes ni una clave de API propia. Activas LolaCore, Bricks y este addon, y Lola descubre sola sus habilidades de Bricks. Luego eliges cómo quieres llegar a ella. Pulsas «Conectar con Claude» en el onboarding de LolaCore y autorizas, y trabaja desde la cuenta de Claude que ya tienes, en cualquier plan. O abres Ajustes → Conectores en WordPress, eliges el proveedor y el modelo que prefieras, y le hablas en el chat de wp-admin. El segundo botón del onboarding te lleva ahí. En los dos casos, Lola en el sitio aplica los cambios, enseña la vista previa y recuerda. 10 · Para desarrolladores Si ya trabajas por MCP ---------------------- La mayor parte de esta página habla al diseñador que vive Bricks como paneles. Tres cosas importan si lo vives como una API. Primero, cada habilidad corre contra las APIs públicas de Bricks. Las clases, variables, estilos de tema, plantillas y componentes que Lola escribe son los mismos registros que escribe la UI de Bricks, guardados igual, y Bricks los lee de vuelta sin un paso de traducción. Segundo, las 65 habilidades se exponen por el servidor MCP que LolaCore trae de serie bajo `lolacore-bricks/*`, vista previa con `dry_run` incluida. Conectas Claude Code, Cursor o cualquier cliente MCP a un sitio LolaCore y las herramientas de Bricks aparecen junto al resto de la superficie de LolaCore. El addon necesita LolaCore activo, porque LolaCore es quien publica el servidor MCP. Tercero, Lola construye su mapa del sitio en lotes al instalar, con el progreso visible en el chat, y lo mantiene después. Cualquier respuesta que descanse en ese mapa declara su cobertura, y puedes empujar una reconstrucción por lotes hasta que termine. 11 · Preguntas frecuentes Preguntas --------- ¿Necesito LolaCore para usar esto? Sí. Este addon le da a Lola el dominio de Bricks. Instala y activa LolaCore primero. ¿Necesito Bricks? Sí, el tema Bricks en la versión 2.0 o superior. Bricks es un producto comercial y la licencia la sacas de Bricks Builder. ¿Dónde queda Bricks cuando Lola está instalada? Bricks construye y renderiza el sitio, igual que hoy. Lola lee y escribe esos mismos registros por conversación. El builder está a un clic cuando quieras trabajar a mano. ¿Cuánto cuesta? Nada. Está en WordPress.org, sin clave de licencia y sin suscripción para este addon. ¿Y si no uso WooCommerce? Lola se queda con las 65 habilidades de sistema de diseño, página, plantilla y componente. Las 4 habilidades de tienda se registran cuando WooCommerce está activo. ¿Puedo usarlo desde Claude? Sí, y es el camino más corto. Instala LolaCore, pulsa «Conectar con Claude» en el onboarding, autoriza una vez y dile a Claude que trabaje en tu sitio Bricks. Corre en la cuenta de Claude que ya tienes, plan gratuito incluido. ¿Funciona desde Cursor o Claude Code? Sí. Lola lleva las mismas 65 habilidades a cualquier cliente MCP, con vista previa `dry_run` antes de cada escritura. ¿Necesito una clave de proveedor de IA en WordPress? Solo si quieres el chat de wp-admin. Configura el proveedor que prefieras en Ajustes → Conectores y Lola lo usa ahí. Si conectas por Claude, el razonamiento corre en tu cuenta de Claude y Lola en el sitio aplica los cambios, enseña la vista previa y recuerda. ¿Qué pasa si Lola no ha terminado de mapear el sitio? Declara el porcentaje de cobertura junto con la respuesta, y puede empujar el mapeo por lotes hasta completarlo. En preguntas que necesitan el retrato entero, como buscar clases sin uso, lo dice primero. ¿Puede Lola ejecutar PHP o JavaScript en un elemento Code? Guarda CSS personalizado en clases y estilos de tema, y lo revisa en busca de construcciones inseguras antes de que llegue a tu base de datos. El código ejecutable queda fuera de su alcance a propósito, por una decisión de seguridad. ¿Y si desactivo Bricks? Lola muestra un aviso de admin y sus habilidades de Bricks dejan de registrarse. Tu sitio sigue con el tema que esté activo. ¿Hay algo que configurar? Activa los tres plugins. Lola usa el proveedor de IA que hayas configurado en WordPress (Ajustes → Conectores), y este addon no añade claves ni cuotas propias. ¿Esto está afiliado con el equipo de Bricks? No. LolaCore para Bricks es un addon independiente hecho por LolaCore. No está afiliado, respaldado ni patrocinado por Bricks Builder. Lola lee tu sistema Bricks, y escribe dentro. --------------------------------------------- Instala el addon y Lola descubre sola las 65 habilidades de Bricks. No hay página de ajustes que configurar. Pulsas «Conectar con Claude» en el onboarding y llega a tu Bricks desde la cuenta de Claude que ya tienes. [Consíguelo gratis →](/install-lolacore-for-bricks) ¿Todavía no tienes LolaCore? LolaCore es el plugin gratuito de IA que vive dentro de tu escritorio de WordPress. Lee tu sitio, actúa con tu aprobación y recuerda todo entre sesiones. [Consigue LolaCore gratis →](https://wordpress.org/plugins/lolacore) Bricks lo desarrolla Bricks Builder. LolaCore para Bricks es un addon independiente hecho por LolaCore. No está afiliado, respaldado ni patrocinado por Bricks Builder. Bricks lo instalas y lo licencias tú.