Slack webhook html table

Solution 1:

I have opened a ticket to Slack support asking if Slack's Incoming Webhook message supports table of any form (HTML or Markdown).

The official answer is that Slack messages do not support tables.

They suggest to generate a table and post it as an image.

They also said that they will add it to their backlog.

Solution 2:

No, I don't believe there's any way to draw a table in a Slack message.

Here are other available options for formatting Slack messages: https://api.slack.com/docs/formatting.

Solution 3:

You can now do simple two column tables in slack using the "fields" layout block.

You can do two column table:

[
   {
        "type": "section",
        "fields": [
            {
                "type": "mrkdwn",
                "text": "*Name*"
            },
            {
                "type": "mrkdwn",
                "text": "*Email*"
            },
            {
                "type": "plain_text",
                "text": "Jeff Henderson",
                "emoji": true
            },
            {
                "type": "mrkdwn",
                "text": "[email protected]"
            },
            {
                "type": "plain_text",
                "text": "Anne Polin",
                "emoji": true
            },
            {
                "type": "mrkdwn",
                "text": "[email protected]"
            }

        ]
    }
]

Giving you:

Or go field style:

[
    {
        "type": "section",
        "fields": [
            {
                "type": "plain_text",
                "text": "Name",
                "emoji": true
            },
            {
                "type": "mrkdwn",
                "text": "*Jeff Henderson*"
            },
            {
                "type": "plain_text",
                "text": "Email",
                "emoji": true
            },
            {
                "type": "mrkdwn",
                "text": "[email protected]"
            },
            {
                "type": "plain_text",
                "text": "Mobile Phone",
                "emoji": true
            },
            {
                "type": "mrkdwn",
                "text": "0451000000"
            },
            {
                "type": "plain_text",
                "text": "Work Phone",
                "emoji": true
            },
            {
                "type": "mrkdwn",
                "text": "94550000"
            }

        ]
    }
]

Will yield:

Solution 4:

Not a html table specifically, but you may use a package like console.table to print your table's data into a string variable. Then use triple backticks to add your table in your slack message's text field. For example:

const cTable = require('console.table');
const table = cTable.getTable([
  {
    name: 'foo',
    age: 10
  }, {
    name: 'bar',
    age: 20
  }
]);

and then as part of your slack message's attachment:

const attachmentList = {
        "title": "YOUR TITLE",
        "text": 'HERE IS YOUR TABLE: : \n ```'+table+'```',
    }

Solution 5:

Unfortunately, it seems tables are a Markdown standard that Slack does not currently support.

A crude workaround would be to use box-drawing characters within a literal block of text (preceded and followed by three backticks/inverted commas, i.e. ```, on separate lines).

I occasionally use tablesgenerator.com to generate them on the fly.

╔══════╤══════╤══════════╗
║ Dog  │ Cat  │ Bird     ║
╠══════╪══════╪══════════╣
║ Woof │ Meow │ Tweet    ║
╟──────┼──────┼──────────╢
║ Fur  │ Fur  │ Feathers ║
╚══════╧══════╧══════════╝

They're certainly not pretty, but unlike the pasted images that Slack apparently recommends, their content can be searched, and, at least for some of my colleagues, work somewhat with assistive technology.