NiroRoadmap – Public Product Roadmap & Kanban Board

Descripción

NiroRoadmap turns your WordPress site into a public product roadmap. Add roadmap items, group them into statuses such as Planned, In Progress and Completed, and publish the roadmap on any page with a shortcode or block, as a Kanban board, a sortable list or a timeline by quarter.

Visitors can open any item for the full details, upvote or downvote it, join the discussion and suggest ideas of their own. You find out what your users care about most, and they can see what you’re working on.

Everything is optional and off by default where it matters: comments, idea submissions, the search toolbar and the view switcher are switched on from NiroRoadmap → Settings, and each board can override them with a shortcode attribute or block option.

Features

• Kanban board: Items are grouped into status columns, each with its own accent color and item count.
• Item details popup: Clicking an item opens a popup with its status, tags, description and votes. It zooms out of the card in the style of macOS Quick Look.
• Voting: Anyone can upvote or downvote an item, with no account needed. One vote per visitor per item, enforced on the server. Optionally require a login, let voters change their vote, hide the downvote button, or show downvote counts to administrators only.
• Comments: Visitors discuss an item right in its popup, with threaded replies and a Team badge on staff replies. Comments are normal WordPress comments, so your moderation tools and spam plugins apply. Require a login, choose the order, and close comments automatically when an item is completed.
• Suggest an idea: A Suggest an idea button opens a short form. While the visitor types a title, similar existing items are listed so duplicates are caught early. Ideas arrive as Pending items, are never public until you approve them, and can notify you by email. A one-click Approve action is added to the Items list.
• Search, sort and filter toolbar: Visitors search the board and sort by most votes, newest, oldest or most commented. They can filter by tag and product too. The toolbar loads no extra script or styles on boards that don’t use it.
• Board, List and Timeline views: Show the roadmap as Kanban columns, a compact sortable table, or a timeline grouped by quarter, month or Now / Next / Later. A switcher lets visitors choose, and their choice is remembered and can be shared in the page address. Boards that don’t use the extra views load no extra script or styles.
• Drag and drop: Editors and administrators can drag items between columns and reorder them right on the public board.
• Sortable statuses: Drag statuses into the order you want on the admin screen. The public board uses the same order.
• Products: Run separate roadmaps for several products and show one product per board.
• Tags: Label items (e.g. Payments, Checkout). Tags are shown on each card.
• Item details: Give an item a target (a date or a quarter like Q4 2026), a release date and version, a link, a cover image (its Featured image), an effort size and private notes for your team. Pin an item to the top of its column, or hide its vote counts.
• Status history: See who moved an item to which status and when, and optionally show visitors the path an item took.
• Shortcode and block: Use the [niroroadmap] shortcode or the Roadmap block.
• Settings page: Eight tabs (General, Voting, Comments, Submissions, Toolbar, Views, Appearance, Advanced) control everything without code.
• Appearance: Light, dark or automatic color scheme, an accent color, the corner radius and your own custom CSS.
• Responsive: On phones the columns scroll sideways with snapping and the toolbar collapses into a Sort & filter button. The list view can be the default on narrow screens.
• Accessible: Cards can be opened with the keyboard, Esc closes the popup, and the animation is replaced by a plain fade for visitors who prefer reduced motion.
• Theme-friendly: Colors, borders and spacing are CSS custom properties you can override from your theme.
• Developer-friendly: A REST API under niroroadmap/v1, a dozen filters and actions, and a regular custom post type.

Getting started

On activation, NiroRoadmap creates a Roadmap page and four statuses (Under Review, Planned, In Progress, Completed), so the board works straight away.

1. Adjust the columns under NiroRoadmap → Statuses if you like. Rename them, pick colors, and drag them into order.
2. Optionally add your products under NiroRoadmap → Products and your labels under NiroRoadmap → Tags.
3. Add items under NiroRoadmap → Add New. Give each one a status, and optionally a product, tags and the Roadmap details (target, release date and version, link, effort, pin).
4. Open NiroRoadmap → Settings and turn on what you want: comments, the Suggest an idea button, the search toolbar, a dark color scheme.
5. Visit the Roadmap page. To show the board somewhere else, use the [niroroadmap] shortcode or the Roadmap block.

