umbraco-preview-app-provider

Create custom preview app providers in the Umbraco backoffice.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill enables developers to add custom tools and functionalities directly into the Umbraco content preview window, enhancing the content editing and review experience.

Core Features & Use Cases

  • Custom Preview Tools: Integrate features like device simulation, accessibility checks, or SEO analysis into the Umbraco preview.
  • Contextual Information: Access preview state and content context for dynamic tool behavior.
  • Use Case: A team wants to ensure their content looks perfect on mobile devices. They can use this Skill to add a device simulator to the preview, allowing editors to switch between desktop, tablet, and mobile views without leaving Umbraco.

Quick Start

Use the umbraco-preview-app-provider skill to create a new preview app that simulates different device sizes.

Frequently Asked Questions about umbraco-preview-app-provider

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

FAQPage Schema
How do I add custom preview apps to the Umbraco backoffice?

To add custom preview apps to the Umbraco backoffice, you create a custom preview app provider using official extension patterns. This integrates custom tools like device simulators directly into the content preview window.

Can I simulate mobile and tablet views in Umbraco content preview?

Yes, you can simulate mobile and tablet views in Umbraco content preview by building a custom preview app provider. This allows editors to switch between device sizes without leaving the Umbraco backoffice.

What are Umbraco preview app providers and when do I need them?

Umbraco preview app providers are extension patterns that enable custom functionalities within the content preview window. You need them when integrating contextual tools like accessibility checks or SEO analysis for content editors.

Do I need the Extension Registry to build a custom Umbraco preview app?

Yes, building a custom Umbraco preview app requires adhering to Umbraco's Foundation and Extension Registry guidelines. These guidelines govern the manifest and element implementation needed for the custom app.

Can I run accessibility checks directly inside the Umbraco preview window?

Yes, you can run accessibility checks directly inside the Umbraco preview window by creating a custom preview app provider. This Skill facilitates integrating custom accessibility tools that access the preview state dynamically.