JavaScript API

Guides contents

The easiest way to create a Twitter for Websites widget — a Tweet button, Follow button, embedded Tweet or timeline — is to use our configuration tools at publish.twitter.com then copy and paste the generated HTML code into the template or widget area for your site.

Generate markup for a Tweet or Follow button
Generate markup for an embedded Tweet or timeline
Create an Embedded Search Timeline (note, you should be logged-in to Twitter.com for this link to work)

Embedded Tweets can be copied from the “•••” (More) menu of any Tweet.

For best performance and reliability, include the widgets.js script in your template

Include the Twitter for Websites JavaScript once in your page template for optimal web page performance and to enable tracking of Twitter widget JavaScript events.

If your site is using multiple widgets you can set up Twitter widgets in your pages once, which will make your site faster, and widgets such as embedded Tweets will be more reliable for authors when using content management systems.

  <script>window.twttr = (function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0],
    t = window.twttr || {};
  if (d.getElementById(id)) return t;
  js = d.createElement(s);
  js.id = id;
  js.src = "https://platform.twitter.com/widgets.js";
  fjs.parentNode.insertBefore(js, fjs);

  t._e = [];
  t.ready = function(f) {
    t._e.push(f);
  };

  return t;
}(document, "script", "twitter-wjs"));</script>

The above snippet optimizes loading by:

Assign a HTML element ID of twitter-wjs to easily identify if the JavaScript file already exists on the page. Exit early if the ID already exists.
Asynchronously load the Twitter for Websites JavaScript.
Initialize an asynchronous function queue to hold dependent functions until the script is available.

Include this snippet before any other JavaScript on your page which may depend on the twttr.ready asynchronous function queue.

Ignore script tags from embeds

If you include the Twitter JavaScript loader on every page you do not need to include the <script> element generated by a button configurator, embedded Tweet, or embedded Timeline tool. You can delete the extra <script> HTML from generated markup.

If you use the oEmbed API to include Tweets in your content, you can generate embed codes that don’t include the <script> element by passing omit_script=true in the query string.