Skip to content

How-to: Variables in WhatsApp forms. #86

@akanshaaa19

Description

@akanshaaa19

Summary

Problem Summary

Problem Statement: Users cannot send different images to different users within the same WhatsApp form due to the form's static nature once published.

Expected Outcome: Users expected to parameterize the image URL in the form, allowing different images to be sent based on user-specific data.

Actual Outcome: The image in the form becomes fixed and cannot change after the form is published and HSM approved. The bot confirmed that separate forms must be created for each image variation to achieve this functionality.

Error Messages: No explicit error messages were reported, but the static nature of the form was a limitation shared by the support bot.

Reproduction Steps:

  1. Publish a WhatsApp form with an image embedded in the JSON.
  2. Submit the form to Meta and get it approved.
  3. Attempt to change the image dynamically using a parameterized URL in the published form.

Additional Notes

The user indicated that they had heard about a dynamic content option in forms, but it appears not to be implemented currently. A support member noted they would log an issue for the developers to review for possible future implementation.

Source

Original message

The form JSON is at the end. How do I send different images to different users? I realized after publishing the Form and the HSM accepted, that the image is now static - without a field where I can pass the images.

{
  "version": "7.3",
  "screens": [
    {
      "id": "question",
      "title": "Question:",
      "terminal": true,
      "data": {},
      "layout": {
        "type": "SingleColumnLayout",
        "children": [
          {
            "type": "Form",
            "name": "flow_path",
            "children": [
              {
                "type": "Image",
                "src": "<insert_a_base64_of_a_1080_1920_image_here>",
                "height": 400,
                "scale-type": "contain"
              },
              {
                "data-source": [
                  {
                    "id": "Option_1",
                    "title": "A"
                  },
                  {
                    "id": "Option_2",
                    "title": "B"
                  },
                  {
                    "id": "Option_3",
                    "title": "C"
                  },
                  {
                    "id": "Option_4",
                    "title": "D"
                  },
                  {
                    "id": "Option_5",
                    "title": "Skip"
                  }
                ],
                "label": "choose the correct answer:",
                "name": "choose_the_correct_answer",
                "required": true,
                "type": "RadioButtonsGroup"
              },
              {
                "label": "Continue",
                "on-click-action": {
                  "name": "complete",
                  "payload": {
                    "choose_the_correct_answer": "${form.choose_the_correct_answer}"
                  }
                },
                "type": "Footer"
              }
            ]
          }
        ]
      }
    }
  ]
}
Full thread transcript

usurpesh: The form JSON is at the end. How do I send different images to different users? I realized after publishing the Form and the HSM accepted, that the image is now static - without a field where I can pass the images.

{
  "version": "7.3",
  "screens": [
    {
      "id": "question",
      "title": "Question:",
      "terminal": true,
      "data": {},
      "layout": {
        "type": "SingleColumnLayout",
        "children": [
          {
            "type": "Form",
            "name": "flow_path",
            "children": [
              {
                "type": "Image",
                "src": "<insert_a_base64_of_a_1080_1920_image_here>",
                "height": 400,
                "scale-type": "contain"
              },
              {
                "data-source": [
                  {
                    "id": "Option_1",
                    "title": "A"
                  },
                  {
                    "id": "Option_2",
                    "title": "B"
                  },
                  {
                    "id": "Option_3",
                    "title": "C"
                  },
                  {
                    "id": "Option_4",
                    "title": "D"
                  },
                  {
                    "id": "Option_5",
                    "title": "Skip"
                  }
                ],
                "label": "choose the correct answer:",
                "name": "choose_the_correct_answer",
                "required": true,
                "type": "RadioButtonsGroup"
              },
              {
                "label": "Continue",
                "on-click-action": {
                  "name": "complete",
                  "payload": {
                    "choose_the_correct_answer": "${form.choose_the_correct_answer}"
                  }
                },
                "type": "Footer"
              }
            ]
          }
        ]
      }
    }
  ]
}

