Skip to content

Instantly share code, notes, and snippets.

@Antouto
Last active April 19, 2024 00:19
Show Gist options
  • Star 17 You must be signed in to star a gist
  • Fork 7 You must be signed in to fork a gist
  • Save Antouto/8ab83d83482af7c516f0b2b42eaee940 to your computer and use it in GitHub Desktop.
Save Antouto/8ab83d83482af7c516f0b2b42eaee940 to your computer and use it in GitHub Desktop.
Create custom forms for your discord server and send submissions to a channel of your choice using webhooks

Bot Invite Link: https://discord.com/api/oauth2/authorize?client_id=942858850850205717&permissions=536873984&scope=bot%20applications.commands

Support Server: https://discord.gg/FmscrYrzZP

Demo

Submitting the form

The form is posted to a channel via a custom webhook

Creating a form

To set up this bot you are required to understand JSON and how to create a json file. Learn More If you do not you can use this site to help you but currently it has many limits: https://form-builder.pages.dev/. (Beta)

The /form create command sends a message that has buttons which when clicked by the user open different forms. You will provide your configuration for the forms and the message in the json parameter of the command as a json file attachement. You can create a blank text file, paste in the json and change the files ending to .json or you can create a json file in vscode. Whatever works for you.

JSON Structure
Field Type Description
message? message or webhook object The message the forms are attached to. Don't include if you'd like to use a slash command to open your form
forms array of form objects The forms that are added to the message
select_menu_placeholder? string Max 100 chars. Placeholder for the select menu to open forms. Don't include if you'd like to use buttons or a slash command to open forms.
application_command? application_command object Defines a slash command which is used to open the form. Don't include type and options keys. Don't include this key at all if you'd like to open your forms using buttons or a select menu.
Example JSON:

If you try to use this make sure to put in your own webhook_url fields.

{
   "message": {
     "content": "Forms:"
   },
  "forms": [
    {
      "webhook_url": "https://canary.discord.com/api/webhooks/943079791593140254/IWdNCgmLwL1OpmywlCRWqxtnJvvkeu9Yat9RDJhUsllvi7vp7p8Lpj7vCz-xQz8MZeqj",
      "button": {
        "label": "Submit Feedback",
        "style": 1
      },
      "modal": {
        "title": "Submit Feedback",
        "components": [
          {
            "type": 1,
            "components": [
              {
                "type": 4,
                "label": "Title / Summary",
                "max_length": 256,
                "style": 1
              }
            ]
          },
          {
            "type": 1,
            "components": [
              {
                "type": 4,
                "label": "Description (Optional)",
                "style": 2,
                "required": false
              }
            ]
          }
        ]
      }
    },
    {
      "webhook_url": "https://canary.discord.com/api/webhooks/943079791593140254/IWdNCgmLwL1OpmywlCRWqxtnJvvkeu9Yat9RDJhUsllvi7vp7p8Lpj7vCz-xQz8MZeqj",
      "button": {
        "label": "Report User",
        "style": 4
      },
      "modal": {
        "title": "Report User",
        "components": [
          {
            "type": 1,
            "components": [
              {
                "type": 4,
                "label": "Username",
                "placeholder": "spammer",
                "max_length": 256,
                "style": 1
              }
            ]
          },
          {
            "type": 1,
            "components": [
              {
                "type": 4,
                "label": "Evidence",
                "style": 2
              }
            ]
          }
        ]
      }
    }
  ]
}
Form Structure
Field Type Description
webhook_url? * string The discord webhook url form submissions will be posted to
external_webhook_url? * string The non-discord webhook url form submissions will be posted to
button? ** button object The button that opens your form
select_menu_option? ** select menu option object The select menu option that opens your form
modal modal object The form pop-up modal
submit_message? message object Custom Submission Message. Read More
conformation_message? message object Custom Ephemeral Conformation Message. Read More
role_restriction? role_restriction object White- or Blacklist roles from using the form
on_submit? on_submit object Additional Actions to perform on form submission

* You need to include at least one of webhook_url and external_webhook_url. You could for example use an external_webhook_url to send form responses to google sheets. Here is a google sheets addon that creates a webhook for you: https://workspace.google.com/marketplace/app/webhooks_for_sheets/860288437469.

** You need to include either button or select_menu_option in all of the forms depening on if you want your forms to be opened by buttons or select menus.

Button Structure
Field Type Description
label? string text that appears on the button, max 80 characters
style integer one of button styles
emoji? partial emoji name, id, and animated
Button Styles
Button Value
Primary 1
Secondary 2
Success 3
Danger 4
Select Menu Option Structure
Field Type Description
label string text that appears on the option, max 100 characters
description? string an additional description of the option, max 100 characters
emoji? partial emoji name, id, and animated
Modal Structure
Field Type Description
title string the title of the pop-up modal, max 45 characters
components array of action rows between 1 and 5 (inclusive) action rows that make up the modal
Action Row Structure
Field Type Description
type component type 1 for an action row
components array of text inputs exactly 1 text field
Text Input Structure
Field Type Description
type component type 4 for a text input
style integer 1 for single, 2 for multi-line input
label string the label for this component, min 1, max 45
min_length? integer the minimum input length for a text input, min 0, max 1024
max_length? integer the maximum input length for a text input, min 1, max 1024
required? boolean whether this component is required to be filled, default true
value? string a pre-filled value for this component, max 1024 characters
placeholder? string custom placeholder text if the input is empty, max 100 characters
Role Restriction Structure
Field Type Description
type string whitelist or blacklist
roles array of snowflakes Array of the ids of the roles you want to resctrict
message? message object Custom message when user tries to open restricted form. Supports variables.
On Submit Structure
Field Type Description
ADD_ROLE_TO_SUBMITTER? snowflake Adds a specified role to the form submitter
REMOVE_ROLE_FROM_SUBMITTER? snowflake Removes a specified role from the form submitter

