Step-by-step guide: Create a custom plugin in Sisense

Purpose of custom plugins

Custom plugins in Sisense empower users to extend and tailor the platform's capabilities by integrating custom JavaScript code directly into dashboards. These plugins enable:

• Interactive Controls: Add buttons, menus, or other UI elements to enhance user interaction.
• Dynamic Filter Management: Programmatically read, set, or clear dashboard filters based on specific conditions.
• REST API Integration: Interact with Sisense's REST APIs to perform actions like exporting data or retrieving dashboard information.
• UI Customization: Modify the dashboard's appearance or behavior to meet specific user requirements.
• Advanced Functionality: Implement features beyond standard widgets, such as rotating filter values or custom data visualizations.

Plugins are stored on the Sisense server and execute automatically upon dashboard loading, ensuring consistent behavior across user sessions.

When to use custom plugins

Consider developing a custom plugin when:

Where Sisense Linux expects plugins

Sisense on Linux looks for custom plugins here:

/opt/sisense/storage/plugins/

Sisense automatically reads any plugin folder here and injects it into the dashboard UI.  Any .js, .json, or .css files placed inside a plugin directory here will be loaded automatically by the Sisense web application.

What goes into a Sisense plugin?

Every Sisense plugin usually contains:

Step-by-step plugin with explanations

Let’s walk through each file.

plugin.json — The Plugin Manifest

{
  "name": "MyCustomPlugin",
  "pluginInfraVersion": 2,
  "isEnabled": true,
  "source": ["main.6.js"],
  "style": []
}

What Each Line Means:

main.6.js — The plugin logic

console.log("MyCustomPlugin loaded!");

prism.on('dashboardloaded', function(event, args) {
  console.log("Dashboard loaded:", args.dashboard.title);
});

What this code does:

Add CSS (Optional)

You can also style elements on the dashboard.

style.css

body {
  background-color: #f7faff;
}

Update plugin.json to:

{
  "name": "MyCustomPlugin",
  "pluginInfraVersion": 2,
  "isEnabled": true,
  "source": ["main.6.js"],
  "style": ["style.css"]
}

Reload the dashboard to see the background color change.

How to test if the plugin works (not using the optional files)

1. Open a Sisense dashboard in your browser.
2. Right-click → Inspect → Console tab.
3. Reload the dashboard.

You should see this (in the above code example):

MyCustomPlugin loaded!
Dashboard loaded: [Your Dashboard Name]

This confirms:

• Sisense recognized the plugin.
• Your main.6.js was loaded.
• The dashboard events are being detected correctly.

If you see nothing…

Here’s what to check:

Example: config.6.js — Optional plugin configuration file

This file stores settings you might want to change without editing the core main.6.js code. For example, default filter values, color codes, or feature toggles.

// Configuration file for MyCustomPlugin

var MyCustomPluginConfig = {
  defaultFilterName: "Filter One",     // Default name of the filter to modify
  defaultFilterValues: ["Value A"],    // Default values to apply to that filter
  enableButton: true,                  // Toggle to show/hide custom button
  apiBaseUrl: "https://api.example.com"// Optional: URL to an external system
};

Example: style.css — Optional custom CSS file

This file applies custom styling to elements added by your plugin, such as buttons, messages, or popups.

/* Custom style for MyCustomPlugin */

.my-custom-plugin-button {
  background-color: #007bff;   /* Blue background */
  color: white;                /* White text */
  padding: 8px 12px;           /* Spacing inside the button */
  border: none;                /* No border */
  border-radius: 4px;          /* Rounded corners */
  cursor: pointer;             /* Hand cursor on hover */
  font-size: 14px;             /* Font size */
}

.my-custom-plugin-button:hover {
  background-color: #0056b3;   /* Darker blue on hover */
}

.my-custom-message {
  font-style: italic;
  color: #999999;
  margin-top: 10px;
}

References/related content

These links cover everything from hello-world plugins to advanced UI hacks and Linux-specific deployment tips.

Disclaimer: This post outlines a potential custom workaround for a specific use case or provides instructions regarding a specific task. The solution may not work in all scenarios or Sisense versions, so we strongly recommend testing it in your environment before deployment. If you need further assistance with this, please let us know.