Is it possible to change the color of a Google chat webhook?

Eric Norton July 17, 2024

Hi All, we have an automation rule that sends a webhook (web request) to a Google chat space when a ticket is changed to specific status.  The webhook works but I'm looking for a way to change the color of the text used in the "Card Title".  

This is the line within the webhook request.  "Card Title" shows bold within the Google Chat notification.  This works.

"title": "*Card Title*"

I'm looking for a way to make it bold and RED.  Haven't found code that works.  I tried the below but ended up with errors.

"title": <p style="color:#FF0000";>Card Title</p>

Error message received:

{ "error": { "code": 400, "message": "Invalid JSON payload received. Expected a value.\n*Card Title TO\n^", "status": "INVALID_ARGUMENT" } }

Thanks all for the help.

1 answer

0 votes
Jim Knepley - ReleaseTEAM
Atlassian Partner
July 17, 2024

I don't know if you can use CSS styles like that.

The bold emphasis is the result of markdown formatting but you can try something like this:

"title": "<font color=\"#FF0000;\">Card Title</font>"

(ref: https://developers.google.com/workspace/chat/format-messages)

Eric Norton July 17, 2024

Thanks @Jim Knepley - ReleaseTEAM -  Unfortunately that code didn't work.  Got the same error in the automation audit log.

Jim Knepley - ReleaseTEAM
Atlassian Partner
July 17, 2024

If it's looking for JSON, try wrapping the title in { brackets }.

{
"title": "<font color=\"#FF0000;\">Card Title</font>"
}
Eric Norton July 18, 2024

Thanks again Jim but still, no luck.  I've attached a screenshot of the web request.  This is producing an error in the audit log.  Seems the only thing that works is CARD formatting or something simple like: "text": Hello thereSebd web request.png

Jim Knepley - ReleaseTEAM
Atlassian Partner
July 18, 2024

Instead of focusing on JSON, I'm looking at the Google chat API reference.

I think you're right, a basic text message only has a "text" attribute, and such text might only support a subset of Markdown operators.

Card messages look much more flexible, but they're still JSON payloads.

Google has a card builder tool which is pretty slick, but experimenting with it suggests that, unfortunately, you can't do what you want.

This message:

{
"header": {
"title": "<font color=\"#FF0000\">Jira</font>",
"imageUrl": "https://static-00.iconduck.com/assets.00/jira-icon-512x512-z7na7dot.png",
"imageType": "SQUARE"
},
"sections": [
{
"header": "<font color=\"#FF0000\">Issue Opened</font>",
"collapsible": true,
"uncollapsibleWidgetsCount": 1,
"widgets": [
{
"decoratedText": {
"icon": {
"knownIcon": "TICKET"
},
"topLabel": "ISSUE-1234",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
"bottomLabel": "Opened"
}
}
]
}
]
}

Produces this card:

 Screenshot 2024-07-18 084505.png

 

As you can see, I have a <font> tag in the title, but it doesn't work, where it does work in the decoratedText section.

Eric Norton July 18, 2024

Thanks.  If I copy and paste that into the automation "send web request" area for "Custom data" I keep getting "Invalid JSON requests" errors.  Hmmm

 

Screenshot 2024-07-18 at 1.08.37 PM.png

Suggest an answer

Log in or Sign up to answer
DEPLOYMENT TYPE
CLOUD
PRODUCT PLAN
PREMIUM
PERMISSIONS LEVEL
Product Admin
TAGS
AUG Leaders

Atlassian Community Events