Pre-styled Widget
Best for: Quick setup, prototyping, or when you don't need custom styling
Pros
- ✅ Zero configuration
- ✅ Works out of the box
- ✅ Automatic modal UI
Cons
- ❌ Limited customization
CDN Usage
<script src="https://pullreque.st/cdn/button.js"></script>
<script>
PullrequeStButton.init({
projectKey: 'prj_pk_YOUR_KEY',
position: 'bottom-right', // 'bottom-right', 'bottom-left', 'top-right', 'top-left'
buttonText: 'Feedback',
primaryColor: '#3b82f6'
})
</script>React Usage
import { FeedbackButton } from '@pullreque.st/button/react'
function App() {
return (
<FeedbackButton
projectKey="prj_pk_YOUR_KEY"
buttonText="Send Feedback"
onSuccess={() => console.log('Success!')}
onError={(error) => console.error(error)}
/>
)
}Configuration Options
| Option | Type | Default | Description |
| --- | --- | --- | --- |
|
projectKey | string | Required | Your project public key |
| position | 'bottom-right', 'bottom-left', 'top-right', or 'top-left' | 'bottom-right' | Button position |
| buttonText | string | 'Feedback' | Button text |
| primaryColor | string | '#000000' | Primary color (hex) |VitePress Integration
Add to
.vitepress/config.ts:import { defineConfig } from 'vitepress'
export default defineConfig({
head: [
[
'script',
{ src: 'https://pullreque.st/cdn/button.js' }
],
[
'script',
{},
`PullrequeStButton.init({
projectKey: 'prj_pk_YOUR_KEY',
position: 'bottom-right'
})`
]
]
})