Section

type: 9 Messages

The Section places text on the left and an accessory on the right. The accessory can be a Thumbnail (small image) or a Button.

Preview

My BotAPPToday at 12:00 PM

Ana García

Level 42 · 12,350 XP

Member since 2021

Event notifications

Get notified when an event starts.

Enable

payload.json

{
  "flags": 32768,
  "components": [
    {
      "type": 9,
      "components": [
        {
          "type": 10,
          "content": "### Ana García"
        },
        {
          "type": 10,
          "content": "Level **42** · 12,350 XP\n-# Member since 2021"
        }
      ],
      "accessory": {
        "type": 11,
        "media": {
          "url": "attachment://avatar.png"
        },
        "description": "Ana's avatar"
      }
    },
    {
      "type": 9,
      "components": [
        {
          "type": 10,
          "content": "**Event notifications**\nGet notified when an event starts."
        }
      ],
      "accessory": {
        "type": 2,
        "style": 3,
        "label": "Enable",
        "custom_id": "enable_notifications"
      }
    }
  ]
}

Fields

Field	Type	Description
type	integer	required Always 9.
id	integer	optional Unique identifier in the message.
components	array	required 1 to 3 Text Display components.
accessory	component	required A Thumbnail or a Button.

Caution

• The accessory is required. If you only want text, use a Text Display directly.
• Messages only, not modals.
• Discord warns that other children besides Text Display may be allowed in the future: don’t assume they’ll always be text when reading messages.

Code

HTTP

Use the JSON above as the message body.

JavaScript

import { SectionBuilder, ButtonStyle, MessageFlags } from 'discord.js';

const profile = new SectionBuilder()
  .addTextDisplayComponents(
    (text) => text.setContent('### Ana García'),
    (text) => text.setContent('Level **42** · 12,350 XP\n-# Member since 2021'),
  )
  .setThumbnailAccessory((thumbnail) =>
    thumbnail.setURL('attachment://avatar.png').setDescription("Ana's avatar"),
  );

const notifications = new SectionBuilder()
  .addTextDisplayComponents((text) =>
    text.setContent('**Event notifications**\nGet notified when an event starts.'),
  )
  .setButtonAccessory((button) =>
    button.setCustomId('enable_notifications').setLabel('Enable').setStyle(ButtonStyle.Success),
  );

await channel.send({
  flags: MessageFlags.IsComponentsV2,
  components: [profile, notifications],
  files: ['./avatar.png'],
});

Python

profile = discord.ui.Section(
    "### Ana García",
    "Level **42** · 12,350 XP\n-# Member since 2021",
    accessory=discord.ui.Thumbnail("attachment://avatar.png", description="Ana's avatar"),
)

notifications = discord.ui.Section(
    "**Event notifications**\nGet notified when an event starts.",
    accessory=discord.ui.Button(label="Enable", style=discord.ButtonStyle.success, custom_id="enable_notifications"),
)

view = discord.ui.LayoutView()
view.add_item(profile)
view.add_item(notifications)
await channel.send(view=view, file=discord.File("avatar.png"))

Tip

In discord.py you can pass plain strings (str) to Section: they become TextDisplays.

Go

description := "Ana's avatar"

profile := discordgo.Section{
  Components: []discordgo.MessageComponent{
    discordgo.TextDisplay{Content: "### Ana García"},
    discordgo.TextDisplay{Content: "Level **42** · 12,350 XP\n-# Member since 2021"},
  },
  Accessory: discordgo.Thumbnail{
    Media:       discordgo.UnfurledMediaItem{URL: "attachment://avatar.png"},
    Description: &description,
  },
}

notifications := discordgo.Section{
  Components: []discordgo.MessageComponent{
    discordgo.TextDisplay{Content: "**Event notifications**\nGet notified when an event starts."},
  },
  Accessory: discordgo.Button{Label: "Enable", Style: discordgo.SuccessButton, CustomID: "enable_notifications"},
}

Tips

• Perfect for lists of options: each row is a Section with its own button.
• The accessory button works like any other button: you’ll receive its custom_id.
• Use the Thumbnail’s description as alt text for accessibility.