Documentation

Add a feedback widget to your site

Embed a lightweight feedback widget on your website. Show users what others are requesting and let them easily submit their own feedback on your full board.

Quick Start

Add these two lines before your closing </body> tag:

<!-- Add this before closing </body> tag -->
<script src="https://leanvote.com/widget.js"></script>
<script>
  LeanVoteWidget.init({
    boardSlug: 'YOUR_BOARD_SLUG'
  });
</script>

Tip: Replace YOUR_BOARD_SLUG with your actual board slug from the dashboard settings.

Try the Widget Test LabConfigure and preview widgets before embedding

What Users See

The widget displays recent feedback from your board and provides a quick way for users to submit their own:

Feedback Preview

Recent posts — Shows the 5 latest feedback items from your board
Vote counts — Display how many votes each post has received
Category badges — Feature requests, bugs, and improvements
Click to view — Each post links to its detail page

Submit Feedback

Submit button — Redirects to your full board where users can add feedback
Full board access — Users can browse, vote, and comment on the full board
Powered by LeanVote — Subtle branding in the footer

Configuration Options

Option	Type	Default	Description
boardSlug	string	required	Your unique board identifier
position	string	'bottom-right'	Widget position: 'bottom-right', 'bottom-left', 'top-right', 'top-left'
primaryColor	string	'#f97352'	Primary color for button and accents
buttonText	string	'Feedback'	Text displayed on the widget button
showOnMobile	boolean	true	Whether to show the widget on mobile devices
zIndex	number	9999	CSS z-index for the widget container

Full Configuration Example

<script src="https://leanvote.com/widget.js"></script>
<script>
  LeanVoteWidget.init({
    boardSlug: 'YOUR_BOARD_SLUG',
    position: 'bottom-right',      // 'bottom-right', 'bottom-left', 'top-right', 'top-left'
    primaryColor: '#f97352',       // Your brand color
    buttonText: 'Send Feedback',   // Custom button text
    showOnMobile: true,            // Show/hide on mobile devices
    zIndex: 9999                   // CSS z-index
  });
</script>

Framework Integrations

Create a client component to load the widget in your React or Next.js application:

// components/FeedbackWidget.tsx
'use client';

import { useEffect } from 'react';

declare global {
  interface Window {
    LeanVoteWidget?: {
      init: (config: WidgetConfig) => void;
      open: () => void;
      close: () => void;
      toggle: () => void;
    };
  }
}

interface WidgetConfig {
  boardSlug: string;
  position?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
  primaryColor?: string;
  buttonText?: string;
  showOnMobile?: boolean;
  zIndex?: number;
}

export function FeedbackWidget({ boardSlug }: { boardSlug: string }) {
  useEffect(() => {
    const script = document.createElement('script');
    script.src = 'https://leanvote.com/widget.js';
    script.async = true;
    
    script.onload = () => {
      window.LeanVoteWidget?.init({
        boardSlug,
        primaryColor: '#f97352',
        buttonText: 'Feedback'
      });
    };
    
    document.body.appendChild(script);
    
    return () => {
      document.body.removeChild(script);
    };
  }, [boardSlug]);

  return null;
}

// Usage in your app
// <FeedbackWidget boardSlug="your-board-slug" />

JavaScript API

Control the widget programmatically with these methods:

// Open the widget programmatically
LeanVoteWidget.open();

// Close the widget
LeanVoteWidget.close();

// Toggle the widget
LeanVoteWidget.toggle();

// Open the full feedback page in a new tab
LeanVoteWidget.openFullPage();

// Get widget version
console.log(LeanVoteWidget.version);

Method	Description
LeanVoteWidget.init(config)	Initialize the widget with configuration options
LeanVoteWidget.open()	Open the feedback panel
LeanVoteWidget.close()	Close the feedback panel
LeanVoteWidget.toggle()	Toggle the feedback panel open/closed
LeanVoteWidget.openFullPage()	Open the full feedback board in a new tab

Common Use Cases

Collect Feature Requests

Let users submit and vote on feature ideas directly from your app. Prioritize based on what your users actually want.

Bug Reports

Make it easy for users to report bugs without leaving your application. Track and respond to issues quickly.

Public Roadmap

Share your product roadmap to keep users informed about what's coming next and build anticipation.

Changelog Updates

Keep users updated with your latest releases and improvements. Build trust by showing consistent progress.

Ready to collect feedback?

Create your board and start embedding the widget on your site today.

Create Your Board Go to Dashboard