Docs
Widget
The one-tag changelog, ideas and voting panel.
Install#
One script tag. It renders in a shadow root, so your CSS cannot break it and it cannot break yours.
<script src="https://shipnoted.com/widget.js" data-project="your-slug" async></script>Options, all optional:
data-position="left"moves the button to the bottom-left.data-label="Updates"changes the button text.data-trigger="#my-button"opens it from your own element and hides the floating button.data-feedback="false"hides the “Share an idea” tab.
window.Shipnoted.open() // open the panel
window.Shipnoted.close()
window.Shipnoted.unread() // number of unread releasesWhat visitors get#
- Updates: your recent releases, a dot on the button while there are unread ones, and a “You asked for this” mark on a release that answers something they voted for. Visitors get it in their own language where you made a translation.
- Share an idea: title and detail, existing look-alikes shown as they type so they vote instead of repeating, and (on Pro) a screenshot they can draw on and hide parts of.
- Vote: the open requests, one tap each.
It is about 10 KB gzipped, loads with async, and follows your project’s theme, accent colour and radius from Design.
Announcements and groups#
Tick Announce it in your app on a release and the widget pops it up once for each visitor, next to the button, instead of only showing the dot. Dismissing or opening it marks it seen.
A release can also be aimed at a group (plan:pro, beta:true). It stays off the public changelog and feeds; signed-in customers in that group see it in the widget. That needs the widget to know who they are:
Identify signed-in users#
<script src="https://shipnoted.com/widget.js" data-project="your-slug" data-user-token="TOKEN" async></script>
<!-- or, once you have the token -->
<script>window.Shipnoted?.identify("TOKEN")</script>The token is a short JWT your server signs; see Verified users. A token that has expired is dropped and the widget carries on for an anonymous visitor.