Discord Introductions Template

{
  "username": "Introductions",
  "components": [
    {
      "type": 17,
      "accent_color": 15418782,
      "components": [
        {
          "type": 10,
          "content": "# 🙋 Introduce yourself!\nNew here? Tap the button below, fill in a quick form, and your intro posts right here so everyone can say hi."
        },
        {
          "type": 14,
          "divider": true,
          "spacing": 1
        },
        {
          "type": 10,
          "content": "**We'd love to know**\n- 🙂 Your name or nickname\n- 🌍 Where you're from\n- ✨ What brought you here\n- 🎯 A hobby or what you're currently into"
        },
        {
          "type": 1,
          "components": [
            {
              "type": 2,
              "style": 1,
              "label": "Introduce yourself",
              "emoji": {
                "name": "🙋"
              },
              "custom_id": "introduce_self"
            }
          ]
        }
      ]
    },
    {
      "type": 10,
      "content": "-# The button opens a quick pop-up form — don't be shy, everyone started with their first message. 😊"
    }
  ],
  "flags": 32768
}

// Components V2 message — discord.js v14.19 or newer.
// Designed in DWEEB (https://dweeb.faizo.net). Edit the text, then send.
const {
  ActionRowBuilder,
  ButtonBuilder,
  ButtonStyle,
  ContainerBuilder,
  MessageFlags,
  SeparatorBuilder,
  SeparatorSpacingSize,
  TextDisplayBuilder,
} = require("discord.js");

const container = new ContainerBuilder()
  .setAccentColor(0xeb459e)
  .addTextDisplayComponents(
    new TextDisplayBuilder().setContent(
      [
        "# 🙋 Introduce yourself!",
        "New here? Tap the button below, fill in a quick form, and your intro posts right here so everyone can say hi.",
      ].join("\n"),
    ),
  )
  .addSeparatorComponents(
    new SeparatorBuilder().setDivider(true).setSpacing(SeparatorSpacingSize.Small),
  )
  .addTextDisplayComponents(
    new TextDisplayBuilder().setContent(
      [
        "**We'd love to know**",
        "- 🙂 Your name or nickname",
        "- 🌍 Where you're from",
        "- ✨ What brought you here",
        "- 🎯 A hobby or what you're currently into",
      ].join("\n"),
    ),
  )
  .addActionRowComponents(
    new ActionRowBuilder().addComponents(
      new ButtonBuilder()
        .setStyle(ButtonStyle.Primary)
        .setLabel("Introduce yourself")
        .setEmoji("🙋")
        .setCustomId("introduce_self"),
    ),
  );

const text = new TextDisplayBuilder().setContent(
  "-# The button opens a quick pop-up form — don't be shy, everyone started with their first message. 😊",
);

// Buttons and menus with a custom ID do nothing until your bot handles the
// interaction: client.on("interactionCreate", …) and match on customId.
// The design also sets username "Introductions" — webhook-only options that
// channel.send() has no equivalent for. WebhookClient#send accepts them.

// Send it from any async context: a command handler, an event, a script.
await channel.send({
  components: [container, text],
  flags: MessageFlags.IsComponentsV2,
});

# Components V2 message — discord.py 2.6 or newer.
# Designed in DWEEB (https://dweeb.faizo.net). Edit the text, then send.
import discord
from discord import ui


def build_view() -> ui.LayoutView:
    view = ui.LayoutView(timeout=None)
    view.add_item(
        ui.Container(
            ui.TextDisplay(
                "# 🙋 Introduce yourself!\n"
                "New here? Tap the button below, fill in a quick form, and your intro posts right here so everyone can say hi.",
            ),
            ui.Separator(visible=True, spacing=discord.SeparatorSpacing.small),
            ui.TextDisplay(
                "**We'd love to know**\n"
                "- 🙂 Your name or nickname\n"
                "- 🌍 Where you're from\n"
                "- ✨ What brought you here\n"
                "- 🎯 A hobby or what you're currently into",
            ),
            ui.ActionRow(
                ui.Button(
                    style=discord.ButtonStyle.primary,
                    label="Introduce yourself",
                    emoji="🙋",
                    custom_id="introduce_self",
                ),
            ),
            accent_colour=0xeb459e,
        ),
    )
    view.add_item(
        ui.TextDisplay(
            "-# The button opens a quick pop-up form — don't be shy, everyone started with their first message. 😊",
        ),
    )
    return view


# Buttons and menus with a custom_id do nothing until your bot handles them:
# subclass ui.LayoutView with callbacks, or listen for on_interaction.
# The design also sets username "Introductions" — webhook-only options that
# channel.send() has no equivalent for. discord.Webhook.send accepts them.

# Send it from any coroutine: a command, an event listener, a task.
await channel.send(view=build_view())