サイトのトップへ戻る

Twitter 開発者 ドキュメント日本語訳




埋め込み型タイムラインのパラメータリファレンス

data-*属性をフォールバック用のa(アンカー)エレメントに追加したり、オプションオブジェクト内の JavaScript ファクトリ機能に渡したりして、埋め込み型タイムラインをカスタマイズします。



パラメータ

chrome

トークンをスペース区切りで設定し、タイムラインのディスプレイコンポーネントを削除します。

noheader - ヘッダを非表示にします

nofooter - 表示されている場合は、フッタを非表示にします

noborders - 全ての区切り線を削除します:ウィジットエリアを囲む区切り線、各ツイートごとの区切り線、ツイート内

noscrollbar -表示される場合に、スクロールバーを非表示にします。

transparent - 背景色を削除します

サンプル値: transparent noborders

tweet-limit

1 から20 のツイートを持つ拡大タイムラインを表示します。

サンプル値: 5

aria-polite

ウィジットコンポーネントと更新のために、assertive ARIA politeness値を設定します。

サンプル値: assertive

lang

サポートされている Twitter 言語コード。

指定した言語でテキストコンポーネントを読み込ます。 注意: 引用したツイートには適用されません。

サンプル値: es

theme

darkを設定した場合、暗めの背景上に明るめのテキストツイートを表示します。

サンプル値: dark

border-color

ツイート間の区切り線を含む、ウィジットコンポーネントの区切り線の色を16進数カラーの値で設定します。

サンプル値: #a80000

width

180 ピクセルから 520ピクセルの間で、ウィジットの最大横幅を設定します。

サンプル値: 300

height

ウィジットIDに保存されている値を上書きし、表示されるウィジットの高さを設定します。200ピクセルを超える値でなければなりません。

注意: tweet-limit パラメータが設定されている場合、heightパラメータは適用されません。

サンプル値: 400



上書きパラメータ

以下のパラメータは、指定したウィジットIDのデータ元を上書きします。

screen-name

@usernameによって指定されたTwitterユーザーのツイートを表示します。

埋め込み型ユーザータイムラインに適用されます。

サンプル値: TwitterDev

user-id

IDによって指定されたTwitterユーザーのツイートを表示します。

埋め込み型ユーザータイムラインに適用されます。

サンプル値: 2244994945

list-owner-screen-name

@usernameによって指定されたTwitterユーザーのTwitterリストを表示します。list-slug もしくは list-idで取得されたリストと組み合わせて使わなければなりません。

埋め込み型リストタイムラインに適用されます。

サンプル値: TwitterDev

list-owner-id

IDによって指定されたTwitterユーザーのTwitterリストを表示します。list-slug もしくは list-idで取得されたリストと組み合わせて使わなければなりません。

埋め込み型リストタイムラインに適用されます。

サンプル値: 2244994945

list-slug

抽出者によって選ばれた短い識別子を使って Twitter リストを表示します。list-owner-screen-name もしくは list-owner-idで取得されたリストと組み合わせて使わなければなりません。

埋め込み型リストタイムラインに適用されます。

サンプル値: national-parks

list-id

Twitterによって割り当てられたユニーク識別子を使ってTwitter リストを表示します。list-owner-screen-name もしくは list-owner-idで取得されたリストと組み合わせて使わなければなりません。

埋め込み型リストタイムラインに適用されます。

サンプル値: 207763459

custom-timeline-id

コレクション識別子によって指定されたツイートのコレクションを表示します。

埋め込み型コレクションタイムラインに適用されます。

サンプル値: 539487832448843776



HTML 例

<a class="twitter-timeline"
  data-widget-id="600720083413962752"
  href="https://twitter.com/TwitterDev"
  height="400"
  data-chrome="nofooter"
  data-link-color="#820bbb"
  data-border-color="#a80000">
Tweets by @TwitterDev
</a>


JavaScript ファクトリー例

twttr.widgets.createTimeline(
  "600720083413962752",
  document.getElementById("container"),
  {
    height: 400,
    chrome: "nofooter",
    linkColor: "#820bbb",
    borderColor: "#a80000"
  }
);