craft-site
openbooklet.com/s/craft-siteopenbooklet.com/s/craft-site@1.0.0GET /api/v1/skills/craft-siteCraft CMS 5 front-end Twig development â atomic design, template architecture, component patterns, Vite buildchain. Covers the full site template surface: atoms, molecules, organisms, props/extends/block pattern, layout chains, view routing, content builders, image presets, Tailwind named-key collections, multi-brand CSS tokens, JavaScript boundaries (Alpine/DataStar/Vue), Vite asset loading. Triggers on: {% include ... only %}, {% embed %}, _atoms/, _molecules/, _organisms/, _views/, _builders/, _boilerplate/, component--variant.twig, _component--props.twig, image presets, Tailwind class collections, collect({}), utilities prop, multi-brand theming, data-brand, hero sections, card components, content builders, Matrix block rendering, craft.vite.script, vite.php, vite.config.ts, nystudio107, buildchain, asset loading, per-page scripts. Always use when creating, editing, or reviewing any Craft CMS front-end Twig template, component, layout, view, builder, or buildchain configuration.
Craft CMS 5 content modeling â sections, entry types, fields, Matrix, relations, project config, and content architecture strategy. Covers everything editors and developers need to structure content in Craft. Triggers on: section types (single, channel, structure), entry types, field types, field layout, Matrix configuration, nested entries, relatedTo, eager loading, .with(), .eagerly(), categories, tags, globals, global sets, preloadSingles, propagation, multi-site content, URI format, project config, YAML, content architecture, content strategy, taxonomy, asset volumes, filesystems, image transforms, user groups, permissions, entries-as-taxonomy, entrify, entrification, CKEditor vs Matrix, CMS editions. Always use when planning content architecture, creating sections/fields, configuring Matrix, setting up relations, or making content modeling decisions.
Garnish â Craft CMS's built-in JavaScript UI toolkit for the control panel. Covers the full Garnish surface: class system (Garnish.Base.extend, init, setSettings, addListener, on/off/trigger, destroy), UI widgets (Modal, HUD, DisclosureMenu, MenuBtn, SelectMenu, CustomSelect, ContextMenu, Select), drag system (BaseDrag, Drag, DragSort, DragDrop, DragMove), form widgets (NiceText, CheckboxSelect, MixedInput, MultiFunctionBtn), utilities (key constants, ARIA helpers, focus management, custom jQuery events), and Craft integration (GarnishAsset, webpack externals, Craft.* class pattern). Triggers on: Garnish.Base.extend, Garnish.Modal, Garnish.HUD, Garnish.DragSort, Garnish.Select, Garnish.DisclosureMenu, Garnish.MenuBtn, Garnish.CustomSelect, new Garnish, addListener, removeListener, removeAllListeners, Garnish.ESC_KEY, Garnish.RETURN_KEY, Garnish.SPACE_KEY, Garnish.TAB_KEY, activate event, textchange event, $.fn.activate, UiLayerManager, uiLayerManager, registerShortcut, trapFocusWithin, setFocusWithin, garnishjs, GarnishAsset, CpAsset, CP JavaScript, control panel JS, drag and drop, sortable, modal dialog, HUD popover, disclosure menu, menu button, Craft.CP, Craft.Slideout, Craft.ElementEditor, velocity(), .draghelper, helperOpacity, onSortChange, onOptionSelect, onSelectionChange, aria-modal, aria-expanded, aria-controls, focus trap, keyboard navigation CP, this.base(), $.noop, Garnish.hitTest, Garnish.within, Garnish.isCtrlKeyPressed, window.Garnish, expose-loader. Always use when writing, editing, or reviewing JavaScript that runs in the Craft CMS control panel â including plugin CP assets, custom field type JS, element index JS, CP webpack config, or any code that imports from 'garnishjs' or references window.Garnish. Also trigger when discussing Craft CP accessibility, keyboard interactions, or drag-sort behavior.
Craft CMS 5 PHP coding standards and conventions. ALWAYS load this skill when writing, editing, reviewing, or discussing any PHP file in a Craft CMS plugin or module â even for small edits. Also load when running ECS, PHPStan, or scaffolding with ddev craft make. Covers: PHPDoc blocks (@author, @since, @throws chains), section headers (=========), class organization, naming conventions, defineRules(), beforePrepare(), addSelect(), MemoizableArray, DateTimeHelper vs Carbon, enums, control flow patterns, CP Twig template conventions, form macros, translations (Craft::t), ECS/PHPStan configuration, scaffolding commands, commit messages, and the verification checklist. If you are touching PHP code in a Craft CMS context, you need this skill.
Scaffold Claude Code configuration for a Craft CMS project. Generates CLAUDE.md and .claude/rules/ tailored to the project type (plugin, site, module, or hybrid). Use when the user says 'set up Claude for this project', 'initialize CLAUDE.md', 'scaffold project config', 'configure Claude Code', 'set up this Craft project', or when starting work in a new Craft CMS project that has no CLAUDE.md. Also use when the user mentions 'project setup', 'bootstrap', or asks how to configure Claude Code for their Craft project.
Twig coding standards and conventions for Craft CMS 5 templates. Covers variable naming, null handling, whitespace control, include isolation, Craft Twig helpers ({% tag %}, tag(), attr(), |attr, svg()), and collect() usage. Triggers on: any Twig template creation or review, .twig files, {% include %}, {% extends %}, {% tag %}, collect(), props.get(), .implode(), attr(), |attr filter, svg(), ?? operator, whitespace control, template coding standards, Twig best practices, naming conventions for Twig, currentSite, siteUrl, craft.entries, .eagerly(), .collect. Not for Twig architecture patterns (use craft-site) or PHP code (use craft-php-guidelines). Always use when writing, editing, or reviewing any Craft CMS Twig template code.
Craft CMS 5 plugin and module development â extending Craft. Covers the full extend surface: elements, element queries, services, models, records, project config, controllers, CP templates, migrations, queue jobs, console commands, field types, native fields, events, behaviors, Twig extensions, utilities, widgets, filesystems, debugging, testing, and GraphQL. Triggers on: beforePrepare(), afterSave(), defineSources(), defineTableAttributes(), attributeHtml(), MemoizableArray, getConfig(), handleChanged, $allowAnonymous, $enableCsrfValidation, BaseNativeField, EVENT_DEFINE_NATIVE_FIELDS, FieldLayoutBehavior, EVENT_REGISTER, EVENT_DEFINE, EVENT_BEFORE, EVENT_AFTER, CraftVariable, registerTwigExtension, DefineConsoleActionsEvent, PHPStan, Pest. Always use when writing, editing, or reviewing any Craft CMS plugin or module code.
DDEV local development environment for Craft CMS projects. Covers config.yaml settings (project type, PHP/Node versions, database, docroot), shorthand commands (ddev composer, ddev craft, ddev npm), add-ons (Redis, Mailpit), custom commands (.ddev/commands/), Vite dev server exposure (web_extra_exposed_ports, web_extra_daemons), database import/export, Xdebug toggling, and troubleshooting. Triggers on: ddev start, ddev craft, ddev composer, ddev ssh, ddev import-db, ddev xdebug, .ddev/config.yaml, web_extra_exposed_ports, web_extra_daemons, ddev add-on, ddev poweroff, ddev describe. Use when running DDEV commands, configuring local environments, or troubleshooting container issues.
Auto-indexed from michtio/craftcms-claude-skills
Are you the author? Claim this skill to take ownership and manage it.
Related Skills
graceful-error-recovery
Use this skill when a tool call, command, or API request fails. Diagnose the root cause systematically before retrying or changing approach. Do not retry the same failing call without first understanding why it failed.
audience-aware-communication
Use this skill when writing any explanation, documentation, or response that will be read by someone else. Match vocabulary, depth, and format to the audience's expertise level before writing.
Refactoring Expert
Expert in systematic code refactoring, code smell detection, and structural optimization. Use PROACTIVELY when encountering duplicated code, long methods, complex conditionals, or any code quality issues. Detects code smells and applies proven refactoring techniques without changing external behavior.
Research Expert
Specialized research expert for parallel information gathering. Use for focused research tasks with clear objectives and structured output requirements.
clarify-ambiguous-requests
Use this skill when the user's request is ambiguous, under-specified, or could be interpreted in multiple ways. If proceeding with a wrong assumption would waste significant work, always ask exactly one focused clarifying question before doing anything.
structured-step-by-step-reasoning
Use this skill for any problem that involves multiple steps, tradeoffs, or non-trivial logic. Think out loud before answering to improve accuracy and transparency. Apply whenever the answer is not immediately obvious.