Add image in container

Hello! How we can do this, add a image in a container like a thumbnail.
No description
10 Replies
d.js toolkit
d.js toolkit6mo ago
- What's your exact discord.js npm list discord.js and node node -v version? - Not a discord.js issue? Check out #other-js-ts. - Consider reading #how-to-get-help to improve your question! - Explain what exactly your issue is. - Post the full error stack trace, not just the top part! - Show your code! - Issue solved? Press the button! - Marked as resolved by OP
Mafia
Mafia6mo ago
You need to use a section builder and add a thumbnail accessory
d.js docs
d.js docs6mo ago
:method: SectionBuilder#setThumbnailAccessory() discord.js@14.19.3 Sets the accessory of this section to a thumbnail.
Mafia
Mafia6mo ago
Note: section must inclued at lest 1 text display
Mafia
Mafia6mo ago
discord.js Guide
Imagine a guide... that explores the many possibilities for your discord.js bot.
Sabu
SabuOP6mo ago
oh ty for the answer but i have a prblm with that
const mainSection = new SectionBuilder()
.addTextDisplayComponents(
textDisplay => textDisplay
.setContent(
"## Information sur YourBible \n\n" +
"YourBible is a Discord bot designed to help you read and understand the Bible daily.\n" +
"It offers features such as daily verses, Bible reading plans, and more."
)
)
.setThumbnailAccessory(
thumbnail => thumbnail
.setDescription("YourBible Logo")
.setURL('https://cdn.discordapp.com/attachments/1386075711118250014/1386313622891794452/Nouveau_projet_2.png')
);

const appInfoSection = new SectionBuilder()
.addTextDisplayComponents(
textDisplay => textDisplay
.setContent(
`**Version:** ${process.env.VERSION || 'Non définie'}\n` +
`**Nombre de serveurs:** ${interaction.client.guilds.cache.size}\n` +
`**Nombre d'utilisateurs:** ${interaction.client.users.cache.size}\n` +
`**En ligne depuis:** ${formatUptime(interaction.client.uptime)}`
)
);

const setupContainer = new ContainerBuilder()
.setAccentColor(0x252b34)
.addSectionComponents(mainSection)
.addSeparatorComponents(separator => separator)
.addSectionComponents(appInfoSection);

await interaction.reply({
components: [setupContainer],
flags: MessageFlags.IsComponentsV2 | MessageFlags.Ephemeral
});
const mainSection = new SectionBuilder()
.addTextDisplayComponents(
textDisplay => textDisplay
.setContent(
"## Information sur YourBible \n\n" +
"YourBible is a Discord bot designed to help you read and understand the Bible daily.\n" +
"It offers features such as daily verses, Bible reading plans, and more."
)
)
.setThumbnailAccessory(
thumbnail => thumbnail
.setDescription("YourBible Logo")
.setURL('https://cdn.discordapp.com/attachments/1386075711118250014/1386313622891794452/Nouveau_projet_2.png')
);

const appInfoSection = new SectionBuilder()
.addTextDisplayComponents(
textDisplay => textDisplay
.setContent(
`**Version:** ${process.env.VERSION || 'Non définie'}\n` +
`**Nombre de serveurs:** ${interaction.client.guilds.cache.size}\n` +
`**Nombre d'utilisateurs:** ${interaction.client.users.cache.size}\n` +
`**En ligne depuis:** ${formatUptime(interaction.client.uptime)}`
)
);

const setupContainer = new ContainerBuilder()
.setAccentColor(0x252b34)
.addSectionComponents(mainSection)
.addSeparatorComponents(separator => separator)
.addSectionComponents(appInfoSection);

await interaction.reply({
components: [setupContainer],
flags: MessageFlags.IsComponentsV2 | MessageFlags.Ephemeral
});
🚨 Erreur du client Discord : CombinedError (2)
Received one or more errors

1 ExpectedValidationError > s.instance(V)
| Expected
|
| Expected:
| | [Function: ButtonBuilder]
|
| Received:
| | undefined

2 ExpectedValidationError > s.instance(V)
| Expected
|
| Expected:
| | [Function: ThumbnailBuilder]
|
| Received:
| | undefined

at _UnionValidator.handle (C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\node_modules\@sapphire\shapeshift\dist\cjs\index.cjs:1965:23)
at _UnionValidator.parse (C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\node_modules\@sapphire\shapeshift\dist\cjs\index.cjs:972:90)
at SectionBuilder.toJSON (C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\dist\index.js:2169:37)
at C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\dist\index.js:1870:64
at Array.map (<anonymous>)
at ContainerBuilder.toJSON (C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\dist\index.js:1870:35)
at C:\Users\lunal\Documents\YourBible\node_modules\discord.js\src\structures\MessagePayload.js:151:46
at Array.map (<anonymous>)
at MessagePayload.resolveBody (C:\Users\lunal\Documents\YourBible\node_modules\discord.js\src\structures\MessagePayload.js:150:49)
at ChatInputCommandInteraction.reply (C:\Users\lunal\Documents\YourBible\node_modules\discord.js\src\structures\interfaces\InteractionResponses.js:198:56)
🚨 Erreur du client Discord : CombinedError (2)
Received one or more errors

1 ExpectedValidationError > s.instance(V)
| Expected
|
| Expected:
| | [Function: ButtonBuilder]
|
| Received:
| | undefined

2 ExpectedValidationError > s.instance(V)
| Expected
|
| Expected:
| | [Function: ThumbnailBuilder]
|
| Received:
| | undefined

at _UnionValidator.handle (C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\node_modules\@sapphire\shapeshift\dist\cjs\index.cjs:1965:23)
at _UnionValidator.parse (C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\node_modules\@sapphire\shapeshift\dist\cjs\index.cjs:972:90)
at SectionBuilder.toJSON (C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\dist\index.js:2169:37)
at C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\dist\index.js:1870:64
at Array.map (<anonymous>)
at ContainerBuilder.toJSON (C:\Users\lunal\Documents\YourBible\node_modules\@discordjs\builders\dist\index.js:1870:35)
at C:\Users\lunal\Documents\YourBible\node_modules\discord.js\src\structures\MessagePayload.js:151:46
at Array.map (<anonymous>)
at MessagePayload.resolveBody (C:\Users\lunal\Documents\YourBible\node_modules\discord.js\src\structures\MessagePayload.js:150:49)
at ChatInputCommandInteraction.reply (C:\Users\lunal\Documents\YourBible\node_modules\discord.js\src\structures\interfaces\InteractionResponses.js:198:56)
Mafia
Mafia6mo ago
appInfoSection needs an accessory as well. if you dont want one just use textdisplay on its own
Sabu
SabuOP6mo ago
perrfeeeect ty
Mafia
Mafia6mo ago
np
Sabu
SabuOP6mo ago
have a good day 😉

Did you find this page helpful?