Template pesan WhatsApp adalah cara efektif untuk mengirimkan informasi penting kepada pelanggan. Anda bisa menggunakannya untuk mengirimkan pengingat, notifikasi, atau pembaruan yang dikustomisasi.
WhatsApp memungkinkan Anda memulai percakapan langsung dengan pengguna yang sudah setuju menerima pesan. Selain itu, Anda dapat membalas pesan apa pun yang telah dimulai oleh pengguna. Pengguna ini kemudian dapat menerima pesan berbasis template dari WhatsApp.
Menggunakan Platform WhatsApp Business untuk membuat template ini bisa melancarkan komunikasi Anda dengan klien dan sangat meningkatkan pengalaman pengguna.
Mari kita lihat contohnya. Bisnis perjalanan hipotetis — Terrific Travel Ltd. — menawarkan layanan reservasi transportasi, perhotelan, dan kegiatan rekreasi. Karena tersedia secara global, WhatsApp menjadi platform ideal bagi bisnis ini untuk berkomunikasi dengan klien. Meskipun konfirmasi email sangat baik untuk penyimpanan catatan, kemampuan untuk berinteraksi dengan pelanggan dalam percakapan dua arah sangat berharga bagi wisatawan yang sedang bepergian — dan bukan yang bisa dilakukan SMS tradisional.
Selain itu, template pesan WhatsApp memungkinkan Terrific Travel Ltd. untuk berkomunikasi dengan jumlah detail yang dipersonalisasi secara optimal. Dalam hal ini, pesan sambutan yang disesuaikan, pemberitahuan yang tepat waktu, dan tiket elektronik yang dapat diakses secara instan dapat memberikan ketenangan bagi pelanggan bahwa perjalanan mereka dikelola dengan baik — sehingga mereka dapat bersantai dan menikmati liburan.
Untuk membuktikan betapa mudahnya memanfaatkan WhatsApp Business API dan template pesan secara maksimal, tutorial praktis ini akan memandu Anda melakukan proses pengelolaan template, termasuk pembuatan, penghapusan, dan penyesuaian.
Mengelola Template Pesan dengan Platform WhatsApp Business
Prasyarat
Tutorial ini mengasumsikan Anda memiliki pengetahuan dasar tentang Node.js dan Express.js. Sebelum melanjutkan, harap selesaikan langkah-langkah yang ada di bagian pendahuluan dokumentasi Platform WhatsApp Business. Jika Anda adalah penyedia solusi bisnis (BSP), ikuti Memulai untuk Penyedia Solusi Bisnis dan pastikan aplikasi Anda di Meta lolos proses peninjauan.
Sebelum melanjutkan tutorial ini, pastikan Anda memiliki ID WhatsApp Business dan ID nomor telepon.
Selain itu, BSP memerlukan token pengguna sistem dengan izin yang diperlukan (whatsapp_business_management, whatsapp_business_messaging, dan business_management).
Jika Anda tidak memiliki aplikasi Node.js dan Express.js, Anda bisa menggunakan boilerplate aplikasi ini yang dibuat khusus untuk tutorial ini.
Selain itu, tutorial ini akan menggunakan beberapa paket, termasuk dotenv untuk menyimpan token dan permintaan untuk membuat permintaan HTTP dengan API. Kita juga akan menggunakan Postman untuk menguji endpoint API.
Untuk eksplorasi lebih lanjut, kode lengkap tersedia di sini.
Setelah menyiapkan aplikasi awal dan menambahkan token dengan izin yang tepat, Anda siap memulai.
Membuat Template Pesan Baru
Misalnya, Global Voyager ingin membuat beberapa template pesan untuk tujuan tertentu. Misalnya, mereka ingin membuat satu template untuk salam pelanggan dan template lain untuk mengirimkan salinan PDF dokumen yang relevan.
Sebelum Anda mulai melakukan coding, luangkan waktu untuk memahami cara kerja proses pembuatan template dan jenis parameter yang diterima. Selain itu, penting untuk diperhatikan bahwa Meta meninjau template setiap hari dan dapat menolaknya jika tidak mematuhi pedoman yang telah ditentukan.
Dokumentasi menyatakan bahwa Anda perlu membuat permintaan POST ke message_templates menggunakan ID WhatsApp Business Anda.
Parameter berikut diterima:
- kategori jenis ENUM
- komponen dari array JSON jenis
- bahasa
- nama
Parameter komponen menentukan isi template pesan. Ini menerima subparameter berikut:
- jenis — dari jenis ENUM of HEADER, BODY, FOOTER, dan BUTTONS
- — dari jenis enum TEKS, GAMBAR, DOKUMEN, VIDEO, LOKASI
- teks — dari tipe string
- tombol — dari jenis array JSON
Sekarang, Anda sudah memiliki template pesan berbasis teks untuk menyapa pelanggan dan template pesan berbasis media untuk mengirim PDF — dan seperti contoh kami, ini akan sempurna untuk mengirim tiket perjalanan atau konfirmasi rencana perjalanan.
Membuat Template Pesan Berbasis Teks
Pertama, Anda perlu membuat router baru di routes/messageTemplates.js:
router.post("/messageTemplate", createMessageTemplate);Lalu, gunakan metode kontroler createMessageTemplate, yang akan kita buat di dalam controllers/messageTemplate.js:
exports.createMessageTemplate = async (req, res) => {exports.createMessageTemplate = async (req, res) => { const { name, language, category, components } = req.body; if (!name || !language || !category || !components) { return res.status(400).json({ error: "Required Fields: name, language, category, and components", }); } request.post( { url: `https://graph.facebook.com/v13.0/${process.env.META_BUSINESS_ID}/message_templates`, headers: { Authorization: `Bearer ${process.env.META_AUTH_TOKEN}`, "content-type": "application/json", }, body: JSON.stringify({ name: name, language: language, category: category, components: components, }), }, function (err, resp, body) { if (err) { console.log("Error!"); } else { res.json(JSON.parse(body)); } } ); };Sekarang, setelah membuat rute dan metode, kini saatnya untuk menguji API di Postman. Berikut ini tampilannya:
Dan ini adalah hasilnya:
Di bawah ini adalah contoh objek permintaan yang dapat Anda masukkan untuk membuat template pesan. {{1}} digunakan untuk memasukkan variabel. Perhatikan bahwa {{X}} digunakan untuk menentukan variabel template pesan, bukan variabel Postman.
{ "name": "welcome_greetings", "language": "en_US", "category": "ALERT_UPDATE", "components": [ { "type": "HEADER", "format":"TEXT", "text": "Hai {{1}}! Apakah kabar Anda?" }, { "type": "BODY", "text": "Terima kasih telah memilih Terrific Travel Ltd. sebagai rekan liburan Anda! Please reach out to us if you have any questions or concerns." }, { "type": "FOOTER", "text": "Terrific Travel Ltd." } ] }Tanggapan API yang berhasil mengembalikan nilai id, yang mewakili ID template.
Membuat Template Pesan Berbasis Media
Setelah menyelesaikan template berbasis teks, Anda bisa membuat template berbasis media dengan sama mudahnya. Ini adalah cara yang fleksibel dan efisien untuk mengirim dokumen yang bisa langsung diakses pelanggan.
Template di bawah ini akan menampilkan JUDUL yang akan menyertakan dokumen terlampir, komponen BODY, dan komponen FOOTER:
{ "name": "sample_ticket_confirmation", "language": "en_US", "category": "TICKET_UPDATE", "components": [ { "type": "HEADER", "format": "DOCUMENT" }, { "type": "BODY", "text": "This is your flight confirmation for {{1}}-{{2}} on {{3}}." }, { "type": "FOOTER", "text": "This message is from an unverified business." } ] }Catatan: Sebelum Anda dapat menggunakan template pesan untuk berkomunikasi dengan pelanggan, template harus disetujui dan mematuhi Pedoman Template Pesan.
Mengambil Daftar Template Pesan yang Ada
Sekarang setelah Anda membuat template pesan, Anda bisa mengambilnya. Untuk melakukan ini, buat panggilan GET ke:
https://graph.facebook.com/v13.0/whatsapp-business-account-ID/message_templates.Catatan: Versi API dapat berubah. Pastikan bahwa URL Anda diperbarui.
Selanjutnya, buat rute baru di routes/messageTemplates.js:
router.get("/messageTemplates", getMessageTemplates);getMessageTemplates di atas adalah metode kontroler yang bisa Anda buat di controllers/messageTemplate.js. Lihat di bawah:
exports.getMessageTemplates = async (req, res) => { request.get( { url: `https://graph.facebook.com/v13.0/${process.env.META_BUSINESS_ID}/message_templates`, headers: { Authorization: `Bearer ${process.env.META_AUTH_TOKEN}`, }, }, function (err, resp, body) { if (err) { console.log("Error!"); } else { res.json(JSON.parse(body)); } } ); };Tanggapan yang berhasil menyertakan template yang Anda buat dan template contoh dari WhatsApp.
Menghapus Template Pesan
Sama seperti rute GET, Anda juga bisa membuat rute DELETE di routes/messageTemplates.js:
router.delete("/messageTemplate", deleteMessageTemplate);Sekarang, buat metode kontroler pendukung di controllers/messageTemplates.js:
exports.deleteMessageTemplate = async (req, res) => { request.delete( { url: `https://graph.facebook.com/v13.0/${process.env.META_BUSINESS_ID}/message_templates`, headers: { Authorization: `Bearer ${process.env.META_AUTH_TOKEN}`, "content-type": "application/json", }, body: JSON.stringify({ name: req.body.name, }), }, function (err, resp, body) { if (err) { console.log("Error!"); } else { res.json(JSON.parse(body)); } } ); };Untuk menghapus template, Anda harus meneruskan nama template sebagai isi JSON.
Contoh: cuplikan layar di bawah menunjukkan permintaan dan tanggapan Postman yang berhasil untuk menghapus template bernama demo_template_user:
Mengirim Pesan Menggunakan Template
Sekarang, mari kita gunakan template pesan untuk mengirim pesan.
Pertama, buat router dan kontrolernya yang mendukung. Di dalam routes/messageTemplates.js, tambahkan:
router.post("/sendMessage/:id", sendMessage);Dalam kode di atas, parameter :id digunakan untuk mengirimkan ID nomor telepon. Berikut ini tampilan kontroler di controllers/messageTemplate.js.
exports.sendMessage = async (req, res) => { const { id, to, type,template } = req.body; if (!id || !to || !type || !template) { return res.status(400).json({ error: "Required Fields: to, type, template and id", }); } request.post( { url: `https://graph.facebook.com/v13.0/${req.params.id}/messages`, headers: { Authorization: `Bearer ${process.env.META_AUTH_TOKEN}`, "content-type": "application/json", }, body: JSON.stringify({ messaging_product: process.env.MESSAGING_PRODUCT, to: to, type: type, template: template, }), }, function (err, resp, body) { if (err) { console.log("Error!"); } else { res.json(JSON.parse(body)); } } ); };Anda sekarang dapat membuat objek permintaan di Postman. Ingat, Anda akan melewati satu parameter — {{1}} — di Header.
Isi permintaan Postman menunjukkan template berbasis teks yang telah kita buat.
Perhatikan snippet kode ini dari cuplikan layar di atas:
"components": [ { "type": "HEADER", "parameters": [ { "type": "text", "text": "Name" } ] } ]Snippet ini digunakan untuk meneruskan nilai ke parameter {{1}}. Tanggapan yang berhasil mencakup ID pesan, seperti yang terlihat di bawah ini.
Berikut tampilan pesan ini kepada pelanggan di WhatsApp:
Selanjutnya, Anda akan menggunakan objek permintaan JSON untuk template lain yang perlu Anda teruskan dokumen di HEADER serta variabel {{1}}, {{2}}, dan {{3}} di BODY.
Pertama, lihat cuplikan layar berikut:
Perhatikan bahwa snippet di bawah ini melewati parameter untuk HEADER:
"parameters": [ { "type": "DOCUMENT", "document": { "id":"984786545564592" } } ] }, { Then, the following code does the same for the BODY: "parameters": [ { "type": "text", "text": "Toronto" }, { "type": "text", "text": "Dubai" }, { "type": "text", "text": "2022-05-03" } ] } ] } }Media yang dilampirkan bisa berupa tautan atau ID media yang diunggah.
Terakhir, gambar di bawah ini menunjukkan bagaimana tampilan output yang berhasil di WhatsApp.
Kesimpulan
Dengan tutorial ini, Anda baru saja mulai menjelajahi kemampuan WhatsApp Business API untuk membuat templat pesan yang sederhana namun andal. Kemudahan dan fleksibilitas WhatsApp Business API dapat membantu bisnis apa pun meningkatkan sistem komunikasi mereka untuk membantu mengubah pelanggan menjadi klien bisnis jangka panjang. Saatnya memanfaatkan peluang.
