Skip to content

Create You Own Custom Plugins for Here

Here App Dev edited this page Jul 25, 2020 · 15 revisions

Getting Started

Here App uses JavaScript for plugin development.

To get started creating a new plugin, follow the steps below.

  1. Navigate to the Here Plugin directory. Menu: [Debug] > [Reveal Plugins in Finder]
  2. Create a new directory and name it after the plugin (e.g. Plugin-Example).
  3. Create new files like the tree below.

You can also use Here Plugin Generator to create unofficial plugins.

Plugin Basics

A Here plugin includes those file inside.

├── Plugin-Example	// Plugin Example
    ├── config.json	// Plugin Configurations
    ├── index.js	// Main Script
    ├── appcast.xml	// Checking for Updates 
    ├── icon.png	// Plugin Icon
    ├── menuBarIcon.png	// menuBar Icon
    ├── LICENSE.md	// License File (e.g MIT License)
    └── README.md	// Plugin Information (e.g. Introduction, Readme, etc.)

./config.json

{
   "name": "Plugin Example",
   "identifier": "author.pluginexample",
   "version": "1.0.0",
   "description": "This is an example plugin for Here.",
   "icon": "icon.png",
   "createdBy": "author",
   "website": "https://example.com",
   "appcast": "https://plugins.herecdn.com/source/Plugin-Example/appcast.xml",
   "script": "index.js",
   "defaultCategory": "favs",
   "displayOn": [
      "mini"
   ]
}

./index.js

here.onLoad(() => {
    here.setMiniWindow({ title: "Hello World!" })
})

./appcast.xml

XML content sparkle:version="1.0.0" should be equal to "version": "1.0.0" from config.json.
Change the version number when you release a new version of your plugin.

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<rss xmlns:sparkle="http://www.andymatuschak.org/xml-namespaces/sparkle" 
    xmlns:dc="http://purl.org/dc/elements/1.1/" version="2.0">
    <channel>
        <item>
            <enclosure url="https://plugins.herecdn.com/downloads/Plugin-Example.hereplugin" sparkle:version="1.0.0"/>
        </item>
    </channel>
</rss>

./icon.png

Square image with size 200x200, support alpha transparency PNG.

Example:

icon.png icon.png

./menuBarIcon.png

Black color image with size 60x54, support alpha transparency PNG.

Example:

icon.png icon.png

./LICENSE.md

Published under the MIT License

./README.md

Support Markdown: Syntax

# Plugin Name

> This is my first plugin for Here.

## How to Use

1. First..
2. Then..
3. At last..

Now, everything is here!