A roadmap widget draws your board's columns as a grid of cards, inside a page you already own, styled the way your site is already styled. VoteFirst.roadmap mounts it with one script tag and one call.
Does the roadmap widget need the PRO plan?
No. The widget runs on the nine dollar plan.
The feature that needs PRO is a custom domain for the hosted board, which points your own domain name at a board VoteFirst serves. That is a different feature from this widget, which draws the roadmap inside a page your own server is already serving.
If you want to try it, start a 14 day trial with a card at signup and copy the key from your board's Share & Embed settings.
What is the line you paste?
<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.roadmap('#votefirst-roadmap');
</script>
<div id="votefirst-roadmap"></div>
The stylesheet line is optional; leave it out and the widget arrives with no styling, for when you would rather write every rule yourself. The project slug and the embed key both come from your board's settings, and the key is public by design, since it only ever reads what the board already publishes. Calls made before the script has loaded queue rather than fail.
What does it draw?
Your columns as a grid of cards, by default Suggested, Denied, In Review, In Progress and Completed, exactly as on the hosted roadmap. Each column header carries its own total.
Twenty cards load per column and a button at the foot fetches the next twenty, so a column holding four hundred requests does not arrive as four hundred cards. The order inside a column is the order you arranged on your own board.
Each column is fetched on its own, so a request that times out becomes an error message inside that column while the rest of the board draws normally.
Can I draw only some of the columns?
Yes. You can name the columns you want and the widget draws those, so a marketing page that should show In Progress and Completed and nothing else is two words of configuration rather than a second board. You can also bake a tag filter or a search term into the embed.
Does a visitor need an account?
No. The first write mints an anonymous identity in their own browser. No cookies, no credentials, and a token bound to your project so it cannot be replayed elsewhere.
Voting is set per column rather than once for the whole board, and the widget draws the vote control from that answer. It does not offer a vote and then discover it was refused.
Can I make it match my site?
Yes. The widget draws real elements into your own document rather than an iframe, so your own stylesheet reaches all of it. You set the background, the text colours, the accent, the card background, the border, the font and the corner radius, separately for dark and light. Everything you configure for the hosted board carries into the widget, so you set it once.
There is no badge on a paying account. The Powered by mark is drawn only when the owner has no live plan.
What does it cost?
Nothing beyond your plan. No widget is held back for the higher plan. 14 days, a card at signup, then $9 or $39 a month.
Does this work as a feedback widget too, not just a roadmap?
Yes. The roadmap widget and the board widget are the same renderer. Call VoteFirst.board instead of VoteFirst.roadmap and name the board, and the page shows cards and vote counts rather than a grid of columns. Both come from the one script tag and the one key.
Should I use the widget or the hosted board?
Use the widget when the roadmap belongs inside your product or your marketing site. Use the hosted board when you want an address you can send people to from an email or a support reply. There is no extra charge for running both, because it is one board rendered twice.
What it cannot do
It cannot draw a board that is not public. There is no private board at any price, so an embed on a page behind your own login still draws a roadmap anybody holding the public key can read.