To let people vote from inside your product, put one feature on the page where somebody is already thinking about it. Every other widget here brings a board to your site and this one does the opposite.
It is the smallest thing the embed can draw and it is the one people forget exists.
What is it for?
Asking a question in the place where the question occurs to somebody.
If you have an export screen with no scheduling, the moment a person most wants scheduled exports is while they are standing on the export screen.
Sending them to a feedback board to search for a card about scheduling asks them to remember a thought, navigate somewhere else, and find the right entry. Most people will not, and the ones who do are not a representative sample. They are the unusually motivated.
A vote button on that screen asks while the thought is still there. That is the whole idea.
The embed key comes from a board, so a trial is 14 days with a card at signup and the snippet works as soon as you have one.
What is the line you paste?
Two tags and one call naming the feature it votes on.
<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.voteButton('#vote', { feature: 1234 });
</script>
<div id="vote"></div>
The feature number is the one in the address of that request on your own board. The version with the title beside it is the same call under a different name, being VoteFirst.badge, and it takes the same options. Both are documented with every option they take.
What does it draw?
Two shapes, depending on how much you want on the page.
The vote button is a single vote control for one feature. Nothing else. The badge is the same control with the feature's title beside it, which is what you want when the surrounding page does not already make it obvious what is being voted on.
The badge stays on one line on purpose. When voting is closed the message is a span rather than a paragraph, and the Powered by mark sits inline rather than underneath, both so that a one line widget does not quietly become a two line one.
Do I have to name which feature it votes on?
No, and this is the part the page used to get wrong.
You can name a feature and it draws that one, which is the usual case and the one worth using.
If you do not name one, the widget asks for the top twenty features and picks the first that is actually open for votes, so a button dropped on a page with no configuration still asks a real question rather than failing.
It picks the first votable one rather than simply the first, which matters because the top of a board is often full of things already shipped. If none of the twenty takes a vote it falls back to the first of them and draws the count read only.
If the project has no public features at all, the widget says so in those words rather than drawing an empty box.
What if the feature is in a column that does not take votes?
You get the number without the button, and that is deliberate.
Voting is set per column on your board rather than once for the whole thing, and this widget honours it. Point a button at something sitting in Completed on a board where Completed is read only, and the visitor sees the count rather than a control that would refuse them.
If you have hidden vote counts entirely, the number goes and the control stays, so you can collect votes without publishing the tally.
And if neither can be drawn, the widget says voting is closed rather than rendering nothing at all, because an empty space where a control should be reads as your site being broken rather than as a setting being off.
Does the visitor need an account?
No. A signed out visitor gets an anonymous identity minted in their own browser's storage the first time they vote.
There are no cookies and nothing is sent with credentials. The token is signed and tied to your project, so it cannot be lifted and replayed against a different board.
If you want the vote attributed to your own signed in user instead, signing them in with a token is on the PRO plan. That is worth doing here specifically, because a vote from inside your product is a vote where you usually already know who the person is.
Does this count towards weighted voting?
Yes. A vote is a vote wherever it was cast.
If you have weighted voting on and the voter belongs to a tier, the vote carries that tier's multiplier exactly as it would on the public board. The weight is written onto the vote at the moment it happens, and the number on the button is the weighted total rather than the headcount.
That is what makes this widget more than a convenience. A vote button inside a paid area of your product collects votes from people you already know are paying, which is the population a public board is worst at reaching.
What happens when somebody presses it twice?
The second press takes the vote back, and the button shows which state it is in.
It carries a pressed state a screen reader can read, a label naming the feature rather than just saying vote, and it disables itself while the request is in flight so an impatient double press cannot fire twice.
A returning visitor arrives with their vote already showing, because whether they have voted comes down with the feature rather than being worked out afterwards.
If a vote is refused, the reason is shown to the visitor. That has not always been true. It used to raise an event and nothing else, which meant somebody pressed the button and saw nothing happen whatever the cause, and the fix carries a comment in the source saying so.
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.
How do I install it?
One script tag with your project and your public key, and a container where the control should go. Name a feature on it if you want a specific one.
If your own application renders the page after the script has loaded, or before it, either is fine. Calls made early queue rather than failing, which matters more for this widget than the others because it is usually going inside an application rather than onto a static page.
There is a pinned version address cached for a year if you want one exact build.
Where to put it
Next to the thing it is about. That is the only rule and it is the entire value.
A vote button in a footer is a worse version of a link to your board. A vote button on the screen with the missing feature is a question asked at the right moment, and it is the reason to use this rather than the board widget.
Can I tell my own analytics when somebody votes?
Yes, and for a widget that lives inside your product this is the part worth reading.
Every vote raises an event carrying the feature, whether the person now has a vote on it, and what the server sent back. Every refusal raises one carrying the error and which widget it came from.
You subscribe on the widget you created, or once on a shared channel that every widget on the page reports to, which is there so a host can wire analytics up in one place instead of per widget. A listener that throws is caught and logged rather than taking the widget down with it.
That matters because we ship no analytics of our own. Nothing here counts impressions, presses or conversions, so we cannot tell you how this widget performs against the others and we are not going to guess.
What we can do is hand you the events and let your own tooling answer it, which is the honest version of that offer.
