簡単解説!ツイッタータイムラインをワードプレスに埋め込む方法:2018年10月版

ツイッターのタイムラインをワードプレスに埋め込む方法を簡単にわかりやすく説明する。僕はサイドバーに埋め込んだがそれ以外でも埋め込み方法は同じ。

ツイッターそのもののアカウント作成がまだの人はツイッターに行ってまずアカウントを作成しよう。»ツイッターホーム

コード取得用サイトへ行く

ツイッター埋め込み用コードは下のツイッター公式サイトで作成するのでまずそこへ行く。ツイッターにログインしていない状態でも良い。
»Twitter Publish(英語だが問題なし)

スポンサーリンク

タイムライン埋め込みコードを取得する

入力欄に自分のツイッターのURLを入力して右の矢印を押す。

入力例:https://twitter.com/flyingfry

URLを入れるとGridとEmbedded Tweetは選択肢から消えるのでEmbedded Timelineを選択。入力欄にID部分だけ入れた場合はTwittr Buttonsしか選択できない。

簡単解説!ツイッタータイムラインをワードプレスに埋め込む方法:2018年10月版

GridというのはTweet Deckというのを使ってる人向けの写真を並べる埋め込み型らしい。Embedded Tweetは個別ツイートの埋め込みコード取得用。

コード修正ページへ行く

「set customization options」を押してカスタムページに行く。カスタムページでは高さや横幅などが変更できる。

簡単解説!ツイッタータイムラインをワードプレスに埋め込む方法:2018年10月版

コードを修正する

高さに数値を入力(例:500)。横幅はサイドバーの幅に合わせて自動で調整されるので空白のままでOK。

リンクの色を変えると背景が白から夜間モードになるので好みで変える。最後にUpdateを押すとコードが埋め込みコードが表示される。

簡単解説!ツイッタータイムラインをワードプレスに埋め込む方法:2018年10月版

ワードプレスのサイドバーにコードを貼り付け

ワードプレスのメニューから外観→ウィジェット→カスタムHTMLを選んでサイドバーに配置。そこに取得したコードを貼り付ける。保存を押すのを忘れないこと。

簡単解説!ツイッタータイムラインをワードプレスに埋め込む方法:2018年10月版

サイドバーにツイートタイムラインが表示される

サイドバーに無事ツイッターのタイムラインが表示された。
簡単解説!ツイッタータイムラインをワードプレスに埋め込む方法:2018年10月版

スポンサーリンク

LINEで送る
Pocket


あわせて読みたい