Hidden Mode
Hide the NOCK launcher and reveal it with a shortcut, URL parameter, secret gesture, or programmatic widget API.
Hidden mode installs the widget without showing the launcher by default. The feedback form still works; users need an intentional trigger to reveal or open it.
Use hidden mode for internal QA, white-labeled products, custom feedback buttons, or pages where a persistent launcher would interfere with your UI.
Enable hidden mode
Open Settings > Widget
Select the project and go to Settings > Widget.
Set Widget Mode
Change Widget Mode to Hidden (trigger only).
Choose triggers
Configure a keyboard shortcut and, optionally, a gesture target CSS selector.
Save Widget
Click Save Widget. Newly loaded widget sessions start hidden.
Warning
Hidden mode removes the visible launcher. Confirm at least one trigger works before using it for external users.
Reveal triggers
| Trigger | How it works |
|---|---|
| Keyboard shortcut | The shortcut configured in Settings > Widget opens the widget. Default is Ctrl+Shift+F, which fires on both Ctrl (Windows/Linux) and Cmd (macOS). |
| URL parameter | Add ?nock to the page URL to reveal the launcher. |
| Secret gesture | Set a CSS selector in Gesture Target. Five rapid clicks or taps on that element within two seconds reveal the launcher. |
| Session memory | After ?nock or the gesture reveals the launcher, the reveal is stored in sessionStorage for that browser session. |
The gesture target is selected from the host page, not inside the widget's Shadow DOM. Invalid selectors or missing elements are ignored.
Programmatic control
The script tag creates a <nock-widget> custom element. Your app can find it and call methods directly:
const widget = document.querySelector("nock-widget");
widget?.open();
widget?.close();
widget?.toggle();
widget?.reset();If you install the package form of the widget, initNock returns the element:
import { initNock } from "@nocknock/widget";
const widget = initNock({ token: "YOUR_PROJECT_TOKEN" });
widget?.open();You can also create the custom element yourself:
<nock-widget
data-project-token="YOUR_PROJECT_TOKEN"
data-api-base="https://nocknock.cloud"
></nock-widget>Submission event
The widget dispatches a nock:submit event before it sends the ticket. The event includes the form payload and auto-captured context.
document.addEventListener("nock:submit", (event) => {
console.log(event.detail);
});Use this for local analytics or QA hooks. Do not block ticket submission in this listener.