Symptom / Need

I need to implement guided and dynamic interactions with my customers via WhatsApp, such as surveys, registration forms, or appointment scheduling processes, and automate these conversations without direct agent intervention. Standard message templates aren't sufficient for the complexity of these interactions.

Context / Scenarios

WhatsApp Flow Templates (also known as Meta Flows) are a powerful tool for creating structured, interactive conversational experiences. They are ideal for scenarios where the following are required:

• Gather information: Conduct satisfaction surveys, obtain customer data for registration, or update user profiles.
• Guide the user through a process: such as scheduling an appointment, selecting options from an extensive menu, or requesting a service quote interactively.
• Automate actions: Allowing the customer to complete a process directly from WhatsApp, reducing the need to switch to other platforms or require human interaction.

In Wolkvox Manager, this functionality is integrated through ChatBot routing points in Wolkvox Studio, using the "Respond Chat" component with WhatsApp Cloud API connectors. It's essential to understand that the Flow template must be previously created and approved in Meta Business Manager.

Note: To consult the official Meta documentation about Flow templates [ click here ].

Answer (Solution / Recommendation)

To send a Flow Template to WhatsApp using Wolkvox Studio, you must follow these key steps:

Step 1: Create and approve the flow template in Meta Business Manager (mandatory requirement)

First, the Flow template must be designed, created, and approved in your Meta Business Manager account, under the Marketing or Utility template types, under the "Flow" option. Wolkvox Studio does not allow the creation of Flow templates; it only facilitates their submission.

Step 2: Configuration in Wolkvox Studio (Routing Point ChatBot)

Once your Flow template is approved in Meta, you can configure it to be sent from your ChatBot in Wolkvox Studio.

1. Enter wolkvox Studio:
   1. Access your Wolkvox Manager.
   2. In the left side menu, navigate to "Wolkvox Studio" (the section where you design your flows).
   3. Open the ChatBot type routing point where you want to send the 'Flow'.
   4. Add the “Reply Chat” component.
   5. From the component palette, drag and drop the "Reply Chat" component into your design flow. Connect it to your chatbot's logic at the desired point (e.g., after an initial greeting or a specific question).
   6. Double-click the "Reply Chat" component to open its configuration window.
2. Go to the "Advanced" tab.
3. In the "Templates" field, click the drop-down menu and select "Flow template (cloud API)" approved in Meta Business Manager.
4. Click the "Load Template" button. This will automatically load the minimal JSON structure required for your Flow.
5. Set the JSON for the Flow Parameters: The text field in the "Reply Chat" component will display a JSON structure similar to this:

{
    "type": "flow",
    "name_template": "tu_nombre_de_flow_aqui",
    "params": [
    	"param1",
    	"param2"
    ],
    "language": "es_MX"
}

• type: DO NOT MODIFY. Must always be "flow".
• name_template: Name of the flow template previously created in Meta Business. This field must match the name of an existing template.
• Params (variables): This is where you configure the parameters or variables that your template includes. They must be separated by commas.
• language: This value must match the template language approved in Meta (e.g. "es_MX").

6. The “Continue chatbot” checkbutton must be unchecked.
7. Save Changes: Once you've configured the JSON with the appropriate parameters, click the "Save" button in the component configuration window.

Example cases

In wolkvox Studio, Flow Templates allow for structured and automated interactions with users via WhatsApp. Below are several examples of how to configure these templates for different scenarios, including the presence or absence of parameters and the use of media headers.

Case 1: Template without parameters and language "Spanish" without multimedia header:

{
	"type": "flow",
	"name_template": "template",
	"language": "es"
}

Case 2: Template with one parameter and language "English" without media header:

{
	"type": "flow",
	"name_template": "template",
	"params": [
		"first parameter"
	],
	"language": "en"
}

Case 3: Template with two parameters and language "English (US)" without media header:

{
	"type": "flow",
	"name_template": "template",
	"params": [
		"first parameter",
		"second parameter"
	],
	"language": "en_US"
}

Case 4: Template with image-type multimedia header:

{
	"type": "flow",
	"name_template": "template",
	"header_media_type": "image",
	"header_media_link": "https://images.unsplash.com/photo-1472491235688-bdc81a63246e",
	"language": "en"
}

Case 5: Template with multimedia video header:

{
	"type": "flow",
	"name_template": "template",
	"header_media_type": "video",
	"header_media_link": "https://test-videos.co.uk/vids/jellyfish/mp4/h264/360/Jellyfish_360_10s_MB.mp4",
	"language": "en"
}

Case 6: Template with multimedia document header:

{
	"type": "flow",
	"name_template": "template",
	"header_media_type": "document",
	"header_document_name": "document.pdf",
	"header_media_link": "https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf",
	"language": "en_US"
}