skills.rest
albanist
albanistCOMMUNITY
Explore all skills by this author →
GitHub

umbraco-package-view

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

4|Updated Mar 6, 2026
Search Tags:#manifest#umbraco#backoffice#custom ui#lit-element#package view
One-click install
npx skills add https://github.com/albanist/umbraco_CLI --skill umbraco-package-view-albanist
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: umbraco-package-view
Source: https://github.com/albanist/umbraco_CLI/tree/main/skills/extensions/umbraco-package-view
Command: npx skills add https://github.com/albanist/umbraco_CLI --skill umbraco-package-view-albanist

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

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

Core Features & Use Cases

  • Custom UI Panels: Develop dedicated views for Umbraco packages that appear in the Packages section.
  • Integration with Umbraco Ecosystem: Leverages Umbraco Foundation, Extension Registry, and Umbraco Element for building UI components.
  • Use Case: A package developer needs to create a custom settings page for their new Umbraco package, allowing administrators to configure its behavior directly within the Umbraco backoffice.

Quick Start

Generate a manifest and a LitElement for a new Umbraco package view named 'My Custom View' for a package called 'Awesome 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 custom UI panels for an Umbraco package in the backoffice?▼

You can build custom Umbraco package views by generating a manifest file and corresponding frontend elements using LitElement or Vanilla JS. This integrates dedicated configuration pages directly into the Umbraco backoffice.

Can I use LitElement to build a custom package view for Umbraco?▼

Yes, you can use LitElement to build a custom package view for Umbraco. The framework supports generating frontend elements with LitElement or Vanilla JS, leveraging the Umbraco Element registry for seamless UI integration.

What is the Umbraco extension registry and how does it work for package views?▼

The Umbraco extension registry is the integration mechanism that connects your custom package views with the backoffice. It allows package developers to register manifest files and custom UI components, enabling dedicated configuration pages within the Umbraco ecosystem.

Does this approach support adding a custom settings page to my Umbraco package?▼

Yes, this approach specifically supports adding a custom settings page to your Umbraco package. It enables administrators to configure package behavior directly within the Umbraco backoffice by generating dedicated UI views and manifests.

What's the best way to add a dedicated configuration page for an installed Umbraco package?▼

The best way to add a dedicated configuration page is by generating a custom package view using a manifest file and a LitElement component. This leverages the Umbraco Foundation and extension registry to seamlessly display package-specific UIs in the backoffice.

Do I need vanilla JS or a specific framework to generate Umbraco package manifests?▼

You do not strictly need vanilla JS, as the system supports both Vanilla JS and LitElement for generating frontend elements. The core requirement is creating the manifest file to register your custom UI with the Umbraco extension registry.

Related Skills

Explore More Software Engineering Skills→
kraftvaerkkraftvaerk

umbraco-header-apps

Create custom header applications in the Umbraco backoffice using extension points and LitElement.

Official
Intermediate
kraftvaerkkraftvaerk

umbraco-package-view

Create custom package views in the Umbraco backoffice.

Official
Intermediate
1k-off1k-off
1

umbraco-umbraco-element

Generate TypeScript Umbraco Elements using UmbElementMixin or UmbLitElement.

Community
Intermediate
albanistalbanist
4

umbraco-property-editor-ui

Generates TypeScript and manifest code for Umbraco property editor UIs.

Community
Intermediate