Management plugin

The management plugin screen enables you to insert custom plugins into the Kuroco management pages. Currently, Kuroco supports 2 types of plugins:

  • Vue.js
  • CSS

Accessing the screen

In the left sidebar menu, under "SETTINGS", click [Environment] -> [Account].

fetched from Gyazo

On the account settings screen, click the [Management screen plugin] tab.

fetched from Gyazo

Item descriptions

fetched from Gyazo

Item/ButtonDescription
NameName of the plugin.
TypeType of plugin (CSS or Vue.js).
SourceLocation information for the plugin.
TargetManagement screen and slot for loading the plugin.
PropsYou can insert a JSON object with initial props to be read by Vue.js plugins. Certain pages and slots use additional props.
Last updatedDate and time the plugin was last updated.
EditClick [Settings] to open the configuration dialog.
DeleteClick to remove the plugin.

Adding and editing management plugins

  • To add a new plugin, click [Add] in the upper left corner of the screen.
  • To edit an existing plugin, click [Settings] under the "Edit" column.

After configuring the plugin contents, click [Add] or [Update] to apply the changes.

fetched from Gyazo

ItemSub-itemDescription
Publish settingsOption to activate the plugin settings.
Plugin nameName of the plugin.
TypeType of plugin (CSS or Vue.js).
SourceComponent nameFor Vue.js plugins, Kuroco supports MPAs (multi-page applications). Enter the component name of your MPA entry point here (e.g., MyEntryPoint).
URLUpload location of the plugin. This can be any domain.
Manifest keysFor Vue.js plugins, enter the list of Webpack manifest keys for the app components in the order of loading, separated by semicolons (e.g., MyEntryPoint.js;vendors.*). Values are based on your Webpack code splitting/chunking configurations.
TargetPage URIRelative URI of the Kuroco management page that will load your plugin. Omit the /management prefix. You can also specify any custom page, in which case the page will be accessible as exclusive content for the plugin.
Slot nameSlot that loads the plugin. Plugins can be loaded in various locations depending on their values. (See:Available slots and slot parameters below for details.)
Slot paramsSome pages allow slot params that configure specific conditions for loading the plugins. For example, the content editor page may load a plugin only for specific user groups.
PropsTo pass configurable props to your plugin, enter them here as JSON objects: e.g., {"my_prop": "my_prop_value"}.

Available slots and slot parameters

Vue.js plugins

Page RUIAvailable slotsAvailable slot parameters
anyEmpty-
/topics/topics_edit/ext_col_NNtopics_group_id=G
/inquiry/inquiry_report/list_main_top-
/inquiry/inquiry_bn_list/list_main_top-
/member/member_edit/Item name-

CSS plugins

Page URIAvailable slotsAvailable slot parameters
Anyhead-

If you have any other questions, please contact us or check out Our Slack Community.