Feedback Widget - Installation Guide (v3)

1 Add the Script

Copy and paste this code just before the closing </body> tag on your website:

        
        <!-- Feedback Widget -->
<script src="https://feedback-widget-seven.vercel.app/feedback-widget.js"></script>
<script>
  FeedbackWidget.init({
    email: 'YOUR-EMAIL@example.com',  // Feedback goes here!
    brandColor: '#667eea'  // Optional: match your brand
  });
</script>
      

Important: Replace YOUR-EMAIL@example.com with the email address where you want to receive feedback.

2 Customize (Optional)

You can customize the widget's appearance and behavior:

Option	Description	Default
`email`	Email address to receive feedback (required)	—
`brandColor`	Primary color for the button and accents	`#2563eb`
`position`	Button position: `bottom-right`, `bottom-left`, `top-right`, `top-left`	`bottom-right`
`buttonText`	Text displayed on the trigger button	`Feedback`
`modalTitle`	Title shown in the feedback modal	`Send Feedback`
`modalSubtitle`	Subtitle/description in the modal	`Help us improve`

Example with all options:

FeedbackWidget.init({
  apiEndpoint: 'https://YOUR-PROJECT.vercel.app/api/send-feedback',
  email: 'support@mycompany.com',
  brandColor: '#10b981',
  position: 'bottom-left',
  buttonText: 'Report Issue',
  modalTitle: 'Report an Issue',
  modalSubtitle: 'Help us improve MyApp'
});

3 That's It!

Your visitors will now see a feedback button on your website. When they submit feedback:

✅ You receive an email with their feedback
✅ Screenshots are automatically attached
✅ Technical details (browser, URL, etc.) are included
✅ Works on desktop and mobile

Try the Demo →

🔧 Need Help?

Having issues? Here are some common solutions:

Widget not appearing? Make sure the script is loaded after the page content
Not receiving emails? Check your spam folder, and verify the email address is correct
Screenshot not working? Some browsers require HTTPS for screen capture

📬 Feedback Widget

1 Add the Script

2 Customize (Optional)

3 That's It!

🔧 Need Help?