Is anyone able to show me how I could add the discord Interactive Buttons onto this embed. I'm looking for just a simple button that will link somewhere. Thanks for the help

const Discord = require("discord.js")
const { Client, Message } = require('discord.js');
const { MessageEmbed } = require('discord.js');

module.exports = {
    name: 'text',
    cooldown: 1000,
    run: async(client, message, args) => {
        message.delete()
        const exampleEmbed = new MessageEmbed()
            .setColor('#000')
            .setAuthor("Text")
            .setDescription('Text')
            .addFields(
                {
                    name: `TextTitle`,
                    value: `Text`,
                    inline: true
                },
                {
                    name: `TextTitle`,
                    value: `Text`
                }        )


        message.channel.send(exampleEmbed)}
}

Is anyone able to show me how I could add the discord Interactive Buttons onto this embed. I'm looking for just a simple button that will link somewhere. Thanks for the help

const Discord = require("discord.js")
const { Client, Message } = require('discord.js');
const { MessageEmbed } = require('discord.js');

module.exports = {
    name: 'text',
    cooldown: 1000,
    run: async(client, message, args) => {
        message.delete()
        const exampleEmbed = new MessageEmbed()
            .setColor('#000')
            .setAuthor("Text")
            .setDescription('Text')
            .addFields(
                {
                    name: `TextTitle`,
                    value: `Text`,
                    inline: true
                },
                {
                    name: `TextTitle`,
                    value: `Text`
                }        )


        message.channel.send(exampleEmbed)}
}

• javascript
• discord
• discord.js

1 Answer 1

First of all, you should call the MessageButton and MessageActionRow:

const { MessageEmbed, MessageActionRow, MessageButton } = require('discord.js');

Then we make a simple embed:

        const exampleEmbed = new MessageEmbed()
            .setColor('#000')
            .setAuthor({ name: "Text" })
            .setDescription('Text')
            .addFields(
                {
                    name: `TextTitle`,
                    value: `Text`,
                    inline: true
                },
                {
                    name: `TextTitle`,
                    value: `Text`
                })

After that, We make a row and add some buttons to it:

        const row = new MessageActionRow()
            .addComponents(
                new MessageButton()
                    .setLabel('Invite') // label of the button
                    .setEmoji('➕') // emoji
                    .setURL('https://https://stackoverflow.') // URL of where the button leads the user
                    .setStyle('LINK') // style of the button
            )

Then we send them:

        message.channel.send({ embeds: [exampleEmbed], ponents: [row] })

There are 5 styles of building buttons: PRIMARY, SECONDARY, SUCCESS, DANGER, LINK

Final Result:

You can visit Discordjs guides for More Info on Buttons

UPDATE: Discord.js v12 For creating buttons in discord.js v12, We should import buttons from the discord-buttons package.

const { MessageButton } = require('discord-buttons');

Then we make the button:

let button = new MessageButton()
.setStyle('url')
.setURL('https://stackoverflow.')
.setLabel('invite');

Then we send it:

message.channel.send('test',button)

discord buttons v12 styles:

• green
• red
• blurple
• url