← Widgets

A feedback widget that shows the board, not just a form

A feedback widget that is only a form is a hole you drop things into. Somebody writes an idea, presses send, and never finds out whether anybody read it or whether four other people had already asked for the same thing.

This widget shows the board instead. The visitor sees what has already been suggested, votes on the ones they agree with, and only writes something new when nothing there matches.

That difference is worth more than it sounds, and it works in both directions.

What does a visitor see?

The full feedback board, inside your page, with the cards, the vote counts and the ability to add to any of them.

If they do want to write something new, the suggestion form opens over the page rather than sending them somewhere else, so they never leave the thing they were doing.

Twenty cards arrive per column and a control fetches the next twenty, so a column holding four hundred requests does not land as four hundred cards. You can ask for more per page and the ceiling is a hundred.

You need a board before you have a key to paste, and a trial takes 14 days and a card.

The private board, with Pending approval holding four suggestions nobody has let through yet, Suggested beside it and Denied with the reason written on each card
The private board, where every new suggestion waits for approval.

What is the line you paste?

Two tags and one call, with the board you want named in it.

<link rel="stylesheet" href="https://app.votefirst.app/embed/votefirst.css">
<script src="https://app.votefirst.app/embed/votefirst.js"></script>
<script>
  VoteFirst.init({ project: 'your-project-slug', key: 'your-embed-key' });
  VoteFirst.board('#votefirst-board', { board: 'ideas' });
</script>

<div id="votefirst-board"></div>

The board option is the slug of the board you want drawn, so a product with several boards mounts several of these. There is a shorter call for the list on its own without the surrounding controls, being VoteFirst.features, and one for the most wanted few, being VoteFirst.topFeatures.

Every widget the script can draw is documented with its exact call, and the options each one accepts are listed with the events they emit.

How can a visitor order the board?

Seven ways, and the widget offers more of them than our own hosted page does.

The default is the order you arranged yourself, because the board somebody sees embedded should be the board you built. Past that they can sort by top, which is the score, or by votes, which is the plain headcount, or by newest, oldest, most discussed, or trending.

The difference between top and votes is worth a sentence, because it only shows up once you weight votes by revenue. Top reads the weighted total. Votes deliberately reads the raw headcount, which is what you want when the question is how many people rather than how much money.

Trending counts the votes cast in the last seven days rather than all of them, which is the sort that surfaces the thing that started mattering last Tuesday instead of the thing that has been top since March.

Whatever the sort, anything you have pinned comes first. That is true in all seven without exception, so the card you want a visitor to see is the card they see.

Search matches the heading and the description together. A percent sign or an underscore in what they type is searched for as itself rather than as a wildcard, so a person looking for a literal underscore finds one. Tag filtering works alongside it.

Why does showing the board matter?

Because a duplicate is worse than a missing request.

When somebody writes a request that already exists, you end up with two cards splitting the same demand, and neither one looks important. Somebody has to notice, merge them, and tell both people what happened. Do that fifty times and the board is a chore rather than a signal.

When the same person sees the existing card and votes on it instead, the count goes up, the ranking becomes true, and nobody has to do anything. The visitor also gets something a form never gives them, which is the knowledge that they are not the only one and that it is being tracked.

Can people vote without an account?

Yes, and that is the default rather than something you switch on.

The first time a signed out visitor writes anything, an anonymous identity is minted and kept in their own browser's storage. No cookies are used and no credentials are sent. The token is signed and bound to your project, so it cannot be reused anywhere else.

If you would rather your own signed in users appear as themselves, signing them in with a token is on the PRO plan.

The voter list, one row per person, showing where each arrived from and how many requests and comments they have left
Everyone who voted, one row each, no account required.

What happens to a new suggestion?

It is held for review and it does not appear on the board until you approve it.

That is true of every route into the product, including this widget. It means the board a visitor sees is one you have curated, and it means a queue you have agreed to work through. There is no setting to turn it off, and we would rather you knew that now.

Comments are the other way round. A comment is public the moment it is posted.

14 days, a card at signup, then $9 or $39 a month.

What does it cost?

Nothing beyond your plan. No widget is held back for the higher plan, so this works on the nine dollar plan.

The one exception is comments, and it is worth being exact about it. If the account behind the widget lapses, the embed stops accepting comments and stops showing the existing ones.

They are not deleted and they come back with the plan, but a visitor during a lapse sees a board with no discussion on it rather than a board with a disabled comment box.

Can I stop it loading on somebody else's domain?

Yes. The origin allowlist names which origins may use your public key, with exact matching or a subdomain wildcard that deliberately leaves out the bare domain.

An empty list allows every origin, which is what makes it work the moment you paste it in. Setting the list once you know where the widget lives is worth the two minutes.

How do I install it?

One script tag with your project and your public key, plus a container. It finds the container and initialises itself.

The longer form is a stylesheet, the script and an explicit setup call, for when you want to decide the moment it appears. Either way, calls made before the script loads queue rather than fail.

The roadmap widget embedded in an ordinary web page, drawing the board's columns as a grid of cards
The roadmap widget running inside an ordinary web page.

What it cannot do

It cannot show a board that is not public. There is no private board at any price, so a widget on an internal page still draws something anybody holding the public key can read.

Which widget is this, exactly?

The board widget, and the suggestion form modal that opens from it. They are two of the nine things the embed can draw, and this page describes them together because in practice nobody uses one without the other.

The other seven are the roadmap, the changelog, a top features list, a plain feature list, a vote button, a badge and a bug report form. All nine come from the same script and the same key, so adding a second one later is a container and a call rather than another purchase.

If you want the form on its own, with no board behind it, that is the suggestion form and it is a different page.

The public board a visitor reads, three columns wide, each request carrying its vote count, its views and its comment count
The public board, where anyone can post and vote without an account.

Related reading

A suggestion form nobody needs an account for A roadmap embedded on your own domain, on any plan