Forum Discussion

Re: Adaptive cards aren't rendering on Teams sent from Webhook

NateW345, we tried with below JSON format and the card is rendered correctly. Could you please try this out?

{  
  "type": "message",
  "attachments": [
    {
      "contentType": "application/vnd.microsoft.card.adaptive",
      "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
      "version": "1.3",
      "content": {
         "type": "AdaptiveCard",
    "body": [
        {
            "type": "TextBlock",
            "size": "default",
            "weight": "default",
            "color": "default",
            "text": "Datto"
        },
        {
            "type": "TextBlock",
            "text": "New Datto RMM alert",
            "wrap": true
        },
        {
            "type": "TextBlock",
            "text": "New alert on [device_hostname] [device_description] | [site_name]",
            "wrap": true,
            "size": "Medium",
            "weight": "Bolder"
        },
        {
            "type": "TextBlock",
            "text": "IP address: [device_ip] | Last user: [lastuser]",
            "wrap": true,
            "color": "Dark"
        },
        {
            "type": "FactSet",
            "facts": [
                {
                    "title": "Category:",
                    "value": "[alert_category]"
                },
                {
                    "title": "Description:",
                    "value": "[alert_message]"
                }
            ]
        }
    ],
    "actions": [
        {
            "type": "Action.OpenUrl",
            "title": "New UI View Device",
            "url": "https://[platform]rmm.centrastage.net/device/[device_id]/[device_hostname]"
        },
        {
            "type": "Action.OpenUrl",
            "title": "Old UI View Device",
            "url": "https://zinfandel.centrastage.net/csm/device/summary/[device_id]"
        },
        {
            "type": "Action.OpenUrl",
            "title": "New UI View Alert",
            "url": "https://[platform]rmm.centrastage.net/alert/[alert_uid]"
        },
        {
            "type": "Action.OpenUrl",
            "title": "New UI Web Remote",
            "url": "https://[platform].centrastage.net/csm/remote/rto/[device_id]"
        },
        {
            "type": "Action.OpenUrl",
            "title": "New UI View Site",
            "url": "https://[platform]rmm.centrastage.net/site/[site_id]"
        }
    ]
}
	}
	]
}

 

 

Thanks, 

Prasad Das

------------------------------------------------------------------------------------------ 

If the response is helpful, please click "**Mark as Best Response**" and like it. You can share your feedback via Microsoft Teams Developer Feedback link. Click here to escalate. 

4 Replies

  • NateW345's avatar
    NateW345
    Copper Contributor

    Prasad_Das-MSFT sorry, one last thing. It works great on desktop, but shows up as empty on mobile. See the attached image.

    • Prasad_Das-MSFT's avatar
      Prasad_Das-MSFT
      Icon for Microsoft rankMicrosoft

      NateW345 - Please use this updated JSON which renders in Desktop/web and Mobile devices correctly.

       

      {  
        "type": "message",
        "attachments": [
          {
            "contentType": "application/vnd.microsoft.card.adaptive",
            "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
            "version": "1.3",
            "content": {
      		"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
              "version": "1.3",
               "type": "AdaptiveCard",
          "body": [
              {
                  "type": "TextBlock",
                  "size": "default",
                  "weight": "default",
                  "color": "default",
                  "text": "Datto"
              },
              {
                  "type": "TextBlock",
                  "text": "New Datto RMM alert",
                  "wrap": true
              },
              {
                  "type": "TextBlock",
                  "text": "New alert on [device_hostname] [device_description] | [site_name]",
                  "wrap": true,
                  "size": "Medium",
                  "weight": "Bolder"
              },
              {
                  "type": "TextBlock",
                  "text": "IP address: [device_ip] | Last user: [lastuser]",
                  "wrap": true,
                  "color": "Dark"
              },
              {
                  "type": "FactSet",
                  "facts": [
                      {
                          "title": "Category:",
                          "value": "[alert_category]"
                      },
                      {
                          "title": "Description:",
                          "value": "[alert_message]"
                      }
                  ]
              }
          ],
          "actions": [
              {
                  "type": "Action.OpenUrl",
                  "title": "New UI View Device",
                  "url": "https://[platform]rmm.centrastage.net/device/[device_id]/[device_hostname]"
              },
              {
                  "type": "Action.OpenUrl",
                  "title": "Old UI View Device",
                  "url": "https://zinfandel.centrastage.net/csm/device/summary/[device_id]"
              },
              {
                  "type": "Action.OpenUrl",
                  "title": "New UI View Alert",
                  "url": "https://[platform]rmm.centrastage.net/alert/[alert_uid]"
              },
              {
                  "type": "Action.OpenUrl",
                  "title": "New UI Web Remote",
                  "url": "https://[platform].centrastage.net/csm/remote/rto/[device_id]"
              },
              {
                  "type": "Action.OpenUrl",
                  "title": "New UI View Site",
                  "url": "https://[platform]rmm.centrastage.net/site/[site_id]"
              }
          ]
      }
      	}
      	]
      }

       



      In this updated JSON i moved "$schema" and "version" property within "content", hence it rendered correctly in mobile device as well.

       

      If the response is helpful, please share your feedback via Microsoft Teams Developer Feedback link.

       

       

       

      • NateW345's avatar
        NateW345
        Copper Contributor
        Thank you. This solved our problem.
  • NateW345's avatar
    NateW345
    Copper Contributor
    Thank you! This worked. What did you change to make this work?

Resources