Hashtag Button

A hashtag button is a special type of Tweet button to encourage participation in a conversation grouped by keyword. Read more about hashtags on Twitter.

The hashtag button generator is a simple, form-based approach to generate HTML markup you may copy-and-paste into your website template.

How to add a hashtag button to your website

1. Create a new anchor element with a twitter-hashtag-button class to allow Twitter’s widgets JavaScript to discover the element and enhance the link into a hashtag button. Set a href attribute value of https://twitter.com/intent/tweet to create a link to the Twitter web intent composer.

<a class="twitter-hashtag-button"
  href="https://twitter.com/intent/tweet">
Tweet</a>

2. Add your hashtag of interest as a button_hashtag query parameter value and a component of the anchor element’s inner text.

<a class="twitter-hashtag-button"
  href="https://twitter.com/intent/tweet?button_hashtag=TwitterStories">
Tweet #TwitterStories</a>

3. Asynchronously load Twitter’s widgets JavaScript using our loading snippet. The JavaScript snippet will check for an existing version of Twitter’s widgets JavaScript on the current page, initialize a function queue to be executed once the widgets JavaScript has loaded, and load the widgets JavaScript asynchronously from Twitter’s CDN.

Define secondary hashtags

Include additional hashtags in pre-populated Tweet text using the hashtags web intent query parameter. A hashtag defined in the button_hashtag parameter and displayed in the button will appear before hashtags defined in the hashtags parameter.

<a class="twitter-hashtag-button"
  href="https://twitter.com/intent/tweet?button_hashtag=TwitterStories&hashtags=TBT,FF">
Tweet #TwitterStories</a>

JavaScript factory function

Twitter’s widget JavaScript library supports dynamic insertion of a hashtag button using the twttr.widgets.createHashtagButton function. Pass a hashtag, target container element, and the same options supported by the Tweet button JavaScript factory function.

twttr.widgets.createHashtagButton(
  "TwitterStories",
  document.getElementById("container"),
  {
    size:"large"
  }
);