Halaman ini menjelaskan cara aplikasi Google Chat dapat memformat teks untuk mengirim pesan yang berisi salah satu hal berikut:
- Rich text yang berisi hyperlink atau @sebutan untuk satu atau semua pengguna di ruang Chat.
- Teks yang muncul di antarmuka kartu, termasuk sebagai teks paragraf atau teks UI yang ditampilkan bersama ikon, seperti tombol.
Memformat pesan teks
Chat memungkinkan Anda menambahkan pemformatan dasar ke pesan teks, termasuk tebal, miring, dan coret. Anda memformat teks secara berbeda dalam pesan teks dibandingkan dalam pesan kartu karena pesan teks diformat dengan sintaksis yang sama dengan yang digunakan pengguna Chat.
Untuk pesan yang dikirim atau diambil menggunakan Chat API, Anda dapat menggunakan
sintaksis Markdown standar (MARKUP_SYNTAX_MARKDOWN) atau sintaksis
markup Chat (MARKUP_SYNTAX_CHAT). Anda dapat mengonfigurasi Sintaksis markup default tingkat aplikasi di Konsol Google Cloud (lihat Mengonfigurasi
Google Chat API):
- Markdown: Sintaksis Markdown standar (
MARKUP_SYNTAX_MARKDOWN), berdasarkan spesifikasi CommonMark dengan ekstensi tambahan. Aplikasi Chat yang baru dibuat ditetapkan secara default ke Markdown. - Chat: Sintaksis markup Chat (
MARKUP_SYNTAX_CHAT). Aplikasi Chat yang ada ditetapkan secara default ke Chat untuk mempertahankan kompatibilitas mundur.
Anda juga dapat menentukan markup_syntax pada setiap permintaan Chat API
untuk mengganti setelan default tingkat aplikasi. Jika markup_syntax tidak ditentukan dalam
permintaan API, markup akan ditetapkan berdasarkan cara Anda memanggil Chat API:
- Aplikasi Chat yang dikonfigurasi: Menggunakan Sintaksis markup yang disimpan di halaman Konfigurasi Chat API.
- Project Cloud yang tidak dikonfigurasi (tanpa konfigurasi): Jika project Cloud Anda memanggil Chat API tanpa konfigurasi aplikasi Chat yang disimpan, permintaan akan ditetapkan secara default ke
MARKUP_SYNTAX_MARKDOWN. - Webhook masuk: Defaultnya adalah
MARKUP_SYNTAX_CHAT. Lihat Mengirim pesan menggunakan webhook masuk.
Untuk memformat pesan teks, gunakan sintaksis berikut:
| Format | MARKUP_SYNTAX_CHAT | MARKUP_SYNTAX_MARKDOWN | Contoh sintaksis | Teks yang ditampilkan di Google Chat |
|---|---|---|---|---|
| Tebal | * |
** |
Atau:
|
hello |
| Miring | _ (garis bawah) |
* |
Atau:
|
hello |
| Coret | ~ |
~~ |
Atau:
|
|
| Monospace | ` (kutip terbalik) | ` (kutip terbalik) | `hello` | hello |
| Blok monospace | ` ` ` (tiga tanda kutip terbalik) | ` ` ` (tiga tanda kutip terbalik) | ``` Halo Dunia ``` |
Hello |
| Daftar berbutir | * atau - (tanda hubung) diikuti dengan spasi | * atau - (tanda hubung) diikuti dengan spasi | * Ini adalah item pertama dalam daftar. * Ini adalah item kedua dalam daftar. |
|
| Daftar bertingkat | * atau - (tanda hubung) diikuti dengan spasi, didahului dengan empat spasi per tingkat bertingkat | * atau - (tanda hubung) diikuti dengan spasi, didahului dengan empat spasi per tingkat bertingkat | * Ini adalah item dengan kedalaman bertingkat satu dalam daftar. * Ini adalah item dengan kedalaman bertingkat dua dalam daftar. * This is the item with nested depth three in the list. |
|
| Daftar bernomor | Tidak didukung | 1. (angka diikuti dengan titik dan spasi) | 1. Ini adalah item pertama dalam daftar. 2. Ini adalah item kedua dalam daftar. |
|
| Blok kutipan | > (tanda lebih besar dari) | > (tanda lebih besar dari) | >halo |
|
| Hyperlink | <hyperlink|display text> |
[display text](hyperlink) |
Atau:
|
Untuk mempelajari lebih lanjut cara membuat hyperlink, lihat Memformat link. |
| Menyebut pengguna | <users/{user}> dengan {user} sebagai ID pengguna. |
Atau:
|
Atau:
|
@Mahan S Untuk mempelajari lebih lanjut cara menyebut pengguna, lihat Menyebut pengguna dalam pesan teks. |
| Custom Emoji |
Atau:
|
Atau:
|
Atau:
Atau:
Atau:
|
🐱 (Emoji kustom Kucing Tersenyum) |
| Pengutipan | Tidak didukung | <chat-citation data-id="{id}">{text}</chat-citation> dengan {id} adalah ID kutipan yang ditentukan dalam pesan elements. |
<chat-citation data-id="cite_1">cited text</chat-citation> |
teks yang dikutip Untuk mempelajari lebih lanjut kutipan, lihat Menambahkan kutipan ke pesan teks. |
Misalnya, perhatikan JSON berikut:
{
"text": "Your pizza delivery *has arrived*!\nThank you for using _Cymbal Pizza!_"
}
Pesan teks yang diformat ini menampilkan hal berikut di ruang Chat:
Melihat pemformatan teks yang dikirim dalam pesan
Saat pengguna mengirim pesan, isi teks biasa dari pesan tersebut berada di kolom text. Beberapa pemformatan yang diterapkan ke pesan teks menggunakan sintaksis
Markdown, ada di kolom text. Pemformatan tambahan ada di kolom formattedText khusus output, termasuk hal berikut:
- Sintaksis Markdown tambahan untuk teks
- Sebutan pengguna
- Hyperlink kustom
- Emoji kustom
Misalnya, pertimbangkan teks berikut yang dikirim oleh pengguna:
Jika pesan diformat menggunakan menu Format di
UI Chat, kolom text hanya berisi teks, sedangkan
kolom formattedText berisi markup, teks, dan hyperlink. Contoh
berikut menunjukkan draf pesan teks dengan kata yang di-hyperlink,
item dalam daftar, dan satu kata yang dicetak tebal:
Pesan diterima dalam format berikut:
{
"text": "I can meet there at:\nNoon\n3 pm\n5 pm\nWhat time works for you?",
"formattedText": "I can meet <http://example.com|there> at:\n* Noon\n* 3 pm\n* 5 pm\nWhat time works for *you*?",
}
Link format
Jika Anda menyertakan URL link biasa dalam teks pesan, seperti
http://www.example.com/, Google Chat akan menggunakannya sebagai teks link dan
secara otomatis membuat hyperlink teks tersebut ke URL yang ditentukan.
Untuk memberikan teks link alternatif untuk link Anda, gunakan sintaksis berikut:
Untuk pesan API yang dikonfigurasi dengan Markdown, gunakan sintaksis link Markdown standar:
Contoh sintaksis Teks yang ditampilkan di Google Chat [Example website](https://example.com)Untuk pesan teks biasa standar, gunakan sintaksis pipe:
Contoh sintaksis Teks yang ditampilkan di Google Chat <https://example.com|Example website>Tanda pipa dan teks link bersifat opsional, sehingga
<https://example.com>danhttps://example.comsetara.
Menggunakan emoji kustom dalam pesan teks
Aplikasi Chat dapat mengirim pesan teks dengan emoji kustom untuk mempersonalisasi pesan. Emoji kustom hanya tersedia untuk organisasi Google Workspace, dan administrator harus mengaktifkan emoji kustom untuk organisasi. Untuk mengetahui informasi selengkapnya, lihat Mempelajari emoji kustom di Google Chat dan Mengelola izin emoji kustom.
Untuk membuat pesan dengan emoji kustom, aplikasi Anda harus menggunakan autentikasi pengguna. Emoji kustom tidak didukung dalam pesan yang dibuat sebagai webhook atau dalam pesan yang dibuat dengan autentikasi aplikasi.
Untuk menambahkan emoji kustom ke teks pesan, tentukan name atau
emoji_name resource customEmoji:
{
"text": "Hello <customEmojis/CUSTOM_EMOJI_ID>."
}
Untuk menggunakan contoh ini, ganti CUSTOM_EMOJI_ID dengan ID untuk emoji kustom. Anda dapat menemukan ID ini di kolom
name
atau emoji_name
dari resource customEmoji.
Jika aplikasi Anda mengirim pesan menggunakan sintaksis Markdown, Anda dapat menentukan emoji kustom dalam format tag HTML menggunakan ID emoji kustom:
{
"text": "Hello <chat-emoji data-custom-emoji=\"customEmojis/CUSTOM_EMOJI_ID\">."
}
Atau, Anda dapat menentukan nama emoji kustom:
{
"text": "Hello <chat-emoji data-emoji-name=\"CUSTOM_EMOJI_NAME\">."
}
Untuk menggunakan contoh ini, ganti CUSTOM_EMOJI_ID dengan ID emoji kustom, dan CUSTOM_EMOJI_NAME dengan nama shortcode emoji kustom.
Menyebut pengguna dalam pesan teks
Aplikasi Chat dapat mengirim pesan teks yang @menyebut satu atau semua pengguna di ruang Chat. Aplikasi Chat juga dapat menyebutkan pengguna yang belum bergabung ke ruang atau merupakan anggota ruang yang berada dalam mode impor.
Pesan senyap tidak mendukung penyebutan pengguna. Menyertakan sebutan dalam pesan senyap akan menampilkan error.
@sebutkan pengguna tertentu
Untuk @menyebut pengguna tertentu, tambahkan <users/{user}> ke pesan teks dengan
{user} adalah ID pengguna. Misalnya, pertimbangkan pesan teks berikut dengan 123456789012345678901 mewakili ID untuk pengguna Mahan S.:
{
"text": "A customer has reported an issue. Assigning ticket #942 to <users/123456789012345678901>."
}
Jika aplikasi Anda mengirim pesan menggunakan sintaksis Markdown, gunakan format tag HTML chat-user untuk menentukan ID pengguna:
{
"text": "Assigning ticket #942 to <chat-user data-user=\"users/123456789012345678901\">."
}
Atau tentukan melalui email:
{
"text": "Assigning ticket #942 to <chat-user data-email=\"mahan@example.com\">."
}
Pesan teks akan ditampilkan seperti berikut:
Anda dapat menentukan nilai users/{user} dengan cara berikut:
- Jika aplikasi Google Chat Anda merespons pesan yang dikirim oleh
pengguna, Anda dapat menggunakan kolom
message.sender.namedari peristiwa interaksiMESSAGE. Jika aplikasi Google Chat Anda membuat pesan teks asinkron, Anda dapat menentukan nilai untuk
users/{user}dengan cara berikut:- Gunakan kolom
namedari resourceUserGoogle Chat, sepertiusers/123456789012345678901. - Gunakan alamat email pengguna sebagai alias untuk nilai
{user}. Misalnya, jika alamat emailnya adalahmahan@example.com, Anda dapat menentukan pengguna sebagaiusers/mahan@example.com. Untuk menggunakan alias email, aplikasi Google Chat Anda harus melakukan autentikasi sebagai pengguna.
- Gunakan kolom
Jika menggunakan People API, Anda juga dapat menggunakan metode
people.getuntuk mengidentifikasi ID pengguna.
@sebut semua pengguna
Untuk membuat pesan teks yang @menyebut semua orang di ruang, ganti {user}
dengan all. Contoh JSON berikut menyebutkan semua pengguna dalam pesan:
{
"text": "Important message for <users/all>: Code freeze starts at midnight tonight!"
}
Jika aplikasi Anda mengirim pesan menggunakan sintaksis Markdown, tentukan sebutan menggunakan format tag HTML chat-user:
{
"text": "Important message for <chat-user data-user=\"users/all\">: Code freeze starts at midnight tonight!"
}
Menambahkan kutipan ke pesan teks
Aplikasi Chat dapat menyertakan kutipan dalam pesan teks untuk memberikan informasi sumber yang mendetail kepada pengguna. Anda dapat memberikan sumber dengan dua cara:
- Kutipan inline: Tambahkan kartu interaktif yang muncul saat pengguna mengarahkan kursor ke bagian tertentu dari teks pesan Anda.
- Sumber footer: Menampilkan daftar sumber di bagian bawah pesan sebagai link footer.
Kutipan hanya didukung jika markupSyntax pesan ditetapkan ke MARKUP_SYNTAX_MARKDOWN. Fitur ini hanya didukung melalui pembuatan pesan asinkron menggunakan Chat API.
Untuk menambahkan kutipan inline ke pesan:
- Berikan sumber dalam daftar
citationsdari pesanelements, dengan menetapkanidunik ke setiap objekCitation. - Dalam teks pesan, gabungkan teks yang ingin Anda kutip menggunakan format tag HTML
chat-citation:<chat-citation data-id="{id}">{text}</chat-citation>. Pastikan{id}cocok dengan ID yang Anda tentukan dielements. Kutipan yang tidak direferensikan (yang tidak memiliki tag yang cocok) akan diabaikan.
{
"text": "This is a <chat-citation data-id=\"cite_1\">cited</chat-citation> text.",
"markupSyntax": "MARKUP_SYNTAX_MARKDOWN",
"elements": {
"citations": [
{
"id": "cite_1",
"citedSources": [
{
"title": "Example Source",
"uri": "https://example.com"
}
]
}
]
}
}
Untuk menambahkan sumber footer ke pesan, berikan sumber dalam daftar citedSources pesan elements. Setiap sumber yang diberikan di sini akan otomatis muncul di bawah pesan sebagai link footer, dan tidak memerlukan tag inline dalam teks pesan.
{
"text": "This is a message with a footer source.",
"markupSyntax": "MARKUP_SYNTAX_MARKDOWN",
"elements": {
"citedSources": [
{
"title": "Example Source",
"uri": "https://example.com"
}
]
}
}
Memformat teks yang muncul di kartu
Di dalam kartu, sebagian besar kolom teks mendukung pemformatan teks dasar menggunakan sebagian kecil tag HTML. Anda memformat teks secara berbeda dalam pesan kartu dibandingkan dalam pesan teks karena pesan teks diformat dengan sintaksis yang sama dengan yang digunakan pengguna Chat.
Gunakan Card Builder untuk mendesain dan melihat pratinjau pesan dan antarmuka pengguna untuk aplikasi Chat:
Buka Card BuilderMemformat teks paragraf
Tag yang didukung dan tujuannya ditampilkan dalam tabel berikut:
| Format | Contoh | Hasil yang dirender |
|---|---|---|
| Tebal | "This is <b>bold</b>." |
Teks ini tebal. |
| Miring | "This is <i>italics</i>." |
Ini adalah miring. |
| Garis bawah | "This is <u>underline</u>." |
Ini adalah garis bawah. |
| Coret | "This is <s>strikethrough</s>." |
Ini adalah |
| Warna font | "This is <font color=\"#FF0000\">red font</font>." |
Ini adalah font merah. |
| Hyperlink | "This is a <a href=\"https://www.google.com\">hyperlink</a>." |
Ini adalah hyperlink. |
| Waktu | "This is a time format: <time>2023-02-16 15:00</time>." |
Berikut adalah format waktu: . |
| Baris baru | "This is the first line. <br> This is a new line." |
This is the first line. Ini adalah baris baru. |
Untuk menentukan daftar dan blok kode, gunakan tag berikut:
| Format | Contoh | Hasil yang dirender |
|---|---|---|
| Baris baru | "Line 1<br>Line 2" |
Baris 1 Baris 2 |
| Monospace | "This is an <code>inline code</code>." |
Ini adalah inline code. |
| Blok monospace | "<pre><code>This a code block.</code></pre>" |
|
| Daftar berbutir | "<ul><li>List item 1</li><li>List item 2</li></ul>" |
|
| Daftar yang diurutkan | "<ol><li>List item 1</li><li>List item 2</li></ol>" |
|
Markdown
Jika Sintaksis Markdown diaktifkan, Anda dapat menggunakan sintaksis berikut:
| Format | Contoh | Hasil yang dirender |
|---|---|---|
| Tebal | **halo** atau __halo__ | hello |
| Miring | *halo* atau _halo_ | hello |
| Coret | ~halo~ | |
| Monospace | `hello` | hello |
| Blok monospace | ``` Halo Dunia ``` |
Hello |
| Daftar berbutir | - Ini adalah item pertama dalam daftar - Ini adalah item kedua dalam daftar |
|
|
* Ini adalah item pertama dalam daftar * Ini adalah item kedua dalam daftar |
|
|
| Daftar yang diurutkan | 1. Ini adalah item pertama dalam daftar 2. Ini adalah item kedua dalam daftar |
|
| Hyperlink | [Contoh situs](https://example.com) | Contoh situs |
Menambahkan ikon ke teks
Untuk menampilkan ikon bersama teks dalam kartu, Anda dapat menggunakan widget
DecoratedText
dan
ButtonList.
Bagian berikut menjelaskan cara menggunakan ikon bawaan, ikon Google Material, atau ikon kustom dalam teks atau tombol yang didekorasi.
Menggunakan ikon dari Chat
Untuk menggunakan ikon bawaan yang tersedia di Chat, tentukan salah satu hal berikut:
Tabel berikut mencantumkan ikon bawaan yang tersedia untuk pesan kartu:
| AIRPLANE | BOOKMARK | ||
| BUS | CAR | ||
| JAM | CONFIRMATION_NUMBER_ICON | ||
| DESCRIPTION | DOLLAR | ||
| EVENT_SEAT | |||
| FLIGHT_ARRIVAL | FLIGHT_DEPARTURE | ||
| HOTEL | HOTEL_ROOM_TYPE | ||
| UNDANG | MAP_PIN | ||
| MEMBERSHIP | MULTIPLE_PEOPLE | ||
| PERSON | PHONE | ||
| RESTAURANT_ICON | SHOPPING_CART | ||
| STAR | STORE | ||
| TIKET | TRAIN | ||
| VIDEO_CAMERA | VIDEO_PLAY |
Berikut adalah contoh kartu dengan ikon email:
Menggunakan ikon material Google
Anda dapat menggunakan ikon material Google untuk memilih dari lebih dari 2.500+ opsi ikon dan menyesuaikan bobot, isian, dan tingkat ikon.
Berikut adalah contoh kartu dengan ikon Google Material:
Menggunakan ikon kustom
Untuk menambahkan ikon kustom, sertakan kolom iconUrl dan tentukan URL yang sesuai dengan ikon.
Berikut adalah contoh ikon kustom: