Documentation
Turn customer support into GitHub Issues in minutes.
Getting started is as easy as:
Embed Codes
<!-- Add this to your HTML -->
<div id="issued-form-container"></div>
<script src="https://cdn.issued.dev/widget/issued.js"></script>
<script>
Issued.init({
projectId: "your-project-id",
fields: {
subject: {
visible: true,
required: true,
label: "Subject"
},
description: {
visible: true,
required: true,
label: "Description"
},
email: {
visible: true,
required: false,
label: "Email"
}
},
metadata: {
apiKey: "your-api-key"
}
});
</script>Customization Options
Available Fields
Each field supports visible, required, label, and value properties.
subjectIssue title (max 200 characters)descriptionIssue body (max 5000 characters)emailUser's email addressnameUser's name (max 100 characters)labelsGitHub labels (comma-separated, max 10)assigneesGitHub usernames (comma-separated, max 5)milestoneGitHub milestone (positive integer)customAny custom field name (max 1000 characters)Field Properties
fields: {
subject: {
visible: true, // Show or hide the field
required: true, // Make the field required
label: "What's up?", // Custom label text
value: "Bug Report" // Pre-filled or default value
},
userId: {
visible: false, // Hidden field
value: "user_12345" // Include metadata without showing UI
}
}Pre-configuring GitHub Fields
Set default GitHub labels, assignees, and milestones for all submissions from your form:
fields: {
subject: { visible: true, required: true },
description: { visible: true, required: true },
labels: {
visible: false,
value: "bug,customer-reported" // Auto-add these labels
},
assignees: {
visible: false,
value: "developer1,developer2" // Auto-assign to these users
},
milestone: {
visible: false,
value: 5 // Assign to milestone #5
}
}Styling Options
Web Platforms (JavaScript, React, Vue)
Customize your form's appearance with theme configuration:
theme: {
primaryColor: "#3b82f6", // Button and accent color
errorColor: "#ef4444", // Validation error color
successColor: "#16a34a", // Success message color
borderRadius: "6px", // Form element corners
fontFamily: "Inter, sans-serif", // Custom font
cssPrefix: "issued" // Custom CSS class prefix
}Theme Presets: Use theme: "light" or theme: "dark" in the main config for automatic light/dark styling.
Mobile Platforms (iOS, Android, Flutter)
Native mobile platforms support granular color and styling control:
let theme = ThemeConfig(
primaryColor: "#3b82f6",
backgroundColor: "#ffffff",
textColor: "#1f2937",
borderColor: "#d1d5db",
cornerRadius: 8.0,
fontFamily: "SF Pro Display"
)
let config = WidgetConfig(
projectId: "your-project-id",
fields: [...],
theme: theme
)Complete Styling Example
Here's how to create a fully branded form:
// JavaScript/React example with custom branding
Issued.init({
projectId: "your-project-id",
fields: {
subject: { visible: true, required: true },
description: { visible: true, required: true },
email: { visible: true, required: true }
},
theme: {
primaryColor: "#6366f1", // Your brand color
errorColor: "#dc2626",
successColor: "#059669",
borderRadius: "12px", // Rounded corners
fontFamily: "Poppins, sans-serif"
}
});Pro Tips
Set visible: false with a value to include hidden metadata like user IDs or session info in GitHub issues.
userId: {
visible: false,
value: currentUser.id
}Pass hidden fields for user profile IDs, app versions, or email addresses to help with debugging and troubleshooting customer issues.
Set up your AI coding agent (like Cursor, Claude Code, Devin, or Codex) to respond to mentions in GitHub issues so you can have it begin work on customer-reported bugs automatically.
Include (ignore) in your GitHub issue comment and that comment won't be emailed to the customer.
(ignore) Internal note: This is a duplicate of #123