Sari la conținutul principal
Dezvoltatori Carduri de mesaj

Creează carduri de mesaj

Tot ce postează un bot, fie dintr-un webhook, dintr-un răspuns la o comandă sau dintr-o actualizare după un buton, este un card. Un card bun spune dintr-o privire ce s-a întâmplat: o margine colorată, un titlu, un status și detaliile dedesubt.

Ce poți face

  • Afișează un statusO etichetă colorată precum Open, Merged sau Passing, cu liniile adăugate și șterse.
  • Listează detaliileRânduri cu etichetă și valoare pe care membrii le copiază cu o singură atingere.
  • Scrie în markdownText îngroșat, cod inline, blocuri de cod, citate și checkbox-uri.
  • Arată că lucreziUn spinner cât timp botul se gândește, apoi raționamentul lui ascuns după un comutator.

În aplicație

Patru carduri așa cum le văd membrii. Fiecare înseamnă doar câteva linii de JSON.

Anatomia unui card

Părțile unui card, de sus în jos. Lasă deoparte ce nu îți trebuie: și un card doar cu titlu este în regulă.

  1. Antet„Message from” și un nume: numele webhook-ului sau, la un răspuns la o comandă, numele comunității tale. Un răspuns poate adăuga un badge, de exemplu repository-ul.
  2. Titlu și statustitle, care devine link când setezi title_url, cu eticheta status alături.
  3. SubtitluO a doua linie îngroșată, sub_title.
  4. DescriereConținutul, în markdown.
  5. CâmpuriRânduri cu etichetă și valoare, cu un buton de copiere.
  6. SubsolOra, plus liniile adăugate și șterse, dacă le trimiți.
json
{
  "message_container": {
    "type": "embed_message",
    "badge": "acme/web",
    "color": "purple",
    "title": "Pull request #212 opened",
    "title_url": "https://github.com/acme/web/pull/212",
    "status": { "label": "Open", "color": "green", "icon": "pull_request" },
    "sub_title": "Faster search in the channel list",
    "description": "Search now runs **per keystroke** with a 120 ms debounce.",
    "fields": [
      { "field": "Author", "value": "maya" },
      { "field": "Reviewers", "value": "dani, sam" }
    ],
    "additions": 86,
    "deletions": 12,
    "files_changed": 3
  }
}

Toate câmpurile

Acestea merg în message_container. Un card are nevoie de o descriere sau de un loader. Câmpurile marcate „Răspunsuri la comenzi” sunt eliminate când postezi printr-un webhook.

CâmpTipCe face
typestringembed_message (implicit) sau system_message.
badgestringO etichetă mică după nume, în antet, de exemplu acme/web. Răspunsuri la comenzi
avatar_urlstringO imagine peste iconița cardului.
colorstringCuloarea marginii. Vezi culorile mai jos.
titlestringPrima linie, îngroșată.
title_urlstringTransformă titlul într-un link.
sub_titlestringO a doua linie îngroșată, sub titlu.
descriptionstringConținutul, în markdown.
fieldsarray[{ "field": "…", "value": "…" }]: rânduri cu etichetă și valoare.
image_url, image_base64stringO imagine pe card.
imagesarray[{ "image_url": "…" }]: o galerie cu mai multe imagini.
statusobject sau stringO etichetă colorată lângă titlu. Vezi mai jos. Răspunsuri la comenzi
additions, deletions, files_changednumberStatistici de diff în subsol. Răspunsuri la comenzi
loader, loader_text, loader_sub_textboolean, stringUn spinner în locul conținutului.
thinkingstringRaționament ascuns după comutatorul Show thinking. Răspunsuri la comenzi
Descrierea și thinking înțeleg markdown: **bold**, _italic_, ~~strike~~, `inline code`, blocuri de cod între backtick-uri triple, > quotes, checkbox-uri - [x], @mențiuni și :emoji:.

Status și statistici de diff

O etichetă de status spune povestea înainte ca cineva să citească textul. Stă lângă titlu sau, dacă nu există titlu, în subsol; statisticile de diff apar lângă oră. Ambele funcționează în răspunsurile la comenzi, iar integrarea GitHub încorporată le folosește. Un webhook le elimină.

