{issued}

Documentation

Turn customer support into GitHub Issues in minutes.

Getting started is as easy as:

1. Link your GitHub account
Connect your GitHub account and select the repository where you want issues created
2. Create your project
Set up a project in your dashboard and configure your support form preferences
3. Add your embed code
Copy the embed code for your platform and paste it into your app or website

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 address
nameUser'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

Hidden Metadata Fields

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
}
Include Troubleshooting Context

Pass hidden fields for user profile IDs, app versions, or email addresses to help with debugging and troubleshooting customer issues.

AI Coding Agent Integration

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.

Private Comments

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