Embedded List Timeline

A list timeline displays the latest Tweets ordered from newest to oldest from a curated public list of Twitter accounts. The timeline includes a header displaying the list’s name, description, and curator. Read more about Twitter lists.

HTML markup

A responsive timeline backed by a Twitter list can be added to a webpage through a common HTML template.

A template example:

<a class="twitter-timeline"
  href="https://twitter.com/{screen_name}/lists/{slug}">
Tweets from https://twitter.com/{screen_name}/lists/{slug}
</a>
<a class="twitter-timeline"
  href="https://twitter.com/twitter/lists/official-twitter-accts">
Tweets from https://twitter.com/twitter/lists/official-twitter-accts
</a>

JavaScript factory function

The Twitter for Websites JavaScript library supports dynamic insertion of an embedded list timeline using the twttr.widgets.createTimeline function. Pass a data source definition, target container element, and optional options object to insert an embedded timeline into your page.

HTML data-* parameters are camelCased when passed as an options object property.

twttr.widgets.createTimeline(
  {
    sourceType: "list",
    ownerScreenName: "TwitterDev",
    slug: "national-parks"
  },
  document.getElementById("container")
);