? suffix means "optional field"

Webhooks

Submit Messages

The default submission messages look like this:

To customise this message you can add a submit_message in a form object where you want to customise the submission. This submit_message is a discord message object and you can use variables in it. To separately customise the direct message and guild submission message use dm_submit_message and guild_submit_message instead. You can set dm_submit_message to null to remove the dm submission message message completely.

You can also use conformation_message if you prefer a ephemeral reply to the form submission. ("flags": 1 << 6 is set by default) Note that using this will disable the default dm submission message, which you can re-enable using dm_submit_message if you wish.

Example form with custom submit messages:

{
   "message": {
     "content": "Advertise your clan:"
   },
  "forms": [
    {
      "webhook_url": "INSERT_YOUR_WEBHOOK_URL",
      "button": {
        "label": "Advertise Clan",
        "style": 1
      },
      "submit_message": {
        "embeds": [
          {
            "color": "{UserAccentColour}",
            "title": "{TextInputValue1}",
            "description": "{TextInputValue2}",
            "fields": [
              {
                "name": "{TextInputLabel3}",
                "value": "{TextInputValue3}"
              }
            ],
            "thumbnail": {
              "url": "{TextInputValue5}"
            },
            "image": {
              "url": "{TextInputValue4}"
            },
            "footer": {
              "icon_url": "{MemberAvatarURL}",
              "text": "{NicknameAndUserTag} - ID: {UserID}"
            }
          }
        ]
      },
      "modal": {
        "title": "Post Clan Advertisement",
        "components": [
          {
            "type": 1,
            "components": [
              {
                "type": 4,
                "label": "Clan Name",
                "style": 1,
                "max_length": "256"
              }
            ]
          },
          {
            "type": 1,
            "components": [
              {
                "type": 4,
                "label": "Clan Description",
                "style": 2
              }
            ]
          },
          {
            "type": 1,
            "components": [
              {
                "type": 4,
                "label": "Clan Invite Link",
                "style": 1,
                "placeholder": "https://discord.gg/...",
                "min_length": "20",
                "max_length": "100"
              }
            ]
          },
          {
            "type": 1,
            "components": [
              {
                "type": 4,
                "label": "Banner URL",
                "style": 1,
                "placeholder": "https://...",
                "min_length": "12",
                "required": false
              }
            ]
          },
          {
            "type": 1,
            "components": [
              {
                "type": 4,
                "label": "Icon/Logo URL",
                "style": 1,
                "placeholder": "https://...",
                "min_length": "12",
                "required": false
              }
            ]
          }
        ]
      }
    }
  ]
}

Example Submission:

Variables

Variable Example Fallback
{TextInputLabel<1-5>} How are you? null
{TextInputValue<1-5>} Great! null
{UserName} Forms
{UserDisplayName} Forms Username
{UserDiscriminator}* 5609 0
{UserID} 942858850850205717
{UserTag} Forms#5609 Username
{UserMention} <@942858850850205717>
{UserAccentColour} 5793266 Blurple (5793266)
{UserAvatarURL} cdn.discord.com/avatars...
{UserProfileURL} discord.com/users...
{MemberNickname} Form Bot Username
{MemberAvatarURL} cdn.discord.com/avatars... User Avatar
{NicknameAndUsername} Form Bot (Forms) Just Username
{UsernameAndNickname} Forms (Form Bot) Just Username
{NicknameAndUserTag}* Form Bot (Forms#5609) Just User Tag or Just Username
{UserTagAndNickname}* Forms#5609 (Form Bot) Just User Tag or Just Username
{FormTitle} Staff Application
{UnixTimestamp}** 1710619508

* Deprecated

** The unix timestamp is in seconds and can be displayed in a message using <t:{UnixTimestamp}>. Optionally there are also different timestamp styles.

@vico93
Copy link

vico93 commented Oct 28, 2022

The invite for the support server is currently invalid.

@Antouto
Copy link
Author

Antouto commented Dec 12, 2022

The invite for the support server is currently invalid.

Thanks @vico93, fixed.

@TheTrueInfinity
Copy link

The template given on https://form-builder.pages.dev/templates is not working.

@g336
Copy link

g336 commented Jun 17, 2023

I am getting a problem, is there any solution to this?
error

@WernerBrownJr
Copy link

Greetings

I need to use more than 25 forms, is there a way past that limit or is this an obstacle I can not overcome?

Regards.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment