How to generate creative content from the platform?
The Botmaker platform continues adding functionalities to optimize communication with users/clients and thus obtain better results. In this sense, you can now generate images and PDFs from an HTML template that completes with the conversation variables.
Estimated reading time: 06 minutes
From Menu>Chatbots, in the intent of your choice, you can add the render template action to create images and PDFs from HTML as a template.
You can generate the document or image on the fly from the platform by filling in conversation variables that will be taken from the bot. To do this, it is necessary to include an HTML template and replace in certain places values with variables stored in the bot.
Also, an important consideration is that this content is generated at the moment the user is talking and requesting that information (certificate, ticket, receipt) and is sent in real time through the channel in which the conversation is taking place (Example: WhatsApp, Webchat).
Example of PDF generation
HTML Code
<!DOCTYPE html>
<html lang=“en”>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Botmaker - Multimedia Template </title>
</head>
<body>
<h1> Multimedia Template Example </h1>
</body>
</html>
In the multimedia template UI, you will see a field called "Document type", where you need to enter the type of file to be generated (pdf/jpg/png). Then, you have to complete these two fields:
- Html template : complete that field with the HTML code.
- Cdn link var : fill in the variable where the generated file will be saved.
Example of image generation
HTML Code
<!DOCTYPE html>
<html lang=“en”>
<head>
<meta charset=“UTF-8”>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Botmaker - Multimedia Template </title>
</head>
<body>
<h1> Multimedia Template Example </h1>
</body>
</html>
What are the advantages of this feature?
The render template action offers many possibilities in situations where it is required to generate documents for the customer/user, for example:
Make an automatic receipt at the closing of an online purchase, as in the case of bots that generate transactions (receipts, documents that are generated in the process).
Generate certificates with QR codes. Below, you can see an example of HTML code valid for both document and image formats :
HTML Code
<!DOCTYPE html>
<html lang=“en”>
<head>
<meta charset=“UTF-8”>
<meta http-equiv=“X-UA-Compatible” content=“IE=edge”>
<meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
<title>Botmaker - Multimedia Template</title>
</head>
<body>
<h1> Multimedia Template Example </h1>
<img src=“https://cdn.eslkidsgames.com/wp-content/uploads/2020/10/QR-Code-Roleplay-Card-Example.png” alt=" ">
</body>
</html>
You just need to layout an HTML with your design team and include it on the platform so you can use it when needed. Thus, the document or image is created with the information your customer shares within the conversation and/or with data from integrations via API.
Optimize and efficiently manage your communications on the platform and in real time with this new feature!
Remember to visit our Help Center for further information.
Written by: Botmaker Team
Updated: 02/18/2022