πŸ› Simple Bug Reporter

A lightweight, self-hosted bug reporting tool for any website

Integration Example - Look for the floating button in bottom-right!

πŸš€ 3-Minute Setup

Upload backend files, add script tag, and you're done! No complex configuration needed.

πŸ”’ Privacy-First

Self-hosted solution. All data stays on your server. GDPR compliant by design.

πŸ“Έ Built-in Screenshots

Automatic screen capture functionality with drag & drop and clipboard support.

🎨 Fully Customizable

Themes, colors, positioning, languages, and features can all be configured.

πŸ“± Mobile-Friendly

Responsive design that works perfectly on desktop, tablet, and mobile devices.

πŸ‘¨β€πŸ’Ό Admin Dashboard

Beautiful management interface to view, edit, and organize bug reports.

🎯 Try It Out!

Click the floating bug button in the bottom-right corner or try these demo buttons:

βš™οΈ Configuration Options

Here's how this example is configured:

// Configuration for this example new SimpleBugReporter({ apiEndpoint: '../backend/php/bugs.php', position: 'bottom-right', theme: 'auto', language: 'en', company: 'Simple Bug Reporter Demo', // Features allowScreenshots: true, allowSystemInfo: true, autoSave: true, // Customization categories: ['bug', 'feature', 'ui', 'performance', 'other'], maxScreenshots: 5, // Colors colors: { primary: '#667eea', secondary: '#764ba2', success: '#48bb78', warning: '#ed8936', error: '#f56565' }, // Callbacks onSubmit: (data) => { console.log('Bug submitted:', data); alert('Thanks for your feedback!'); }, onError: (error) => { console.error('Bug reporter error:', error); } });

πŸ”§ Quick Integration Examples

Basic Integration

<script src="simple-bug-reporter.js"></script> <link rel="stylesheet" href="simple-bug-reporter.css"> <script> new SimpleBugReporter({ apiEndpoint: '/api/bugs.php' }); </script>

CDN Integration

<script src="https://cdn.jsdelivr.net/npm/simple-bug-reporter@1.0.0/dist/simple-bug-reporter.min.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/simple-bug-reporter@1.0.0/dist/simple-bug-reporter.min.css"> <script> new SimpleBugReporter({ apiEndpoint: '/api/bugs.php' }); </script>

Auto-Initialize with Data Attributes

<script src="simple-bug-reporter.js" data-sbr-auto-init="true" data-sbr-apiendpoint="/api/bugs.php" data-sbr-theme="dark" data-sbr-position="bottom-left"> </script>

πŸ“Š System Status

Current configuration and system information:

Loading system status...