Sorry, we don't support your browser.  Install a modern browser

Widget

We built an embeddable widget you can integrate seamlessly into your website and added Single Sign-On support, eliminating the need for your existing users to sign in to Nolt to leave feedback. Our Single Sign-On mechanism means it’s easier than ever for your users to leave feedback and for you to know who it’s coming from, if you choose to.

Option 1: Feedback button

This is the easiest way to integrate Nolt into your website. Copy and paste the following code into the HTML of your website wherever you would like the button to appear and replace https://YOUR_BOARD.nolt.io with your board URL.

<a data-nolt="button" href="https://YOUR_BOARD.nolt.io">Feedback</a>
<script async src="https://cdn.nolt.io/widgets.js"></script>

Option 2: Initialize the Nolt modal manually

Paste this snippet before your </body> tag of your website. Replace the CSS selector placeholder so that it targets the element that should open the modal.

<!-- Nolt library -->
<script async src="https://cdn.nolt.io/widgets.js"></script>
<script>window.noltQueue=window.noltQueue||[];function nolt(){noltQueue.push(arguments)}</script>

<script>
  nolt('init', { 
    url: 'https://YOUR_BOARD.nolt.io', 
    selector: '.YOUR-CSS-SELECTOR'
  });
</script>

Identify your users (optional)

Using Single Sign-On, your existing users can automatically be authenticated to your Nolt widget. This provides a more seamless experience for them, and you also know exactly who is posting and voting. Learn more

<!-- Nolt library -->
<script async src="https://cdn.nolt.io/widgets.js"></script>
<script>window.noltQueue=window.noltQueue||[];function nolt(){noltQueue.push(arguments)}</script>
    
<script>
  nolt('identify', { 
    jwt: '<THE_JWT_THAT_YOU_GENERATED_FOR_THIS_USER>'
  });
</script>

Examples

React
import React, { Component } from "react";
import Script from "react-load-script";

const SDK_URL = "https://cdn.nolt.io/widgets.js";
const BOARD_URL = "https://YOUR_BOARD.nolt.io";
const JWT = "eyJhbGciOiJ...";

class NoltWidget extends Component {
  handleScriptCreate() {
    console.log("script created");
  }

  handleScriptError() {
    console.log("script error");
  }

  handleScriptLoad() {
    console.log("script loaded");
    const { nolt } = window;

    // Option 1:
    // Render an <a data-nolt="modal" /> element

    // Option 2:
    nolt("init", { selector: ".my-css-selector", url: BOARD_URL });

    // Single Sign-On
    nolt("identify", { jwt: JWT });
  }

  render() {
    return (
      <>
        <a data-nolt="modal" href={BOARD_URL}>
          Feedback (option 1)
        </a>

        <button className="my-css-selector">
          Feedback (option 2)
        </button>

        <Script
          url={SDK_URL}
          onCreate={this.handleScriptCreate.bind(this)}
          onError={this.handleScriptError.bind(this)}
          onLoad={this.handleScriptLoad.bind(this)}
        />
      </>
    );
  }
}

export default NoltWidget;
ElectronNolt widgets are currently not supported in Electron apps. Please use a regular link to open your Nolt board in the browser.