Setup Popover/Popup

The All-In-One Widget is a versatile tool that allows you to implement a compact version of the public feedback hub directly on your website.

This widget offers various features, including the ability for users to submit feedback, view and upvote existing posts, and access the changelog.

​

Installation

To install the All-In-One widget, add the following code snippet:

<script id="supahub" type="text/javascript">
  (function (h, u, b) {
    var g = h.createElement(u), s = h.getElementsByTagName(u)[0];
    (g.id = b), (g.src = "https://widget.supahub.com/sdk.js"), s.parentNode.insertBefore(g, s);
    g.onload = function () {
      window.SupahubWidget("portal", {
        workspaceName: "workspace-name", // Required: Copy your workspace name from 'workspace-name.supahub.com'
        theme: "light", // Required: Options ("dark" | "light")
        displayType: "popover", // Required: Options ("popover" | "popup")
        position: "right", // Optional: Options ("right" | "left")
        jwtToken: "Generated_JWT_Token", // Optional: Replace with the token generated from your server
      });
    };
  })(document, "script", "supahub-sdk");
</script>

​

Usage

​

Floating Button

By default, the Supahub widget will display a floating button in the bottom-right corner of your website. When a user clicks this button, the feedback widget will open, allowing them to submit feedback or browse existing posts.

​

Trigger Popover View

To trigger the popover view of the All-In-One widget and hide the default floating button, add the data-supahub-portal-popover attribute to a button element:

<button data-supahub-portal-popover>Feedback</button>

​

Trigger Popup View

To trigger the popup view of the All-In-One widget and hide the default floating button, add the data-supahub-portal-popup attribute to a button element:

<button data-supahub-portal-popup>Feedback</button>