2 2.15 Develop a Plugin

github-actions[bot] edited this page 2026-05-18 12:53:52 +00:00

Table of Contents

• Develop a Plugin
• Quick Steps
• Full Documentation and Examples
• Related

Develop a Plugin

How to create and test a custom plugin for Super Productivity.

Plugins extend the app with custom UI, hooks (e.g. on task complete), and API access to tasks, projects, and counters. They run in a sandbox; iframe plugins must inline CSS and JavaScript.

Quick Steps

1. Create a folder with at least:
   • manifest.json (id, name, version, description, manifestVersion, minSupVersion)
   • plugin.js (runs on load; can register header buttons, shortcuts, hooks), or index.html for an iframe-only plugin
2. Add index.html and set iFrame: true in the manifest for custom iframe UI. If all behavior lives in index.html, plugin.js can be omitted.
3. In the app: Settings → Plugins → Load Plugin from Folder and select your plugin directory.
4. Use DevTools (F12 or Ctrl+Shift+I) to debug.

Full Documentation and Examples

The full plugin guide and API live in the repository:

docs/plugin-development.md

It covers:

• Manifest fields, plugin types (JavaScript vs iframe), and security
• Available API methods (tasks, projects, tags, counters, notifications, dialogs)
• Theme variables and UI Kit for iframe plugins
• Best practices and testing

Example plugins in the repo: packages/plugin-dev/yesterday-tasks-plugin, procrastination-buster, api-test-plugin. For UI-heavy plugins: packages/plugin-dev/boilerplate-solid-js. TypeScript API types: packages/plugin-api/src/types.ts.

Related

• 2.11-Run-the-Development-Server

1.00-Quickstarts

• 1.01-First-Steps
• 1.02-Configure-Data-Synchronization

2.00-How_To

Using Super-Productivity

• 2.01-Downloads and Install
• 2.02-Restore-Data-From-Backup
• 2.03-Add-Tasks
• 2.04-Manage-Subtasks
• 2.05-Manage-Scheduled-Tasks
• 2.06-Manage-Repeating-Tasks
• 2.07-Manage-Task-Integrations
• 2.08-Choose-Sync-Backend
• 2.09-Configure-Sync-Backend
• 2.19-Sync-Proton-Drive-via-rclone
• 2.13-Run-with-Docker

Contributing to Super-Productivity

• 2.18-Contribute-Translations
• 2.11-Run-the-Development-Server
• 2.16-Set-Up-Development-Environment
• 2.12-Package-the-App
• 2.14-Build-for-Android
• 2.15-Develop-a-Plugin
• 2.17-Add-a-New-Issue-Integration

3.00-Reference

• 3.01-API
• 3.02-Settings-and-Preferences
• 3.03-Keyboard-Shortcuts
• 3.04-Short-Syntax
• 3.05-Web-App-vs-Desktop
• 3.06-User-Data
• 3.07-Issue-Integration-Comparison
• 3.08-Sync-Integration-Comparison
• 3.09-Theming

4.00-Concepts

Data-and-Integrations

• 4.23-Managing-Your-Data
• 4.24-Integrations

Organizing

• 4.06-Project-View
• 4.07-Tag-View
• 4.08-Time-Estimates
• 4.09-Task-Attributes
• 4.10-Task-Notes
• 4.11-Subtasks

Planning

• 4.03-Planner-View
• 4.04-Schedule-View
• 4.12-Scheduled-Tasks
• 4.13-Repeating-Tasks
• 4.08-Time-Estimates

Doing

• 4.01-The-Today-View
• 4.02-Inbox-View
• 4.05-Board-View
• 4.14-How-Time-Is-Logged
• 4.15-Timers-and-Focus-Mode
• 4.16-Break-Reminders
• 4.17-Idle-Time
• 4.08-Time-Estimates

Reviewing

• 4.14-How-Time-Is-Logged
• 4.08-Time-Estimates
• 4.18-Reflection
• 4.19-Metrics
• 4.20-Task-Archiving
• 4.22-Quick-History
• 4.21-Worklog

If you have further questions, please refer to the discussions page.