Connect Formora to your Discord server to receive instant, rich notifications when new form submissions arrive. This integration is perfect for communities, teams, or any group using Discord for communication, providing immediate visibility into form activity with customizable and visually appealing alerts using Discord’s embed capabilities.

Formora Discord Webhook Builder interface.

Benefits of Discord Integration

  • Real-Time Community Updates: Instantly inform your Discord server members about new applications, event registrations, feedback, or any other form submissions.
  • Rich Embed Notifications: Leverage Discord’s embed capabilities to present submission data in a structured, easy-to-read, and visually engaging format, as seen in the DiscordPreview component.
  • Centralized Information: Keep form-related discussions and follow-ups within your Discord environment.
  • Highly Customizable: Tailor the notification’s appearance using the DiscordBuilder in Formora, including content, colors, images, author, footer, and specific fields from the submission.

Setting Up the Discord Integration in Formora

This process involves creating a Webhook in your Discord server settings and then configuring it within Formora’s “Integrations” section (IntegrationsList component).

1

Create a Webhook in Your Discord Server

  1. Open your Discord server settings (usually by clicking the server name and selecting “Server Settings”).
  2. Navigate to “Integrations” from the server menu.
  3. Click on “Webhooks” and then “New Webhook.”
  4. Customize the webhook:
    • Name: Give your webhook a name (e.g., “Formora Submissions”). This will be the default username for messages, but Formora’s DiscordBuilder allows overriding it.
    • Channel: Select the Discord channel where notifications should be posted.
    • Avatar: Optionally, upload a default avatar. This can also be overridden in Formora.
  5. After creation, Discord will provide a Webhook URL. Click “Copy Webhook URL.” This is crucial.
2

Navigate to Formora Integrations

In your Formora dashboard, go to the “Integrations” section (usually /dashboard/integrations).

3

Add New Discord Integration

Click “Add New Integration” and select “Discord” as the type.

4

Configure Discord Integration Details (General Settings)

In the main integration form (IntegrationsList part):

  • Integration Name: A label for this specific Discord connection (e.g., “New Applications to #apply-channel”).
  • Webhook URL: Paste the Webhook URL you copied from your Discord server settings.
  • Select Forms: Choose which Formora forms will trigger notifications to this Discord webhook. This is required.
  • Active: Toggle to enable or disable this integration.
  • Events: Default is form_submission.
5

Customize the Discord Notification (DiscordBuilder)

Formora’s DiscordBuilder component offers extensive options for customizing the notification:

  • Webhook Overrides (Optional):

    • Webhook Username: Override the default username set in Discord.
    • Webhook Avatar URL: Override the default avatar URL.
  • Message Content & Embed Toggle:

    • Message Content: Text that appears above the rich embed. Can use template variables.
    • Use Rich Embed Message: Switch to toggle between a simple text message (using only “Message Content”) or a rich embed.
  • Embed Main Properties (If Use Rich Embed Message is on):

    • Title: The main title of the embed (e.g., New Submission: {{form_title}}).
    • Title URL: Makes the embed title a clickable link.
    • Description: The primary text content of the embed. Use template variables like {{data_all_fields_formatted}} or craft your own message.
    • Color: A hex color code (e.g., #5865F2) for the vertical bar on the left side of the embed. Formora’s ColorPicker component helps here.
    • Include Timestamp: Adds the submission time to the embed footer (uses submitted_at from mock data in preview).
  • Embed Author (Optional):

    • Author Name, Author URL, Author Icon URL (e.g., to brand the embed).
  • Embed Footer (Optional):

    • Footer Text, Footer Icon URL (e.g., for IP address, geolocation snippets).
  • Embed Images (Optional):

    • Thumbnail URL: URL for a small image appearing in the top-right.
    • Image URL: URL for a larger image displayed prominently within the embed.
  • Embed Fields (Optional, DiscordEmbedField[]):

    • Add multiple fields, each with a Name, Value (both support template variables), and an Inline toggle.
    • The DiscordBuilder allows adding, removing, and reordering these fields.
    • New fields inline by default: A switch to set the default inline state for newly added fields.
    • If no custom fields are added, and description is also empty, Formora may attempt to auto-generate fields from submitted data (as hinted in DiscordPreview.tsx).

The TemplateVariablesGuide is available within the DiscordBuilder for easy access to variables like {{field:Your Field Label}}.

6

Test and Save

  • Test: Use the “Send Test Webhook” button. The TestWebhookResultDialog will show the outcome. The DiscordPreview component also gives an immediate visual preview as you build.
  • Save: Save your integration settings.

Example Discord Notification Embed

A well-configured Discord notification from Formora, as rendered by the DiscordPreview component, can look very informative and engaging:

Use Cases for Discord Integration

  • Gaming Communities: Announce new member applications, event sign-ups, or team registrations.
  • Project Teams: Share bug reports, feature requests, or user feedback submitted via forms directly into project channels.
  • Educational Groups: Notify students or group members about submitted assignments or workshop registrations.
  • SaaS & Product Feedback: Funnel user feedback from forms into a dedicated Discord channel for product teams.
  • Support Ticketing: Alert support staff in a private Discord channel about new help requests.

Managing Your Discord Integration

From Formora’s “Integrations” dashboard (IntegrationsList):

  • View and manage all your Discord webhook integrations.
  • Edit an existing configuration to change the message format, target forms, or Webhook URL.
  • Temporarily disable an integration.
  • Delete configurations that are no longer in use.

With its highly customizable embeds via the DiscordBuilder, the Formora-Discord integration is a fantastic way to keep your server members or team updated. Next up is the Slack Integration for similar real-time alerts in your Slack workspace.