Learn to Code via Tutorials on Repl.it!

← Back to all posts
Uso De Embeds Discord.JS | v11 - v12 | Español
h
TheEdaL (1)

Embeds

Si has estado en Discord durante un tiempo, es probable que hayas visto estos mensajes especiales, a menudo enviados por bots.
Pueden tener un borde de color, imágenes incrustadas, campos de texto, y otras propiedades de lujo.

En la siguiente sección explicaremos cómo componer un embed, enviarlo, y qué debes tener en cuenta al hacerlo.

Usando el constructor <branch version="11.x" inline>RichEmbed</branch><branch version="12.x" inline>MessageEmbed</branch>

Discord.js cuenta con la clase de utilidad <branch version="11.x" inline>RichEmbed</branch><branch version="12.x" inline>MessageEmbed</branch> para facilitar la construcción y manipulación de los embeds.

<branch version="11.x">

::: advertencia
En la versión 12 se han unificado las clases de incrustación de recepción y de salida; en su lugar deberá utilizar Discord.MessageEmbed() como constructor.
:::

// en la parte superior de su archivo
const Discord = require('discord.js');

// dentro de un comando, un escuchador de eventos, etc.
const exampleEmbed = new Discord.RichEmbed()
	.setColor('#0099ff')
	.setTitle('Algún título')
	.setURL('https://discord.js.org/')
	.setAuthor('Algún nombre', 'https://i.imgur.com/wSTFkRM.png', 'https://discord.js.org')
	.setDescription('Alguna descripción aquí')
	.setThumbnail('https://i.imgur.com/wSTFkRM.png')
	.addField('Título del campo normal', 'Algún valor aquí')
	.addBlankField()
	.addField('Título del campo en línea', 'Algún valor aquí', true)
	.addField('Título del campo Inline', 'Algún valor aquí', true)
	.addField('Título del campo en línea', 'Algún valor aquí', true)
	.setImage('https://i.imgur.com/wSTFkRM.png')
	.setTimestamp()
	.setFooter('Algún texto de pie de página aquí', 'https://i.imgur.com/wSTFkRM.png');
channel.send(exampleEmbed);
// en la parte superior de su archivo
const Discord = require('discord.js');

// dentro de un comando, un escuchador de eventos, etc.
const exampleEmbed = new Discord.MessageEmbed()
	.setColor('#0099ff')
	.setTitle('Algún título')
	.setURL('https://discord.js.org/')
	.setAuthor('Algún nombre', 'https://i.imgur.com/wSTFkRM.png', 'https://discord.js.org')
	.setDescription('Alguna descripción aquí')
	.setThumbnail('https://i.imgur.com/wSTFkRM.png')
	.addFields(
		{ name: 'Título del campo normal', value: 'Algún valor aquí' },
		{ name: '\u200B', value: '\u200B' },
		{ name: 'Inline field title', value: 'Some value here', inline: true },
		{ name: 'Inline field title', value: 'Some value here', inline: true },
	)
	.addField('Título del campo en línea', 'Algún valor aquí', true)
	.setImage('https://i.imgur.com/wSTFkRM.png')
	.setTimestamp()
	.setFooter('Algún texto de pie de página aquí', 'https://i.imgur.com/wSTFkRM.png');

channel.send(exampleEmbed);
</b>

::: consejo
No es necesario que incluyas todos los elementos mostrados anteriormente. Si quieres una incrustación más simple, simplemente deja algunos fuera.
:::

El método .setColor() acepta un entero, una cadena de color HEX, una matriz de valores RGB o cadenas de color específicas. Puedes encontrar una lista de ellos en <branch version="11.x" inline>la documentación de Discord.js</branch><branch version="12.x" inline>la documentación de Discord.js</branch>.

<branch version="11.x">

.addBlankField() es un método de conveniencia para .addField('\u200b', '\u200b'), utilizado para añadir un espaciador al embed. También se puede utilizar inline pasando true como primer parámetro.

</branch> <branch version="12.x">

.addBlankField() era un método conveniente para añadir un espaciador al embed. Para añadir un campo en blanco ahora puedes usar .addField('\u200b', '\u200b') en su lugar.

</brush>

El ejemplo anterior encadena los métodos de manipulación al objeto recién creado <branch version="11.x" inline>RichEmbed</branch><branch version="12.x" inline>MessageEmbed</branch>.
Si quieres modificar el embed en base a condiciones tendrás que referenciarlo como la constante exampleEmbed (para nuestro ejemplo).

<branch version="11.x"><!-- eslint-skip -->
const exampleEmbed = new Discord.RichEmbed().setTitle('Algún título');

if (message.author.bot) {
	exampleEmbed.setColor('#7289da');
}
</branch> <branch version="12.x"><!-- eslint-skip -->
const exampleEmbed = new Discord.MessageEmbed().setTitle('Algún título');

if (message.author.bot) {
	exampleEmbed.setColor('#7289da');
}
</branch>

Adjuntar imágenes

Puedes usar el método .attachFiles() para subir imágenes junto a tu embed y usarlas como fuente para los campos embed que soportan urls de imágenes. El método acepta el archivo fuente como ruta de archivo <branch version="11.x" inline>FileOptions</branch><branch version="12.x" inline>FileOptions</branch>, BufferResolvable (incluyendo una URL a una imagen externa), u objetos Attachment dentro de un array.

A continuación, puede hacer referencia y utilizar

Comments
hotnewtop
CodingCactus (4355)

Hi, as repl talk is English only, I have had to unlist this.