Settings

Find them under NiroRoadmap → Settings.

• General: the Roadmap page, a default product, linking status names to their archive, and what the board shows: vote counts, tags, the downvote button, an item’s target and its status timeline.
• Voting: who can vote (everyone or logged-in users), whether voters may change their vote, and who sees downvote counts.
• Comments: turn comments on, require login, choose the order, and close comments when an item is moved to Completed.
• Submissions: turn the Suggest an idea button on, require login, ask for name and email (not asked, optional or required), pick the status new ideas start in, count the submitter’s own upvote, and set the notification email.
• Toolbar: turn the toolbar on, pick the initial sort and which filters to offer (search, tag, product).
• Views: the default view, whether visitors get the Board / List / Timeline switcher, opening boards as a list on narrow screens, and how the timeline groups items.
• Appearance: light, dark or auto color scheme, accent color, corner radius and custom CSS.
• Advanced: delete all plugin data on uninstall, and reset every setting to its default.

Managing ideas and item details

• Ideas visitors suggest appear in NiroRoadmap → All Items as Pending, with a Submitted by column. Click Approve to publish one, or edit it first.
• Each item has a Roadmap details box with its target (a date or a quarter like Q4 2026), release date, version, link, effort size (XS to XL), private team notes, and switches to hide its votes or pin it to the top of its column.
• A Status history box on the item screen shows every status change, who made it and when.
• The Items list has Target and Votes columns.

Shortcode

[niroroadmap] shows every item.

[niroroadmap product="12"] shows only the items of one product. Use the term ID from **NiroRoadmap → Products**.

[niroroadmap toolbar="yes" sort="votes" filters="search,tag"] adds a search, sort and filter toolbar. `toolbar` is `yes` or `no`; `sort` is `manual`, `votes`, `newest`, `oldest` or `commented`; `filters` is a comma list of `search`, `tag` and `product` (or `none`). Without these options a board follows **Settings → Toolbar**. The Roadmap block has the same options in its sidebar.

[niroroadmap view="timeline" switcher="yes" group="month"] opens the board as a timeline and lets visitors switch views. `view` is `board`, `list` or `timeline`; `switcher` is `yes` or `no`; `group` is `quarter`, `month` or `nownext` (Now / Next / Later). Without these options a board follows **Settings → Views**. Visitors can share a link to a view with `?nr_view=list` in the address. The Roadmap block has the same options in its sidebar.

[niroroadmap submissions="yes"] shows a "Suggest an idea" button on that board even when it is off site-wide; `submissions="no"` hides it.

Options combine, for example [niroroadmap product="12" toolbar="yes" sort="votes" submissions="yes"].

The older [roadmap] shortcode still works.

For developers

Filters:

• niroroadmap_setting_{$key}: filter any setting value, e.g. niroroadmap_setting_comments_enabled.
• niroroadmap_show_stage_links: return true to link each column title to its status archive.
• niroroadmap_get_posts: filter the items loaded for a column.
• niroroadmap-localized_vars: filter the variables passed to the front-end scripts.
• niroroadmap_vote_fingerprint, niroroadmap_voter_ip: change or disable how anonymous voters are recognised.
• niroroadmap_vote_rate_limit, niroroadmap_comment_rate_limit, niroroadmap_submission_rate_limit: change the rate limits (array( count, seconds )).
• niroroadmap_comment_max_length, niroroadmap_comment_show_avatars: limit comment length, or hide avatars.
• niroroadmap_completed_status_slugs: the status slugs that count as completed for closing comments (default completed).
• niroroadmap_submission_verify: return false or a WP_Error to reject an idea, for example to add a CAPTCHA.
• niroroadmap_submission_max_title, niroroadmap_submission_max_description, niroroadmap_submission_min_time: limits for the suggestion form.
• niroroadmap_submission_notify_to: change the recipient of the new-idea email.

Actions:

