はてなブログ

【はてなブログ】Twitterのタイムラインをサイドバーに埋め込んでみた

f:id:langnerdmom:20210324155900j:plain:w300

こんにちは!

ブログをしている方って、日記的なつぶやきをTwitterに書いている方が多いですよね?

私も、日々のブログに書くほどでもない日常をTwitterで書いてみることにしました❤️

ぜんぜん使い方が分からないんですが

今回は、そのTwitterのタイムラインをブログに載せる方法を調べてみました😍❤️

ブログって何でも出来るんですね〜。楽しい🌼

Twitterのタイムラインをブログのサイドバーに埋め込む方法

とーっても簡単にブログのサイドバーにTwitterのタイムラインを表示できます!
f:id:langnerdmom:20210324155227j:plain:w250

参考記事Twitterの各パーツをブログやウェブサイトに埋め込む方法 | Embedsocial Japan

プロフィールページのアドレスを入力

Twitter Publish」を開く

f:id:langnerdmom:20210324151800j:plain:w250

自分のTwitterページのアドレスを入力。

https://twitter.com/twitterのidtwitterのidを変えるだけでOKです。

Embed Timelineを選択→オプションで表示を調整

Embed Timelineを選択。

f:id:langnerdmom:20210324152756j:plain:w250

下へスクロール。

set customization optionsをクリックして、表示サイズなどを変更します。

f:id:langnerdmom:20210324152902j:plain:w250

このブログでは

  • height(高さ): 300px
  • weight(幅): 350px

で設定しました。

ブログの表示に合わせて、後で微調整してみてくださいね。

f:id:langnerdmom:20210324153635j:plain:w250

右下のUpdateをクリックして保存。

表示されているコードをCopy Codeをクリックしてコピーする。

f:id:langnerdmom:20210324153957j:plain:w250

あとは、はてなブログのサイドバーに貼り付けるだけ

「デザイン」→「カスタマイズ」→「サイドバー」→「+モジュールを追加」をクリック

f:id:langnerdmom:20210324154344j:plain:w250

「HTML」を選択して、右側の空白に先ほどコピーしたコードを貼り付け。

f:id:langnerdmom:20210324154746j:plain:w250

タイトルもお好みでつけてくださいね❤️

左下の適用を押すのをお忘れなく

f:id:langnerdmom:20210324155121j:plain:w250

右上の「変更を保存する」を押して完了です。

忙しいワーママに

忙しいワーママでも「はてなブログPro」でなら、簡単なのに本格的なブログが始められる


一緒に始めてみませんか?

まとめ

いかがでしたでしょうか?Twitterのタイムラインを『はてなブログ』サイドバーに埋め込む方法でした。

ブログもTwitterもされている方にとってもオススメ!

私の場合、Twitterのやり方を勉強しないといけないんですけどね