Liferay Client Extensions, explained.
Practical tutorials and references for building Liferay Client Extensions in VS Code — Object Actions, Site Initializers, Theme CSS, and everything the docs leave out.
- 5 min read· announcement· ai
❯Meet CX Companion — the AI co-pilot for Liferay Client Extensions
CX Composer's AI graduates from Beta to Preview. CX Companion is a workspace-aware chat panel that scaffolds client extensions, edits yaml, pairs OAuth blocks, runs preflight validation, and queues every file write for review before anything hits disk. Plus: Website → Batch CX migration, broader schema coverage, and OpenAI-compatible endpoints.
- 8 min read· tutorial· object action
❯How to Scaffold a Liferay Object Action Microservice in VS Code
A step-by-step walkthrough of building a Liferay Object Action Client Extension — the yaml, the paired OAuth application, the Express handler, the Dockerfile, and the LCP.json manifest. Manual approach first, then how CX Composer collapses the whole thing to ten seconds.
- 9 min read· tutorial· web components
❯The Anatomy of a Custom Element — And How Liferay Uses Web Standards to Stay Framework-Agnostic
A guided tour through the Web Components standard as Liferay uses it — the class HTMLElement contract, the four lifecycle callbacks, and the small set of Liferay-specific hooks (SPA navigation, ThemeDisplay, authToken) that make a Custom Element feel native to DXP without dragging in a framework runtime. Explains why the standard is the "smart" choice: any team can bring React, Vue, Svelte, vanilla, or nothing at all, and they all coexist on the same page.
- 11 min read· tutorial· custom element
❯Inline-Editable Custom Elements in Liferay Using Slots
A pattern for building reusable Liferay Custom Element widgets whose content editors can inline-edit in the Page Editor. Uses Web Component <slot> elements mapped to Liferay editable regions via a companion Fragment. Full walkthrough with the client-extension.yaml, the Custom Element source, the Fragment wrapper, and how it all deploys together.
- 12 min read· reference· client-extension.yaml
❯client-extension.yaml Explained — Every Field, Every Type
A field-by-field reference for Liferay's client-extension.yaml manifest. What the top-level keys do, which fields every CX type requires, and the fields that trip developers up (assemble, oAuthApplicationUserAgent, resourcePath, url patterns).