• niroroadmap_comment_created: fires after a visitor’s comment is saved.
• niroroadmap_submission_created: fires after an idea is submitted.

REST API (namespace niroroadmap/v1): GET /tasks/{id}, POST /tasks/{id}/vote, GET and POST /tasks/{id}/comments, POST /tasks/submit and GET /tasks/search are public and rate limited. Moving and ordering items and statuses (/tasks/{id}/move, /tasks/order, /stages/order) need an editor or administrator.

The board’s look can be changed by overriding these CSS custom properties on .nr-kanban-columns and .nr-modal-overlay: --nr-bg, --nr-card, --nr-border, --nr-text, --nr-muted, --nr-accent, --nr-radius.

Helper: niroroadmap_get_setting( $key ) returns a plugin setting.

Roadmap data is stored as a regular custom post type (niroroadmap_item) with the taxonomies niroroadmap_status, niroroadmap_product and niroroadmap_tag, so it works with the standard WordPress APIs.

Source code and build tools

The full source code is publicly available at github.com/codexpertio/niroroadmap.

The only compiled file is the block script in build/roadmap/. Its human-readable source ships with the plugin in app/Blocks/roadmap/. To rebuild it, run npm install and then npm run build:blocks (uses @wordpress/scripts). PHP dependencies are listed in composer.json; run composer install to install them.

Privacy

NiroRoadmap makes no requests to external services. To allow one vote per visitor per item, it recognises voters like this:

• Logged-in users are identified by user ID.
• Other visitors get a random token in a first-party cookie, niroroadmap_voter (1 year, SameSite=Lax, HttpOnly, Secure on HTTPS), set when they first vote. They are also recognised by a salted hash (HMAC-SHA256, keyed with your site’s WordPress salts) of their IP address and browser user agent, so clearing cookies doesn’t reset their votes.

The vote table stores only these hashes, the item, the vote type and the time. The raw IP address and user agent are never stored. A salted hash is still pseudonymous data, so mention it in your privacy policy. To stop using IP addresses at all, return an empty string from the niroroadmap_vote_fingerprint filter; votes are then recognised by cookie only. Votes are also shown as plain counts on each item, and the visitor’s browser keeps a list of the items it has voted on in local storage (niroroadmap_votes) to display the buttons correctly. That list is never sent to the server. A short-lived counter keyed by a hash of the IP address limits how fast votes can be sent. Vote data is deleted when you uninstall with «Delete all data» turned on.

When comments are turned on, a comment is a standard WordPress comment. WordPress stores the commenter’s name, email address, IP address and browser user agent with it, the same as on any post, and your spam plugin may send these to its own service. The roadmap board never shows email addresses or IP addresses. It does show each commenter’s avatar, which for people without a profile picture is a Gravatar image whose address contains a hash of their email; return false from the niroroadmap_comment_show_avatars filter to turn avatars off. A hidden form field and a per-IP rate limit (using a hash of the IP address, as for votes) help keep out spam. Comments are deleted with their item, and when you uninstall with «Delete all data» turned on.

When visitors can suggest ideas, an idea is stored as a pending item, like any other. If you ask for a name and email, or the person is logged in, those are stored privately with the idea so you can follow up. They are shown only in the admin Items list, and never on the board or in the public API. The idea itself becomes public only when you publish it. A hidden form field, a minimum fill-in time and a per-IP rate limit (using a hash of the IP address, as for votes) help keep out spam, and a filter lets you add a CAPTCHA. If you turn on the email notification, the idea and the submitter’s name and email are sent to the address you choose. Ideas, and the name and email stored with them, are deleted with the item, and when you uninstall with «Delete all data» turned on.

Item details: the target is shown to visitors only if you turn that on in Settings → General. The release date, version, link and cover image are shown when filled in. The effort size and the internal notes are for your team only: they are never shown on the board or returned by the public API.

Status history: each time an item moves to another status, the plugin records which status, when, and the ID of the user who moved it (0 when it was done by code or by a visitor’s submission). Only your team sees who; the optional timeline shown to visitors has statuses and dates only. The history is deleted with the item, and when you uninstall with «Delete all data» turned on.