在開發 Discord Bot 時,最基本的功能就是發送一則訊息,然而,您可能會注意到某些 Bot 發出的訊息與自己的 Bot 或是使用者發送的訊息長得不太一樣,不僅有顏色、連結、使用者頭像、整齊的版面,還有不同的文字大小,甚至還能增加時間戳,究竟是用什麼工具來實現這些功能呢?接著看下去本篇教學吧。 :::success :book: **更多 Python Discord Bot 教學系列和程式範例** https://github.com/smallshawn95/Python-Discord-Bot-Teach.git ::: --- [TOC] --- ## ㄧ、Embed 簡介: Discord Embed 是 Discord Bot 中一個可以嵌入內容的訊息,讓訊息能夠以卡片的方式呈現更豐富的內容,像是添加標題、敘述、顏色、連結、時間戳等等。 Discord Embed 本身分為好幾個區塊,每個區塊都有相對應的函式,而這些函式是要拿來設定該區塊的內容和格式,接下來筆者就要來介紹 Embed 各區塊相對應的函式以及函式中的參數。 更多資訊可參考 [Discord.py Embed 官方文檔](https://discordpy.readthedocs.io/en/stable/api.html?#discord.Embed)。 ![Picture_9](https://i.imgur.com/PZ7A7vW.png) ## 二、Embed 撰寫: :::info :memo: **程式碼範例** 此教學文章中的內容皆附有程式碼範例,[點此前往](https://github.com/smallshawn95/Python-Discord-Bot-Teach/blob/main/Python%20Discord%20Bot%20%E9%80%B2%E9%9A%8E%E6%95%99%E5%AD%B8%20-%20Embed%20%E7%AF%87/cogs/embed.py)。 ::: :::info :memo: **小工具推薦** 一個初學者剛學習撰寫 Embed 的好用工具,可以即時查看 Embed 的版面配置,並且輸入完各版面的設定和內容後,產生出來的程式碼就可以直接複製到 Bot 中使用。 連結:https://cog-creators.github.io/discord-embed-sandbox/ ![Picture_1](https://i.imgur.com/234Jnto.png) ::: ### :paperclip: discord.Embed() 使用 Embed 工具時,要先創建一個 Embed 物件,通常會使用變數儲存,方便接下來的函式操作。 ```python embed = discord.Embed(title: str, description: str, url: str, color: discord.Color, timestamp: datetime.datetime) ``` - **title 標題** Embed 的標題,最多 256 個字符。 - **description 描述** Embed 的描述,最多 4096 個字符。 - **url 連結** 將 Embed 的標題變成超連結。 - **color 顏色** Embed 左側色條的顏色,設定顏色方式可參考[註一](#註一)。 - **timestamp 時間戳** Embed 的時間戳,通常使用 `datetime.datetime.now()` 做設置,可以根據本地時區變更日期時間。 ![Picture_2](https://i.imgur.com/WHjo6Jb.png) ### :paperclip: set_thumbnail() 這個函式用來設置 Embed 縮圖。 ```python embed.set_thumbnail(url: str) ``` * **url 連結** 設置 Embed 縮圖的圖片連結,僅支援 HTTP(S),如果想使用本地圖片可參考[註二](#註二)。 ![Picture_3](https://i.imgur.com/VED0de4.png) ### :paperclip: set_author() 這個函式用來設置 Embed 作者。 ```python! embed.set_author(name: str, url: str, icon_url: str) ``` * **name 名稱** 設置 Embed 作者的名稱。 * **url 連結** 將 Embed 作者名稱變成超連結。 * **icon_url 頭像連結** 設置 Embed 作者頭像的圖片連結,僅支援 HTTP(S),如果想使用本地圖片可參考[註二](#註二)。 ![Picture_4](https://i.imgur.com/1T4vxHD.png) ### :paperclip: set_image() 這個函式用來設置 Embed 圖片。 ```python embed.set_image(url: str) ``` * **url 連結** 設置 Embed 圖片的圖片連結,僅支援 HTTP(S),如果想使用本地圖片可參考[註二](#註二)。 ![Picture_5](https://i.imgur.com/sL80Q2x.png) ### :paperclip: set_footer() 這個函式用來設置 Embed 頁尾。 ```python embed.set_footer(text: str, icon_url: str) ``` * **text 文字** 設置 Embed 頁尾的名稱。 * **icon_url 頭像連結** 設置 Embed 頁尾頭像的圖片連結,僅支援 HTTP(S),如果想使用本地圖片可參考[註二](#註二)。 ![Picture_6](https://i.imgur.com/jWWg1Rr.png) ### :paperclip: add_field() 添加一個欄位到 Embed 中的函式,一個 Embed 最多只能添加 25 個欄位。 ```python embed.add_field(name: str, value: str, inline: bool) ``` * **name 名稱** 欄位的名稱,256 個字元。 * **value 內容** 欄位的內容,1024 個字元。 * **inline 同行** 是否讓欄位呈現在同一行,選擇同一行會根據版面大小自行調整位置。 | 同一行 | 不同一行 | | :---: | :---: | | ![Picture_7](https://i.imgur.com/7TxtImi.png) | ![Picture_8](https://i.imgur.com/JUDa4GC.png) | ## 三、Embed 傳送: 只要多添加一個 embed 參數,即可傳送 Embed 訊息。 ```python await interaction.response.send_message(embed = embed) ``` 如果想要傳送多個 Embed 訊息,可以使用 embeds 參數,使用串列傳入,最多包含 10 個 Embed。 ```python await interaction.response.send_message(embeds = [embed_1, embed_2]) ``` ## 四、文章註解: ### 註一 要設置 Embed 顏色可以使用下列方式,詳細內容可查看 [Discord.py Color 官方文檔](https://discordpy.readthedocs.io/en/stable/api.html?#discord.Colour)。 * **discord.Color.random()** * **discord.Color.顏色名稱()** * **discord.Color.from_rgb(r, g, b)** * r 【0-255】 * g 【0-255】 * b 【0-255】 * **discord.Color.from_str("字串")** 備註:hex 代表十六進位制顏色,num 代表 0-255 或 0-100% * 0x<hex> 【0x00ffff】 * #<hex> 【#00ffff】 * 0x#<hex> 【0x#00ffff】 * rgb(<num>, <num>, <num>) 【rgb(0, 255, 255)】 ### 註二 要使用本地圖片顯示在 Embed 中的話,需要先使用 File 上傳圖片,以下為程式碼範例。 ```python= # 先將圖片傳到 Discord 上 file = discord.File("圖片檔名") # Embed 要使用此圖片,只要 attachment://圖片檔名 即可使用 embed = discord.Embed() embed.set_image("attachment://圖片檔名") # 回覆使用者的訊息 await interaction.response.send_message(file = file, embed = embed) ``` --- 本次 Discord Embed 教學就到此結束囉!如果看完此篇教學覺得有幫助的話,可以幫筆者分享給更多剛學習 Discord Bot 的程式人,能夠讓大家輕鬆學會更多新技能,就是筆者莫大的榮幸,如果有大神覺得文章內容有誤或不完整,也歡迎到筆者的 Discord 伺服器中跟筆者反映、討論,敬請期待下一篇教學,最後非常感謝大家看完此篇教學! 這邊只介紹出 Embed 中比較常用到的函式,剩餘其他的函式可以到官方文檔自行研究。 --- :::info &#x1F4E2; **歡迎加入我的 Discord 伺服器** https://discord.gg/Jtd3eVrFJs ::: *Copyright © 2023 SmallShawn95. All rights reserved.*