umbraco-collection

Implement custom collections in the Umbraco backoffice with TypeScript and LitElement.

Updated Mar 6, 2026
One-click install
npx skills add https://github.com/kraftvaerk/Kraftvaerk.Umbraco.Alchemy --skill umbraco-collection-kraftvaerk
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: umbraco-collection
Source: https://github.com/kraftvaerk/Kraftvaerk.Umbraco.Alchemy/tree/main/Kraftvaerk.Umbraco.Alchemy.Frontend/.agents/skills/umbraco-collection
Command: npx skills add https://github.com/kraftvaerk/Kraftvaerk.Umbraco.Alchemy --skill umbraco-collection-kraftvaerk

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a comprehensive guide and code examples for implementing custom collections in the Umbraco backoffice, enabling developers to display, manage, and interact with lists of entities in a standardized and efficient manner.

Core Features & Use Cases

  • Customizable Views: Supports multiple views like tables and grids for data presentation.
  • Data Management: Integrates with repositories for data fetching and manipulation.
  • Interactive Elements: Includes support for filtering, pagination, selection, and bulk actions.
  • Use Case: Develop a custom collection to display a list of all "Products" in your Umbraco site, with options to filter by category, sort by price, and perform bulk actions like "Publish Selected".

Quick Start

Use the umbraco-collection skill to create a new table view for a custom product collection.

Frequently Asked Questions about umbraco-collection

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

FAQPage Schema
How do I build a custom collection in the Umbraco backoffice?

You can create custom Umbraco backoffice collections using TypeScript and LitElement. This provides configurable views, repositories, and context APIs to display and interact with structured entity lists.

What is the best way to display entity lists in Umbraco with filtering and pagination?

Using a custom Umbraco collection is the best way to display entity lists with filtering and pagination. Collections integrate with repositories for data fetching and support interactive elements for bulk actions.

Can I use LitElement to create table and grid views for Umbraco CMS data?

Yes, you can use LitElement to create custom Umbraco collections. It supports customizable views like tables and grids for structured data presentation within the backoffice.

How do I add bulk actions to a product list in the Umbraco backoffice?

You add bulk actions to an Umbraco product list by implementing a custom collection. It provides interactive elements that support selection and actions like publishing multiple selected items.

Does Umbraco support custom repositories for fetching data in backoffice collections?

Yes, custom Umbraco collections integrate with repositories for data fetching and manipulation. This allows developers to manage how entity data is loaded and displayed in the backoffice.