This widget lets you inlcude the Upvoted feature requests in any website.
Load the widget on your page:
<script
src="https://cdn.jsdelivr.net/gh/releasysaas/upvoted-embeddable-widget@2.0.1/dist/widget.js"
defer
data-client-key="YOUR_API_TOKEN"
data-class-name="dark"
></script>
Replace the data-client-key
value with the API token generated from the Upvoted backoffice. Use a token with Read & Write permission; read-only tokens cannot create requests, comments, or upvotes.
Set the data-class-name
value with dark
to load the widget in dark mode, otherwise leave it blank.
You can also embed the full board using the same script by switching the mode to board
.
Minimal example (inserts after the script tag):
<script
src="https://cdn.jsdelivr.net/gh/releasysaas/upvoted-embeddable-widget@2.0.1/dist/widget.js"
defer
data-mode="board"
data-client-key="YOUR_API_TOKEN"
data-class-name="dark"
></script>
Mount into a specific element:
<div id="upvoted-board-here"></div>
<script
src="https://cdn.jsdelivr.net/gh/releasysaas/upvoted-embeddable-widget@2.0.1/dist/widget.js"
defer
data-mode="board"
data-embed-target="#upvoted-board-here"
data-height="700px"
data-client-key="YOUR_API_TOKEN"
data-class-name="dark"
data-statuses="pending,in_progress,done"
></script>
Supported attributes in board mode:
data-mode
: board
to enable board embed. Default is widget
. data-embed-target
(optional): CSS selector where the board should mount. If omitted, the board is appended to document.body
after the script tag. data-client-key
: your API token (required), used as Authorization: Bearer <token>
. data-class-name
(optional): wrapper class, e.g. dark
. data-height
(optional): height to apply if the target has no explicit height. Defaults to 800px
. data-statuses
(optional): comma-separated list of status names to include (lowercased). If empty or omitted, loads all statuses. data-allow-feature-request
(optional): when true
, renders the standard request widget below the board while preserving the board layout.
Requires an API token with Read & Write permission. data-allow-feature-comment
(optional): when true
, shows a comment form inside the feature modal. Fields required: name, email, comment. Requires an API token with Read & Write permission. data-allow-feature-upvote
(optional): when true
, shows an Upvote action in the feature modal. Upvoting requires a contributor object with both name and email. Requires an API token with Read & Write permission. Example:
<div id="upvoted-board-here"></div>
<script
src="https://cdn.jsdelivr.net/gh/releasysaas/upvoted-embeddable-widget@2.0.1/dist/widget.js"
defer
data-mode="board"
data-embed-target="#upvoted-board-here"
data-client-key="YOUR_API_TOKEN"
data-allow-feature-request="true"
data-allow-feature-comment="true"
data-allow-feature-upvote="true"
></script>
Check out this page to see it in action.
data-allow-feature-upvote
: enable upvoting inside the modal. Requires contributor (name and email) to be provided. public_url
exists). data-allow-feature-request
: render request widget below the board without breaking board height. data-allow-feature-comment
: show a required comment form (name, email, comment) inside the modal. This project is licensed under the MIT License. See the LICENSE file for more information.
Releasy CORP, We Build SaaS and Productivity Tools!