More screenshots

    Works with the AI tools you already use

    Claude CodeClaude CodeCursorCursorCodex CLICodex CLIGitHub CopilotGitHub CopilotGemini CLIGemini CLI+20 more

    Bricks Builder Skill

    1

    An AI-assisted development Skill for WordPress sites built with the Bricks visual site builder theme.

    $8

    Secure checkout via Stripe

    30-day refund guarantee

    Converts to your local currency at checkout

    0 installsSecurity scanned
    Bricks Builder Skill

    Bricks Builder Skill

    Example session with this skill installed

    $bricks-builder Build a reusable Product Card for a Bricks-based WordPress shop page.

    The card should include

    • product image;
    • product title;
    • price;
    • short description;
    • call-to-action button.

    Use Bricks Components where appropriate, and bind the product-specific fields with Dynamic Data.

    Then place the card inside a Query Loop so the page can render a product grid from WordPress content.

    Before changing anything

    • inspect the current Bricks structure and active version;
    • identify which values should belong to the reusable component and which should vary per product;
    • check the relevant Bricks Components, Dynamic Data, and Query Loop documentation.

    Preserve existing global classes and design tokens.

    After implementation, verify the card in Builder and on the frontend at desktop, tablet, and mobile breakpoints.

    • Read your context and instructions
    • Compiled the bricks builder
    • Generated the UI component

    Product Card implementation plan

    A reusable Product Card can be built as a Bricks Component and rendered inside a Query Loop.

    Recommended structure

    Product Card
├── Image
├── Content
│   ├── Product Title
│   ├── Price
│   └── Short Description
└── CTA Button

    bricks-builder-skill.tsx

    TSX · React component

    Generated

    Example file from a real run - the skill writes it into your workspace.

    Connects securely to your tools. The creator never sees your data.

    What you get

    Build Bricks-based WordPress pages and layoutsCreate reusable Bricks components and product cardsImplement Query Loops and Dynamic DataDevelop Bricks hooks, filters, and custom elementsReview and troubleshoot Bricks Builder implementationsValidate responsive layouts and breakpointsPlan documentation-grounded Bricks development changes

    About this skill

    Bricks Builder Skill is an AI-assisted development Skill for WordPress websites built with Bricks, the visual site builder theme for WordPress.

    It helps AI coding agents research, build, modify, review, and maintain Bricks-based WordPress sites using structured, version-aware documentation instead of relying only on generic model knowledge.

    The Skill includes a synchronized Bricks Academy documentation corpus, searchable indexes, development workflows, supporting references, and an English handbook for practical use.

    Typical use cases

    • Building and maintaining Bricks-based WordPress websites
    • Page, template, header, footer, and full-site layout development
    • Dynamic Data and Query Loop implementation
    • Components, global classes, variables, and Theme Styles
    • Responsive layout and breakpoint review
    • Interactions, conditions, hooks, and filters
    • Custom PHP, JavaScript, and CSS for Bricks-based sites
    • Troubleshooting Bricks-specific behavior
    • Reviewing existing Bricks implementations
    • Version-aware research against Bricks documentation

    Designed for AI-assisted Bricks development

    Bricks combines a WordPress theme with a visual site builder, allowing developers to visually create pages, templates, headers, footers, and other site structures while still supporting deeper development workflows.

    This Skill is designed to make AI-assisted Bricks development more reliable, maintainable, and documentation-grounded.

    Included handbook

    The package also includes the Bricks Builder Skill Handbook, with practical guidance for installation, workflows, research, and AI-assisted Bricks development.

    Installation

    A lightweight bootstrap Skill installs the latest published version of the complete Bricks Builder Skill into your Agent Skill directory.

    How to install

    Works the same in every agent - Claude, Cursor, Codex, Copilot and 20+ more.

    ~30 seconds
    1. 1

      Download the ZIP

      Free skills download straight away. Paid skills unlock right after purchase.

    2. 2

      Unzip into your skills folder

      Every agent reads skills from one folder on your machine. Drop the unzipped folder in there.

    3. 3

      Ask your agent to use it

      Restart the agent if it was already running. It picks the skill up automatically - no config needed.

    Skills folder by agent

    Click the path to copy it. Create the folder if it does not exist yet.

    Reviews

    No reviews yet

    Be one of the first to try it. Every listed skill passes our trust checks below.

    Security scanned

    Passed our 8-point scan before listing

    Fresh listing

    Recently published to Agensi

    30-day refund

    Not a fit? Get your money back

    Trust & safety

    Security scanned

    Verified clean today

    • Passed all security checks, Safe to install

    Listedtoday

    What's inside

    Frequently Asked Questions