L\u2019utilisation de la plateforme WhatsApp\u00a0Business pour g\u00e9n\u00e9rer ces mod\u00e8les peut simplifier votre communication avec la client\u00e8le et am\u00e9liorer grandement l\u2019exp\u00e9rience d\u2019utilisation.<\/p>\n\n
Prenons un exemple. Une entreprise de voyages fictive, Terrific\u00a0Travel\u00a0Ltd., propose des services de r\u00e9servation de transports, d\u2019h\u00e9bergement et d\u2019activit\u00e9s de loisirs. L\u2019ubiquit\u00e9 de WhatsApp \u00e0 l\u2019\u00e9chelle mondiale en fait la plateforme id\u00e9ale pour que cette entreprise communique avec sa client\u00e8le. Si les confirmations par e-mail sont excellentes pour la tenue des registres, la possibilit\u00e9 d\u2019interagir avec la client\u00e8le dans des conversations bidirectionnelles est d\u2019une grande valeur pour les voyageurs et les voyageuses en d\u00e9placement, et ce n\u2019est pas quelque chose que les SMS traditionnels permettent de faire.<\/p>\n\n
De plus, les mod\u00e8les de messages WhatsApp permettent \u00e0 Terrific\u00a0Travel\u00a0Ltd. de communiquer avec la bonne quantit\u00e9 de d\u00e9tails personnalis\u00e9s. Dans ce cas, un message de bienvenue personnalis\u00e9, des notifications opportunes et des billets \u00e9lectroniques accessibles instantan\u00e9ment peuvent rassurer la client\u00e8le sur la bonne gestion de son voyage, lui permettant ainsi de se d\u00e9tendre et de profiter de ses vacances.<\/p>\n\n
Pour d\u00e9couvrir \u00e0 quel point il est facile de tirer le meilleur parti de l\u2019API WhatsApp\u00a0Business et des mod\u00e8les de messages, ce tutoriel pratique vous guidera \u00e0 travers les processus de gestion des mod\u00e8les, notamment la cr\u00e9ation, la suppression et la personnalisation.<\/p>\n\n
G\u00e9rer des mod\u00e8les de messages avec la plateforme WhatsApp\u00a0Business<\/h4>\n\nConditions requises<\/b><\/h6>\n\n
Ce tutoriel suppose que vous disposez de connaissances de base concernant les applications Node.js<\/u><\/a> et Express.js<\/u><\/a>. Avant de continuer, veuillez suivre les \u00e9tapes indiqu\u00e9es dans la section d\u2019introduction<\/u><\/a> de la documentation de la plateforme WhatsApp\u00a0Business. Si vous \u00eates un fournisseur de solutions d\u2019entreprise <\/u><\/a> (BSP), suivez les instructions pour les fournisseurs de solutions d\u2019entreprise<\/u><\/a> et assurez-vous que votre application Meta passe le processus de r\u00e9vision.<\/p>\n\n Avant de suivre ce tutoriel, vous devez disposer d\u2019un ID WhatsApp\u00a0Business et d\u2019un ID de num\u00e9ro de t\u00e9l\u00e9phone.<\/p>\n\n Les fournisseurs de solutions professionnelles ont \u00e9galement besoin d\u2019un token d\u2019utilisateur syst\u00e8me avec les autorisations requises (whatsapp_business_management, whatsapp_business_messaging et business_management).<\/p>\n\n Si vous n\u2019avez pas d\u2019applications Node.js et Express.js, vous pouvez utiliser cette application de texte standard<\/a> cr\u00e9\u00e9e sp\u00e9cifiquement pour le tutoriel.<\/p>\n\n En outre, ce tutoriel utilisera plusieurs packages, notamment dotenv pour stocker le token et requests pour effectuer des requ\u00eates HTTP avec l\u2019API. Nous utiliserons \u00e9galement Postman<\/u><\/a> pour tester les points de terminaison de l\u2019API.<\/p>\n\n Si vous souhaitez explorer davantage ce projet, le code complet est disponible ici<\/a>.<\/p>\n\n Une fois que vous avez configur\u00e9 l\u2019application initiale et ajout\u00e9 le token avec les autorisations n\u00e9cessaires, vous pouvez commencer.<\/p>\n\n Imaginons que Global\u00a0Voyager souhaite cr\u00e9er plusieurs mod\u00e8les de messages \u00e0 des fins sp\u00e9cifiques. Par exemple, une entreprise souhaite cr\u00e9er un mod\u00e8le pour saluer la client\u00e8le et un autre pour envoyer des copies\u00a0PDF des documents pertinents.<\/p>\n\n Avant de commencer \u00e0 coder, prenez le temps de comprendre le fonctionnement du processus de cr\u00e9ation de mod\u00e8les et les types de param\u00e8tres accept\u00e9s. En outre, il est important de noter que Meta examine quotidiennement les mod\u00e8les et peut les rejeter s\u2019ils ne respectent pas les r\u00e8gles<\/u><\/a> comme sp\u00e9cifi\u00e9.<\/p>\n\n La documentation <\/u><\/a> indique que vous devez envoyer une requ\u00eate POST \u00e0 message_templates en utilisant votre ID WhatsApp\u00a0Business.<\/p>\n\n Les param\u00e8tres suivants sont accept\u00e9s\u00a0:<\/p>\n\n Le param\u00e8tre composants d\u00e9finit le corps du mod\u00e8le de message. Elle accepte les sous-param\u00e8tres suivants\u00a0:<\/p>\n\n Vous disposez \u00e0 pr\u00e9sent d\u2019un mod\u00e8le de message texte pour saluer la client\u00e8le et d\u2019un mod\u00e8le de message multim\u00e9dia pour envoyer un PDF. Comme dans notre exemple, ces mod\u00e8les sont parfaits pour l\u2019envoi de billets de voyage ou de confirmations d\u2019itin\u00e9raire.<\/p>\n\n Vous devez commencer par cr\u00e9er un routeur dans routes\/messageTemplates.js\u00a0:<\/p>\n\n Utilisez ensuite la m\u00e9thode de contr\u00f4leur createMessageTemplate, que nous allons cr\u00e9er dans controllers\/messageTemplate.js\u00a0:<\/p>\n\n Apr\u00e8s avoir cr\u00e9\u00e9 l\u2019acheminement et la m\u00e9thode, il est temps de tester l\u2019API dans Postman. Voici \u00e0 quoi ressemble la proc\u00e9dure\u00a0:<\/p>\n\n Voici le retour\u00a0:<\/p>\n\n Vous trouverez ci-dessous un exemple d\u2019objet de requ\u00eate que vous pouvez transmettre pour cr\u00e9er le mod\u00e8le de message. {{1}} est utilis\u00e9 pour transmettre des variables. Notez que {{X}} est utilis\u00e9 pour d\u00e9finir les variables du mod\u00e8le de message et non les variables Postman.<\/p>\n\n La r\u00e9ponse API renvoie la valeur id, qui repr\u00e9sente l\u2019ID du mod\u00e8le.<\/p>\n\n Une fois que vous avez fini de cr\u00e9er le mod\u00e8le bas\u00e9 sur du texte, vous pouvez cr\u00e9er des mod\u00e8les bas\u00e9s sur du contenu multim\u00e9dia tout aussi facilement. Il s\u2019agit de moyens flexibles et efficaces d\u2019envoyer des documents auxquels la client\u00e8le peut acc\u00e9der imm\u00e9diatement.<\/p>\n\n Le mod\u00e8le ci-dessous comporte un en-t\u00eate qui inclut le document joint, un corps de texte et un pied de page\u00a0:<\/p>\n\n Remarque<\/b>\u00a0: pour pouvoir utiliser les mod\u00e8les de message afin de communiquer avec la client\u00e8le, ces derniers doivent \u00eatre approuv\u00e9s et respecter les r\u00e8gles relatives aux mod\u00e8les de message<\/u><\/a>.<\/p>\n\n Maintenant que vous avez cr\u00e9\u00e9 les mod\u00e8les de message, vous pouvez les r\u00e9cup\u00e9rer. Pour ce faire, envoyez une requ\u00eate GET \u00e0\u00a0:<\/p>\n\n Remarque\u00a0: la version de l\u2019API peut changer. Assurez-vous que votre URL est mise \u00e0 jour en cons\u00e9quence.<\/p>\n\n Cr\u00e9ez ensuite une nouvelle route dans routes\/messageTemplates.js\u00a0:<\/p>\n\n La commande getMessageTemplates ci-dessus est une m\u00e9thode de contr\u00f4leur que vous pouvez cr\u00e9er dans controllers\/messageTemplate.js. Voir ci-dessous :<\/p>\n\n En cas de r\u00e9ponse positive, les mod\u00e8les que vous avez cr\u00e9\u00e9s et l\u2019exemple de mod\u00e8le de WhatsApp sont inclus.<\/p>\n\n De la m\u00eame mani\u00e8re que pour l\u2019itin\u00e9raire GET, vous pouvez \u00e9galement cr\u00e9er un itin\u00e9raire DELETE dans routes\/messageTemplates.js\u00a0:<\/p>\n\n Cr\u00e9ez \u00e0 pr\u00e9sent la m\u00e9thode associ\u00e9e aux manettes dans controllers\/messageTemplates.js\u00a0:<\/p>\n\n Pour supprimer un mod\u00e8le, vous devez transmettre le nom du mod\u00e8le en tant que corps JSON.<\/p>\n\n Par exemple, les captures d\u2019\u00e9cran ci-dessous montrent une requ\u00eate et une r\u00e9ponse Postman r\u00e9ussies pour la suppression d\u2019un mod\u00e8le nomm\u00e9 demo_template_user\u00a0:<\/p>\n\n Voyons \u00e0 pr\u00e9sent comment utiliser un mod\u00e8le de message pour envoyer des messages.<\/p>\n\n Commencez par fabriquer un routeur et sa manette. Dans routes\/messageTemplates.js, ajoutez\u00a0:<\/p>\n\n Dans le code ci-dessus, le param\u00e8tre\u00a0:id est utilis\u00e9 pour transmettre l\u2019ID du num\u00e9ro de t\u00e9l\u00e9phone. Voici \u00e0 quoi ressemble le contr\u00f4leur dans controllers\/messageTemplate.js.<\/p>\n\n Vous pouvez maintenant cr\u00e9er un objet de requ\u00eate dans Postman. N\u2019oubliez pas que vous devez transmettre un param\u00e8tre \u2014 {{1}} \u2014 dans l\u2019en-t\u00eate.<\/p>\n\n Le corps de la requ\u00eate Postman montre le mod\u00e8le bas\u00e9 sur un texte que nous avons cr\u00e9\u00e9.<\/p>\n\n Notez cet extrait de code \u00e0 partir de la capture d\u2019\u00e9cran ci-dessus\u00a0:<\/p>\n\n Cet extrait permet de transmettre la valeur au param\u00e8tre {{1}}. Une r\u00e9ponse positive comprend l\u2019ID du message, comme illustr\u00e9 ci-dessous.<\/p>\n\n Voici \u00e0 quoi ressemble ce message pour les client\u00b7es sur WhatsApp\u00a0:<\/p>\n\n Vous allez ensuite utiliser un objet de requ\u00eate JSON pour un autre mod\u00e8le dans lequel vous devez int\u00e9grer un document dans l\u2019en-t\u00eate ainsi que les variables {{1}}, {{2}} et {{3}} dans le corps du texte.<\/p>\n\n Tout d\u2019abord, regardez la capture d\u2019\u00e9cran suivante\u00a0:<\/p>\n\n Notez que l\u2019extrait ci-dessous transmet les param\u00e8tres de l\u2019ENT\u00caTE\u00a0:<\/p>\n\n Le contenu multim\u00e9dia joint peut \u00eatre un lien ou l\u2019ID du contenu multim\u00e9dia import\u00e9<\/u><\/a>.<\/p>\n\nCr\u00e9ation d\u2019un mod\u00e8le de message<\/h4>\n\n
\n
\n
Cr\u00e9ation d\u2019un mod\u00e8le de message bas\u00e9 sur un texte<\/h4>\n\n
router.post(\"\/messageTemplate\", createMessageTemplate);<\/code><\/pre>\n\nexports.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)); } } ); };<\/code><\/pre>\n\n![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.18.51-AM.png\")
<\/figure>\n\n![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.20.37-AM.png\")
<\/figure>\n\n{ \"name\": \"welcome_greetings\", \"language\": \"en_US\", \"category\": \"ALERT_UPDATE\", \"components\": [ { \"type\": \"HEADER\", \"format\":\"TEXT\", \"text\": \"Hi {{1}}! Comment allez-vous\u00a0?\" }, { \"type\": \"BODY\", \"text\": \"Merci d\u2019avoir choisi Terrific Travel Ltd. comme concierge de vacances\u00a0! N\u2019h\u00e9sitez pas \u00e0 nous contacter si vous avez des questions ou des doutes.\" }, { \"type\": \"FOOTER\", \"text\": \"Terrific Travel Ltd.\" } ] }<\/code><\/pre>\n\nCr\u00e9ation d\u2019un mod\u00e8le de message multim\u00e9dia<\/h4>\n\n
{ \"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.\" } ] }<\/code><\/pre>\n\nR\u00e9cup\u00e9rer une liste de mod\u00e8les de message existants<\/h4>\n\n
https://graph.facebook.com\/v13.0\/whatsapp-business-account-ID\/message_templates.<\/code><\/pre>\n\nrouter.get(\"\/messageTemplates\", getMessageTemplates);<\/code><\/pre>\n\nexports.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)); } } ); };<\/code><\/pre>\n\n![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.28.09-AM.png\")
<\/figure>\n\n![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.27.18-AM.png\")
<\/figure>\n\nSuppression d\u2019un mod\u00e8le de message<\/h4>\n\n
router.delete(\"\/messageTemplate\", deleteMessageTemplate);<\/code><\/pre>\n\nexports.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)); } } ); };<\/code><\/pre>\n\n![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.31.39-AM.png\")
<\/figure>\n\nEnvoyer un message \u00e0 l\u2019aide du mod\u00e8le<\/h4>\n\n
router.post(\"\/sendMessage\/:id\", sendMessage);<\/code><\/pre>\n\nexports.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)); } } ); };<\/code><\/pre>\n\n![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.34.38-AM.png\")
<\/figure>\n\n\"components\": [ { \"type\": \"HEADER\", \"parameters\": [ { \"type\": \"text\", \"text\": \"Name\" } ] } ]<\/code><\/pre>\n\n![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.36.58-AM.png\")
<\/figure>\n\n![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.38.31-AM.png\")
<\/figure>\n\n![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.40.25-AM.png\")
<\/figure>\n\n\"parameters\": [ { \"type\": \"DOCUMENT\", \"document\": { \"id\":\"984786545564592\" } } ] }, { Puis, le code suivant fait la m\u00eame chose pour le corps du message\u00a0: \"parameters\": [ { \"type\": \"text\", \"text\": \"Toronto\" }, { \"type\": \"text\", \"text\": \"Dubai\" }, { \"type\": \"text\", \"text\": \"2022-05-03\" } ] } ] } }<\/code><\/pre>\n\n
![\"\"](\"https:\/\/whatsappbusiness.com\/wp-content\/uploads\/2026\/03\/Screen-Shot-2022-05-24-at-10.42.35-AM.png\")
<\/figure>\n\n