Developer / Widget

import { Aside } from ‘@astrojs/starlight/components’;

Premium feature

/dashboard/developer

Create an App

1. Name your app
2. Select a ticket category (for widget conversations)
3. Add allowed origins (domains where widget can run)
4. Get your API Key

Widget Embed

HTML (any website)

<script src="https://widget.procord.app/v1/widget.js"></script>
<script>
  Procord.init({
    apiKey: 'YOUR_API_KEY',
    position: 'bottom-right',
    theme: 'auto'
  });
</script>

React / Next.js

"use client";
import { useEffect } from "react";

export function SupportWidget() {
  useEffect(() => {
    const script = document.createElement("script");
    script.src = "https://widget.procord.app/v1/widget.js";
    script.async = true;
    script.onload = () => {
      window.Procord?.init({
        apiKey: 'YOUR_API_KEY',
        position: 'bottom-right',
        theme: 'auto'
      });
    };
    document.body.appendChild(script);
    return () => window.Procord?.destroy?.();
  }, []);
  return null;
}

Widget Options

Option	Values	Description
apiKey	string	Your app API key (required)
position	bottom-right, bottom-left, top-right, top-left	Widget position
theme	auto, light, dark	Color scheme
stylePreset	classic, minimal, bold, shadow, grey	Visual style
includePaths	["/support", "/help/*"]	Show only on these paths
excludePaths	["/login", "/admin/*"]	Hide on these paths

Security

• Allowed Origins: Widget only works on domains you whitelist
• API Key: Keep it private, regenerate if compromised

Rate Limits

Type	Limit
Read	60/min
Write	30/min