json
{
  "message_container": {
    "color": "red",
    "title": "Build failed on main",
    "status": { "label": "Failing", "color": "red" },
    "description": "`search.test.js`: 2 of 212 tests failed."
  }
}
CâmpTipCe face
statusobject sau stringUn string simplu este eticheta: "status": "Open".
status.labelstringTextul etichetei. Fără el nu apare nicio etichetă.
status.colorstringgreen, purple, red, orange, yellow, blue sau gray.
status.iconstringO iconiță opțională din lista de mai jos.
additionsnumberLinii adăugate, afișate ca +86 verde.
deletionsnumberLinii șterse, afișate ca -12 roșu.
files_changednumberFișiere modificate, afișate ca 3 files.

Iconițe

ValoareIconițăUtilizare tipică
pull_requestgit-pull-requestUn pull request deschis
pull_request_closedgit-pull-request-closedÎnchis fără merge
merge, mergedgit-mergeIntegrat
commitgit-commitUn commit trimis cu push
issuecircle-dotUn issue deschis
issue_closedcircle-checkUn issue închis
checkcircle-checkTestele au trecut, un job a reușit

O mapare care funcționează pentru GitHub

Integrarea GitHub încorporată folosește aceste valori; copiază-le pentru propriile tale unelte.

EvenimentEtichetăCuloareIconiță
Pull request deschisOpengreenpull_request
CiornăDraftgraypull_request
IntegratMergedpurplemerged
Închis fără mergeClosedredpull_request_closed
Issue deschisOpengreenissue
Issue închisClosedpurpleissue_closed
Commit trimis cu pushCommitgraycommit
Teste trecutePassinggreencheck
Teste eșuateFailingredniciuna

Loader și raționament

Pentru orice durează puțin, cum ar fi un răspuns AI sau un job lung, postează mai întâi un card cu un spinner, apoi înlocuiește-l cu rezultatul. Loader-ul funcționează din webhook-uri și din răspunsurile la comenzi. Într-un răspuns la o comandă poți pune și raționamentul modelului în thinking: membrii văd un comutator Show thinking în loc de un zid de text.

assistant
System
Message from Assistant
Mă gândesc…Citesc ultimele 50 de mesaje

Întâi: loader-ul

assistant
System
Message from Assistant

maya: când e standup-ul?

Standup-ul e la 09:30, în #daily.
Am verificat mesajele fixate și evenimentul recurent din #daily.

Apoi: răspunsul, cu raționamentul pliat

json
{
  "message_container": {
    "type": "embed_message",
    "color": "blue",
    "loader": true,
    "loader_text": "Thinking…",
    "loader_sub_text": "Reading the last 50 messages"
  }
}
json
{
  "message_container": {
    "type": "embed_message",
    "color": "blue",
    "sub_title": "maya: when is the standup?",
    "description": "Standup is at **09:30**, in #daily.",
    "thinking": "Checked the pinned messages and the recurring event in #daily…"
  }
}
CâmpTipCe face
loaderbooleantrue afișează spinnerul în locul conținutului.
loader_textstringLinia de lângă spinner, de exemplu „Mă gândesc…”.
loader_sub_textstringO linie mai mică dedesubt.
thinkingstringRaționament pliat sub descriere, în markdown.

Ca să înlocuiești loader-ul cu răspunsul, actualizează mesajul cu un card nou fără loader. Cum se face afli la actualizări live.

Descrieri lungi

O descriere poate avea până la 50.000 de octeți. După primii 1.000, membrii văd începutul și un buton Show more care încarcă restul, așa că un raport lung nu inundă canalul.

Mesaje de sistem

Setează "type": "system_message" pentru un anunț în loc de o postare de bot: ferestre de mentenanță, schimbări de reguli, orice vorbește în numele comunității însăși. Acceptă aceleași câmpuri și butoane.

json
{
  "message_container": {
    "type": "system_message",
    "color": "orange",
    "title": "Maintenance tonight",
    "description": "The build servers are down from 22:00 to 23:00."
  }
}

Culori

Culoarea marginii este cel mai rapid semnal de pe un card. Folosește aceeași culoare pentru același tip de veste, de fiecare dată.

CuloareFolosește-o pentru
greenSucces: trecut, implementat, gata
redEșec: eșuat, căzut, respins
orangeUn avertisment care merită verificat
yellowSe așteaptă după cineva: aprobări, întrebări
blueInformații, culoarea implicită
purpleEvenimente din cod sau ceva special

Construiește-ți embedul

Editează câmpurile sau payload-ul JSON: cele două rămân sincronizate. Previzualizarea arată mesajul exact cum va apărea într-un canal. Acesta este body-ul real al webhook-ului; copiază-l când totul arată bine.

Șabloane
Butoane
Previzualizare
Body-ul webhook-ului

Construiește mai departe