Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Teams doesn't display hero image

I've been trying to send cards to Teams channels through a connector. The cards do appear but any hero image I try to send isn't displayed. The Message Card Playground displays the image correctly but it simply doesn't show up in Teams. I have no issues with the "normal" images.

Here is the JSON that I'm sending through the webhook, but I've also tried the Twitter - Hero image sample card and it doesn't work either :

{
  "@type": "MessageCard",
  "@context": "http://schema.org/extensions",
  "summary": "Hero card testing",
  "title": null,
  "text": null,
  "themeColor": "19b5fe",
  "sections": [
    {
      "title": null,
      "activityImage": "https://pbs.twimg.com/profile_images/862653089916096512/ljJwcmFp_bigger.jpg",
      "activityTitle": "Hero image card",
      "activitySubtitle": "This is a test",
      "facts": [],
      "text": null,
      "heroImage": {
        "image": "https://pbs.twimg.com/media/DFv74A0XkAEdwQ_.jpg"
      },
      "images": []
    }
  ]
}

Am I missing something ?

like image 340
James Hyot Avatar asked Jul 27 '17 15:07

James Hyot


People also ask

Why is Teams not displaying images?

If Teams is unable to load images inside channels or chats, then you can try clearing out the program's cache on your computer. For this, force-quit Microsoft Teams from your Task Manager. Under this folder, open each subfolder and delete these files and subfolders inside each one of them: blob_storage.

How do I get my picture to show up in Teams meeting?

How to upload a photo. Open the Teams application and click on the Profile menu (the circle icon) at the top-right corner of the window. This will display your current profile information. Hover your cursor over circle where your profile picture will be displayed and click the camera icon which appears.


1 Answers

I hit the same problem. It looks like as a sort of workaround you can use the inline image markdown syntax in a non-section's text.

{
    "@type": "MessageCard",
    "@context": "http://schema.org/extensions",
    "summary": "Summary",
    "title": "Title",
    "text": "![Alt text for the image](https://pbs.twimg.com/media/C8NK1XGUIAA-CJK.jpg)",
    "themeColor": "E81123"
}

I describe it as a workaround though because the image is not scaled in any way when displayed. As you can see from this example a large image is left very large and overflowing the container.

like image 112
David Risney Avatar answered Jan 03 '23 00:01

David Risney