Home
Dynamics 365
Dyn365CE
Show/Hide Actionable Adaptive card data based on Outlook rendering

Show/Hide Actionable Adaptive card data based on Outlook rendering

Danish NaglekarDyn365CE4 years ago41 Views

Ever ran into issue where your actionable adaptive card that you created using Adaptive Card Designer works on your domain but when you send emails to users outside of your domain the actionable adaptive cards do not load? The main reason for this is for actionable adaptive cards to work outside of your domain you need to register your adaptive card using the following link. This is to avoid abuse of the adaptive cards and prevent spams.

To read more about how to register your provider for actionable adaptive cards please read the official document.

But even though you have configured everything correctly the adaptive cards might not load properly due to some error in rendering on the client side. And when that happens the email will be blank but you want to make sure that the user is at least getting the message across. So when you draft your email with actionable adaptive card always make sure you have the attribute hideOriginalBody listed as true on the adaptive card JSON. You should have have a regular body tag with all the details you want to show in case adaptive card doesn’t load.

For example, in Power Automate cloud flow when using Send an email action, the body attribute will have the following example:

 <script type="application/adaptivecard+json">
 {
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "type": "AdaptiveCard",
    "version": "1.0",
    "hideOriginalBody": true,
    "body": [
        {
            "type": "Container",
            "id": 52eb-c87b-c815",
            "padding": "Default",
            "items": [
                {
                    "type": "TextBlock",
                    "id": "fe1a-e090-1df5",
                    "text": "Notification",
                    "wrap": true
                }
            ],
            "spacing": "None",
            "style": "emphasis"
        },
        {
            "type": "Container",
            "id": "e511-5f0d-3a44",
            "padding": "Default",
            "spacing": "None",
            "items": [
                {
                    "type": "TextBlock",
                    "id": "5c53-6ec8",
                    "text": "Your content here.",
                    "wrap": true,
                    "size": "Large",
                    "weight": "Bolder"
                },
                {
                    "type": "TextBlock",
                    "id": "92d9-04dd-e77e",
                    "text": "Thanks.",
                    "wrap": true
                },
                {
                    "type": "TextBlock",
                    "id": "ba77-62ed-3f66",
                    "text": "Do not forget to subscribe to the [newsletter](https://www.powerplatformdevelopersweekly.com/).",
                    "wrap": true
                }
            ]
        },
        ...
    ],
    "padding": "None",
    "@type": "AdaptiveCard",
    "@context": "http://schema.org/extensions"
}
  </script>
<h3>Your content here.</h3><br/>
Thanks.<br/>
Do not forget to subscribe to the <a href="https://www.powerplatformdevelopersweekly.com/">newsletter</a>.<br/><br/>
Thank you.<br/>

As you can see from the highlighted code, I have added hideOriginalBody as true; so it makes sure that the non-adaptive body (line 58-61) shows when email fails to render the adaptive card but gets hidden when adaptive card loads correctly.

Doing this ensures that the content will always be displayed by the email client or web app.

Hope this helps.

For more content subscribe to my blogs and follow me on: