Direct Message button

Message Button

The Message button is a small button to help your customers easily send a Direct Message to you on Twitter. 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 Twitter.com, and the Twitter 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.twitter.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://twitter.com/messages/compose to create a link to the Twitter direct message view. The recipient_id query parameter is the ID of the @username that should receive the messages.

  <a href="https://twitter.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.

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

3. Asynchronously load the Twitter 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 Twitter 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.

Default Size

Large Size

Was this document helpful?

Thank you

Thank you for the feedback. We’re really glad we could help!

Thank you for the feedback. How could we improve this document?

Thank you for the feedback. Your comments will help us improve our documents in the future.