Fly higher! Sky is the limit!

webの現場で働く人のブログ

好きなツイートを自分で選択してグリッド形式でWebサイト上に表示する方法(Tweet Gridの使い方)

「Tweet Grid」が発表になったのは2015年でかなり今更感あるけどあんまり日本語記事が出てこないので備忘録としてまとめておきやす。

「Tweet Grid」とは?

好きなツイートを自分で選択してグリッド形式でWebサイト上に表示する方法。
カスタマイズ可能で見た目も美しい。

サンプルを見たほうが早いので以下のDemoページで確認ください。
https://codepen.io/takumaro-web/full/LjpWpg/

手順

  1. TweetDeckにログインする。
    https://tweetdeck.twitter.com/
    ツイッターのアカウントとパスワードが必要
  2. 左側のメニューの一番下の「+」を押す。
    f:id:paradox_tm:20170728150543p:plain

  3. 「Choose a column type to add」の中から「Collection」を選択

  4. 「+ Create collection」を押す

  5. 「Name」と「Description」を適当に入力(省略可)

  6. 画面上に新しいカラムが表示されるので表示させたいツイートを検索してドラッグ&ドロップ
    f:id:paradox_tm:20170728151034p:plain このボタン押しながらドラッグ&ドロップ

  7. 上のメニューボタンを押して「Share」→ 「View on twitter.com」を選択
    f:id:paradox_tm:20170728151132j:plain

  8. Twitter画面が立ち上がるので表示されたURLをコピー!!

  9. https://publish.twitter.com/ こちらにアクセスし8でコピーしたURLを貼り付ける。

  10. Copy Codeでコードをコピーし、Webサイト上に貼り付けて完了。
    ※ set customization optionsで変更してもよい。

表示させたいツイートを変えたい場合は、TweetDeck上で編集すればよいから非常に楽だ。
是非、お試しください。