A specialized framework extension that enables plugins to register and display custom UI views and sidebar tabs within the Control dashboard.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install plugin-architecture
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install plugin-architecture using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Plugin Architecture?
The Plugin Architecture skill provides the necessary infrastructure for modular UI expansion in the OpenClaw ecosystem. By implementing a standardized registration pattern, it allows developers to inject custom views, subtitles, and icons directly into the main navigation sidebar. This skill bridges the gap between backend plugin logic and frontend visibility, making it a foundational piece for building complex Openclaw Skills that require user interaction beyond simple chat interfaces.
Plugin Architecture Use Cases
- Adding a specialized data visualization dashboard for a specific plugin.
- Creating a dedicated configuration tab for complex agent workflows.
- Organizing plugin-specific logs or metrics within the Agent or Control navigation groups.
- Customizing the sidebar layout to improve the accessibility of frequently used plugin features.
How Plugin Architecture Works
- The skill is installed into the environment by the AI agent following strict architectural guidelines found in the instruction files.
- Individual plugins invoke the api.registerView method during their initialization or registration phase.
- The architecture captures the view metadata, including ID, label, icon, and sidebar group positioning.
- The Control UI dynamically renders these registered components in the specified sidebar locations such as Chat, Control, Agent, or Settings.
Plugin Architecture Setup
This skill requires manual installation by your agent. Copy the folder to your skills directory and then issue the following prompt to your agent:
Please install the plugin-architecture skill. Read the INSTALL_INSTRUCTIONS.md file in the skill folder and follow it step by step. The skill is at: ~/clawd/skills/plugin-architecture/
Plugin Architecture Data Schema & Taxonomy
The registration system utilizes a specific metadata schema to organize UI elements. Developers should provide the following fields through the API when building Openclaw Skills:
| Field | Type | Description |
|---|---|---|
| id | string | Unique identifier for the UI view |
| label | string | The primary display name in the sidebar |
| subtitle | string | A short description shown beneath the label |
| icon | string | Name of the icon from the supported icon set |
| group | string | The navigation group (Chat, Control, Agent, Settings) |
| position | number | Numeric value to determine order within the group |
Plugin Architecture Advanced Features
- Flexible Navigation Mapping: Place custom views in any of the four primary nav groups (Chat, Control, Agent, or Settings).
- Precise Ordering: Use the position attribute to control exactly where your plugin appears relative to other Openclaw Skills.
- Safety-First Implementation: Uses feature detection to ensure plugins only attempt registration if the API is available.
- Reference Implementation: Includes a reference directory with code samples to accelerate development of new UI-capable plugins.
SKILL.md
Loading
Related Openclaw Skills
Playwright Browser Setup
A streamlined utility for configuring headless Playwright Chromium automation within Clawdbot environments.
OpenClaw VPS Hardening
A comprehensive seven-layer defense-in-depth strategy designed to secure OpenClaw agents on public VPS instances using Cloudflare Zero Trust architecture.
Maton AI
A comprehensive integration skill that connects AI agents to over 50 SaaS platforms via unified OAuth management and a dedicated UI dashboard.
Lead Scorer
An automated qualification engine that scores website health and syncs high-priority prospects to Google Sheets.
React Local Business Website Generator
A specialized skill for generating production-ready, 5-page React websites for local businesses with modern animations and responsive design.
Serper Search Skill
A high-performance, cost-effective Google Search API integration for programmatic data retrieval and lead generation.
Featured*
