📑ブログ

ブログにTwitterのタイムラインを埋め込む簡単3ステップ!

2022年3月4日

 

どうも、金太郎飴マンです!

悩み

こんな風にブログにTwitterのタイムライン埋め込みたい!

どうやんの?

 

簡単です!

いまからお伝えする3ステップで、本当に簡単にできます!

それでは、早速行きましょう!

 

前提条件

  • 使用しているブログサービス:「WordPress」
  • 使用しているテーマ:「AFFINGER6」

TwitterのプロフィールページURLをコピー【ステップ1】

 

ではまず最初に、Twitterを開きます。

プロフィールボタンをクリック

上部のプロフィールURLをコピー

 

Twitterの埋め込みリンク作成【ステップ2】

このサイトからTwitterの埋め込みリンクを作成していきます。

➡https://publish.twitter.com/#

ここにステップ1でコピーしたURLを貼り付けて「➡」ボタンをクリック

下の画面が自動表示されます

左側の「Embedded Timeline」をクリック

下の画面が自動表示されます

「set customization options」をクリック

 

参考

① ブログに表示されるTwitterのタイムラインの「縦幅(高さ)」
➡あとで調整するので入力不要

② ブログに表示されるTwitterのタイムラインの「横幅」
  ➡「サイドバー」に表示させたい場合は「300px」

③ ブログに表示されるTwitterのタイムラインの「表示色」(白(Light)or黒(Dark))
  ➡お好みで選んでください ※どちらか選択すると選択項目画面の下部にサンプル表示されます

④ ブログに表示されるTwitterのタイムラインの「表示言語」
  ➡自動表示されている「Automatic」のままで大丈夫です

各項目をすべて入力したあとは

画面右下の「Update」ボタンをクリック

下の画面が自動表示されます

Twitterの埋め込みリンク作成完了!

「Copy Code」ボタンをクリック

これで作成されたURLがコピーされました!

 

ブログに埋め込む【ステップ3】

WordPressのトップページを開きます

「外観」➡「ウィジェット」

「カスタムHTML」➡「サイドバートップ」➡「ウィジェット追加」

【ステップ2】でコピーしたURLを貼り付けて「保存」

あとは「外観」で自分のサイトを確認してみてください!

これで終わりです!

 

注意ポイント

ブログに表示されるTwitterのタイムラインの「縦幅(高さ)」

【ステップ2】での初期設定時には数値を入力していないので、

貼り付けしたURL内の「data-height="●●●●"」にある数字(●●●●部分)を変えて調整してください。

(ブログのタイムラインのサイズ感を確認しながら調整してください。)

幅を調整する場合には「 data-width="●●●●"」です。

【完成形です!】

 

以上でTwitterのタイムラインを埋め込む簡単な方法をお伝えしました。

今日はこの辺で失礼します。

ありがとうございました!

金太郎飴マン

30代前半で地方銀行→IT企業に転職成功

「『仕事=我慢』から抜け出して楽しく自分らしく生きる!」をテーマにそのきっかけ・ヒントとなる情報を提供していくブログです。その他にも自分の経験・体験・感じたことなど様々な情報を幅広く提供しています。

現在進行形で自分自身も仕事=我慢から抜け出すべく、様々なチャレンジをしています。

その内容も含め各種発信していますので少しでもどなたかのお役に立てれば嬉しいです。

【※転職しても日々悩みは尽きません。まだまだ幸福度・自己肯定感が低いので今後も様々なことにチャレンジしながら、有益な情報を皆様に提供しつつ自分自身も進化していきたいと思います】
ラジオはこちら
Xはこちら

みんなが読んでる人気記事

1

  これから地方銀行に入りたいと考えている方、地方銀行に勤めている方(特に自分が出世できるか見極めている方)必見です!   地方銀行での出世コース、出世するタイプ、出世する方法など ...

2

最近は猛暑でとにかく暑くて大変ですね。 どうも、金太郎飴マンです。   突然ですが、 皆さんはチームに馴染めていないとき、はまっていないときどのように行動し改善していますか?   ...

3

  「仕事って辛くて我慢するのが当たり前?」 「仕事は楽しいわけない?」 「仕事で良好な人間関係なんて作れるの?どうせ上辺だけでしょ?」 「充実感を持って仕事している人なんているの?」 &n ...

4

  どうも、金太郎飴マンです! 前回は最終面接時のお話しを書きました。   最終面接には合格したものの、 まだ「面接」があるとのこと。   それを終えないと内定にはならな ...

-📑ブログ