Glific AI doc bot (bot): Hi there! You’re right—when you embed an Image in a WhatsApp Form, it becomes part of the form JSON and, once the form is submitted to Meta, it’s fixed (not parameterizable per send) . Forms are delivered by attaching them to an HSM, but this doesn’t make the image dynamic; it just sends the (static) form to the user .

Two workable approaches:

  • If you must show different images inside the form, create separate forms (one per image) and submit each to Meta, then attach the appropriate form to an HSM; note that template approvals are immutable, so changes mean new submissions .
  • Recommended: remove the image from the form and send a personalized image right before the HSM-with-form in your flow using a Send Message node with an image URL (hosted on GCS) or an expression that fetches a per-user URL from a Google Sheet . Also, avoid Google Drive links—use public GCS URLs instead .

Helpful docs:

If you share how you decide which image each user gets (e.g., from a sheet/field), I can suggest the exact expression and flow placement.

Glific AI doc bot (bot): Was this helpful in resolving your query? Or do you need further support?

Glific AI doc bot (bot): Thanks for letting us know! <@&983219484091383888> has been notified and will assist you shortly.

sangeetamishra._91310: <@1038832836414808124> - Allow me sometime let me check this and get back to you by 2nd half.

usurpesh: That works, thank you <@1132952719586492478>

sangeetamishra._91310: <@1038832836414808124> - Cxan you share me the form which you created and if any flow ?

usurpesh: ```json
{
"version": "7.3",
"screens": [
{
"id": "question",
"title": "Question:",
"terminal": true,
"data": {},
"layout": {
"type": "SingleColumnLayout",
"children": [
{
"type": "Form",
"name": "flow_path",
"children": [
{
"type": "Image",
"src": "<insert_a_base64_of_a_1080_1920_image_here>",
"height": 400,
"scale-type": "contain"
},
{
"data-source": [
{
"id": "Option_1",
"title": "A"
},
{
"id": "Option_2",
"title": "B"
},
{
"id": "Option_3",
"title": "C"
},
{
"id": "Option_4",
"title": "D"
},
{
"id": "Option_5",
"title": "Skip"
}
],
"label": "choose the correct answer:",
"name": "choose_the_correct_answer",
"required": true,
"type": "RadioButtonsGroup"
},
{
"label": "Continue",
"on-click-action": {
"name": "complete",
"payload": {
"choose_the_correct_answer": "${form.choose_the_correct_answer}"
}
},
"type": "Footer"
}
]
}
]
}
}
]
}


That above is the form json. I've removed the base64 string since it's way too large. I don't know how else to share the form though.

**usurpesh:** If you access my account, it's called `mcq-responses-1`

**usurpesh:** This is the approved HSM (2c3ba255-f5f4-4cf7-be96-6dde4f1be5fe), and this (3ff00468-9a94-4557-9121-bab9b7d0c652), the flow I'm trying it in. Ideally, if parameterizing the image URL works in a form, then I'd start using it in flows like (215833d7-3fb3-415b-bd90-1307dd334790).

**sangeetamishra._91310:** <@1038832836414808124>  - I checked this internally, and currently in Glific, once the Form is published and the HSM gets approved, all the content becomes static. Because of this, images cannot be passed dynamically through fields after publishing.

There is no option to send different images to different users within the same published Form/HSM setup. To use different images, separate templates/forms would need to be created for each image variation

**usurpesh:** No problem, I understand. Somebody in a Glific session about Forms mentioned there being an option to try dynamic content in forms, and hence the query. Forms seems like a promising concept, but its potential seems to be constrained by the way it has been implemented or exposed.

Thank you for checking. 🙂

**sangeetamishra._91310:** I will log an issue on this immediately so that developers can take a look once their pipeline allows, but we won't be able to fix this in the recent months. FYI

</details>

Metadata

Metadata

Assignees

Labels

Type

No type
No fields configured for issues without a type.

Projects

Status
Done

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions