> ## Documentation Index
> Fetch the complete documentation index at: https://x-preview-mintlify-bdd2bb9c.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Direct Message button

> Add a Direct Message button to your website so visitors can start a conversation with your X account directly, including setup and customization options.

The Message button is a small button to help your customers easily send a Direct Message to you on X. Allow your customers to contact you to ask questions and get support from right on your website.

A Message button consists of two parts: a link to the direct message composer on X.com, and the X for Websites JavaScript to enhance the link with the recognizable Message button.

## Message creation flow

Clicking the button will link the user to the Direct Message composer, pre-populated with the values you define in the button markup.

## How to add a message button to your website

[publish.x.com](https://publish.x.com) is a simple configuration tool for to create a message button. Just enter your @screenName to get started.

### Manually

1. Create an anchor element with a `twitter-dm-button` class name. Set a `href` attribute value of `https://x.com/messages/compose` to create a link to the X direct message view. The `recipient_id` query parameter is the ID of the @username that should receive the messages.

```html theme={null}
<a href="https://x.com/messages/compose?recipient_id=3805104374"
  class="twitter-dm-button" data-screen-name="@furni">
Message @furni</a>
```

2. Optionally pre-populate message text by customizing the `text` query parameter.

```html theme={null}
<a href="https://x.com/messages/compose?recipient_id=3805104374&text=Hello%20world"
  class="twitter-dm-button" data-screen-name="@furni">
Message @furni</a>
```

3. Asynchronously load the X for Websites JavaScript using our loading snippet. The script will initialize the message button after your page content loads.

### Query parameters

| Parameter      | Description                                                                    |
| -------------- | ------------------------------------------------------------------------------ |
| `recipient_id` | **Required**. The user ID of the X user that will receive the messages.        |
| `text`         | **Optional**. The pre-populated text in the message. Text must be URL encoded. |

### Button customization

#### Size

Add a `data-size` attribute value of `large` to display a larger message button.