skills.rest
umbraco
umbracoOFFICIAL
Explore all skills by this author →
WebsiteGitHub

umbraco-package-view

Create custom UI panels for Umbraco backoffice packages with manifest and element files.

26|13|Updated Nov 30, 2025
Search Tags:#manifest#extension development#umbraco#backoffice#custom ui#package view
One-click install
npx skills add https://github.com/umbraco/Umbraco-CMS-Backoffice-Skills --skill umbraco-package-view
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: umbraco-package-view
Source: https://github.com/umbraco/Umbraco-CMS-Backoffice-Skills/tree/main/plugins/umbraco-backoffice-skills/skills/umbraco-package-view
Command: npx skills add https://github.com/umbraco/Umbraco-CMS-Backoffice-Skills --skill umbraco-package-view

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill enables developers to create custom user interface panels for installed packages within the Umbraco backoffice, providing dedicated configuration and information pages.

Core Features & Use Cases

  • Custom UI Panels: Develop dedicated views for Umbraco packages that appear in the Packages section.
  • Developer Experience: Streamlines the creation of package-specific configuration or informational pages.
  • Use Case: A package developer needs to create a settings page for their new Umbraco package. This Skill will help them generate the necessary manifest and element files to display a custom configuration form within the Umbraco backoffice.

Quick Start

Use the umbraco-package-view skill to implement a package view for a package named 'My Package'.

Frequently Asked Questions about umbraco-package-view

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

FAQPage Schema
How do I create a custom UI panel for an Umbraco package in the backoffice?▼

To create a custom Umbraco package view, you generate a manifest and element file using either Lit or Vanilla JS, which integrates with Umbraco's foundation to render configuration panels in the backoffice Packages section.

What is a package view used for in Umbraco extension development?▼

A package view provides a dedicated user interface within the Umbraco backoffice Packages section, allowing developers to offer custom configuration forms or informational pages for installed packages.

Can I use Lit to build Umbraco backoffice custom UI for installed packages?▼

Yes, you can use Lit to build Umbraco package views. The skill supports creating element files with Lit or Vanilla JS that integrate directly with Umbraco's modal systems and foundation.

What files are needed to add a custom configuration page to the Umbraco Packages section?▼

Adding a custom configuration page requires generating a manifest file and an element file, which together define and render the custom UI panel within the Umbraco backoffice.

Does an Umbraco package view support integration with modal systems?▼

Yes, Umbraco package views support integration with the platform's modal systems. The generated element files connect directly with Umbraco's foundation to enable interactive UI components.

Related Skills

Explore More Software Engineering Skills→
umbracoumbraco
26

package-script-writer

Generates and executes Umbraco CMS installation scripts via Package Script Writer CLI.

Official
Intermediate
albanistalbanist
4

umbraco-package-view

Generate Umbraco package view UI components with manifest files using LitElement or Vanilla JS.

Community
Intermediate
albanistalbanist
4

umbraco-picker-data-source

Implement custom picker data sources for Umbraco backoffice property editors.

Community
Intermediate
kraftvaerkkraftvaerk

umbraco-routing

Implement Umbraco backoffice routing with `umb-router-slot` for custom sections and dashboards.

Official
Intermediate