craft-twig-guidelines

Standardize Twig template coding conventions for Craft CMS 5.

66|6|Updated Apr 7, 2026
One-click install
npx skills add https://github.com/michtio/craftcms-claude-skills --skill craft-twig-guidelines
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: craft-twig-guidelines
Source: https://github.com/michtio/craftcms-claude-skills/tree/main/skills/craft-twig-guidelines
Command: npx skills add https://github.com/michtio/craftcms-claude-skills --skill craft-twig-guidelines

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Twig coding standards and conventions to ensure consistent, maintainable Craft CMS 5 templates across teams and projects.

Core Features & Use Cases

  • Enforces consistent variable naming (camelCase, no abbreviations) and robust null handling with ?? (and the optional ??? plugin if present).
  • Guidelines for whitespace control, include isolation (always use 'only'), and usage of Craft Twig helpers (tag, attr, |attr, |parseAttr, |append, svg()).
  • Promotes collect() usage for props and class collections, and requires comment headers in components for clarity and maintainability.
  • Helps avoid common pitfalls like snake_case, macros for components, and hardcoded colors, enabling scalable template development.

Quick Start

Start applying these Twig conventions whenever creating, editing, or reviewing any .twig file in a Craft CMS 5 project to ensure consistent templates.

Frequently Asked Questions about craft-twig-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I standardize Twig templates in Craft CMS 5 to reduce rendering defects?

Standardize Twig templates in Craft CMS 5 by enforcing consistent variable naming, robust null handling using the ?? operator, and strict include isolation to ensure predictable rendering and maintainable components across teams.

What is include isolation in Twig and how does it prevent component defects?

Include isolation in Twig requires passing variables using the 'only' keyword, preventing unintended variable leakage into components and ensuring predictable, defect-free rendering across your Craft CMS templates.

How do I handle null values in Craft CMS Twig templates safely?

Handle null values safely in Craft CMS Twig templates by using the ?? operator for fallbacks, optionally leveraging the ??? plugin if present, to prevent unpredictable rendering and template defects.

Does this Twig coding standard support atomic components and frontmatter metadata?

Yes, these Twig coding standards apply to atomic components, views, and layouts, enforcing frontmatter-driven metadata and requiring comment headers for clarity and maintainable template architecture.

Why should I use collect() for props in Craft CMS Twig templates?

Use collect() for props and class collections in Craft CMS Twig templates to standardize data handling, avoid hardcoded colors, and enable scalable, maintainable component architecture without relying on macros.

What are the limitations of using macros for Twig components in Craft CMS?

Using macros for Twig components in Craft CMS is discouraged as it leads to inconsistent template architecture; standardizing on includes with strict isolation and frontmatter-driven metadata ensures more maintainable and predictable results.