How do I add a tooltip to a button created using the Slack API?

Question

I have created button using slack api.can we add tooltip text which will be displayed on moving mouse to button.I am not getting the option to add tooltip on button api.

I tried slack button api but did not work.I did not find to add tooltip to slack button api.

Answer 1

Slack's BlockKit doesn't provide a way to show a tooltip when hovering over a button. If you're looking to provide additional context for a button, there are a few options I can think of.

1. Create a markdown section with a button accessory

{    
    "blocks": [
        {
            "type": "section",
            "text": {
                "type": "mrkdwn",
                "text": "Button context"
            },
            "accessory": {
                "type": "button",
                "text": {
                    "type": "plain_text",
                    "text": "Press Me",
                    "emoji": true
                },
                "value": "button_value",
                "action_id": "button-action-id"
            }
        },
}

2. Stack a button and a context section

{
    "blocks": [
        {
            "type": "actions",
            "elements": [
                {
                    "type": "button",
                    "text": {
                        "type": "plain_text",
                        "text": "Press Me",
                        "emoji": true
                    },
                    "value": "button_value",
                    "action_id": "button-action-id"
                }
            ]
        },
        {
            "type": "context",
            "elements": [
                {
                    "type": "mrkdwn",
                    "text": "Button context"
                }
            ]
        }
    ]
}

3. Create a button with a confirmation dialogue

{
    "blocks": [
        {
            "type": "actions",
            "elements": [
                {
                    "type": "button",
                    "text": {
                        "type": "plain_text",
                        "text": "Press Me",
                        "emoji": true
                    },
                    "confirm": {
                        "title": {
                            "type": "plain_text",
                            "text": "Are you sure?"
                        },
                        "text": {
                            "type": "mrkdwn",
                            "text": "Button context"
                        },
                        "confirm": {
                            "type": "plain_text",
                            "text": "Yes"
                        },
                        "deny": {
                            "type": "plain_text",
                            "text": "No"
                        }
                    },
                    "value": "button_value",
                    "action_id": "button-action-id"
                }
            ]
        }
    ]
}