Core Components
Who this page is for
| Audience | Why it matters to you |
|---|---|
| All engineers | The "check before you build" catalogue |
What they are
Adobe's open-source, versioned component library (GitHub: adobe/aem-core-wcm-components): text, title, image, button, teaser, list, navigation, breadcrumb, form components, embed, carousel, tabs, accordion, content fragment, experience fragment, and the page component itself. Production-grade: accessible, exporter-enabled (JSON), style-system-ready.
The proxy pattern
You never use them directly; you create proxy components in /apps that point at them:
/apps/phi-academy/components/title/
.content.xml → sling:resourceSuperType = core/wcm/components/title/v3/title
componentGroup = "PHI Academy"The proxy is your stable namespace: content references YOUR resourceType, so upgrading core component versions is a superType change, not a content migration. The archetype generates proxies for common components.
Extension ladder (least → most effort)
| Level | Mechanism | Example |
|---|---|---|
| 1. Configure | Template policy options | Allowed heading levels on Title |
| 2. Style | Style System classes | "Featured" plan-card look |
| 3. Re-skin | Override just the HTL in your proxy | Custom teaser markup, product model kept |
| 4. Extend model | Sling Model delegation (pattern) | Prefix logic on Title text |
| 5. New component | Own HTL + dialog + model | Plan benefits table (no core equivalent) |
Stop at the lowest level that works. Level-5 rebuilds of things core already does (image handling especially) are the most common wasted month in AEM projects.
PHI example mapping
| Plan page need | Answer |
|---|---|
| Hero banner | Teaser (styled) |
| Benefits table | Custom component (level 5 — genuinely custom) |
| CTA button | Button proxy |
| Plan FAQ | Accordion proxy |
| Disclaimers | Text + CF reference |