CODEWITHSUNDEEP
pythonazure-active-directorybotframeworkmicrosoft-teamsazure-bot-service
Taka
Taka

Reputation: 37

The image embedded in the text of the HeroCard cannot be clicked

I used inside the'text' of the HeroCard to display the image. I can see the image but I can't click on it. I want to use a hero card because I want to use card actions, but is there a way to make the image clickable?

Upvotes: 0

Views: 145

Answers (2)

alphaz18
alphaz18

Reputation: 2766

If you are using the hero card you should be using the images tags.. in the images tag you can attach a cardaction to an image tag. depending on what language you're writing, if you're doing c#, the cardImage has a constructor that has cardaction as the third parameter.

If you are just writing the card JSON, your image tag can look like this:

"images": [
  {
    "url": "https://sec.ch9.ms/ch9/7ff5/e07cfef0-aa3b-40bb-9baa-7c9ef8ff7ff5/buildreactionbotframework_960.jpg",
    "alt": "CardImage alt",
    "tap": {
      "type": "openUrl",
      "title": "WikiPedia Page",
      "value": "https://en.wikipedia.org/wiki/Pig_Latin"
    }
  }

The tap element here does the action.

Upvotes: 0

Gags08
Gags08

Reputation: 252

You can use Adaptive card. You need to install a nuget package AdaptiveCards.
Adaptive cards is great fit for bots. It provides more features than any other cards.

Here is a sample for implementing image action 

 {
      "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
      "type": "AdaptiveCard",
      "version": "1.0",
      "body": [
        {
          "type": "TextBlock",
          "text": "Click the cat!",
          "weight": "bolder"
        },
        {
          "type": "Image",
          "url": "https://adaptivecards.io/content/cats/1.png",
          "selectAction": {
            "type": "Action.OpenUrl",
            "title": "cool link",
            "url": "https://www.youtube.com/watch?v=dQw4w9WgXcQ"
          }
        }
      ]
    }

To explore more on the same visit the official site.
Adaptive card schema

Hope this could help you.

Upvotes: 2

Related Questions