ブログ運営

はてなブログの記事やサイドバーにTwitterのツイートを埋め込む方法!

こんばんは。

nanana-blog管理人のナナナです

ブログを訪問し記事を読んでいただきありがとうございます。

ブログ運営をされている方の多くはTwitterをやられているのではないでしょうか。

色々な方のブログを見ているとブログの記事にTwitterのツイートを表示させているのを見かけます。
本日ははてなブログにTwitterのツイートを表示させる方法を紹介します。

記事内に特定のツイートを埋め込む方法

埋め込みたいツイッターを表示させて、画面右上の「V」のアイコンをクリックします。

f:id:nanana-blog:20190831232935j:plain

メニューが表示されるので、「ツイートを埋め込む」ボタンをクリックします。

f:id:nanana-blog:20190831233040j:plain

Copy Code ボタンをクリックすると埋め込みに必要なコードがコピーされます。

f:id:nanana-blog:20190831233153j:plain

はてなブログのHTML編集画面で埋め込みたいところへ貼り付ければ完了です。

今回は私が2019年8月27日に投稿した記事のツイートを埋め込んでみました。

サイドバーにタイムラインを埋め込む方法

埋め込むコードを取得する方法

Twitter PublishにアクセスしてEnter a Twitter URL と書かれたテキストボックスにTwitterのURLを入力してEnterボタンをクリックします。

f:id:nanana-blog:20190831234347j:plain

Embedded Timeline をクリックします。

f:id:nanana-blog:20190831234404j:plain

Copy Code をクリックすると埋め込みに必要なコードがコピーされます。

f:id:nanana-blog:20190831234421j:plain

 取得したコードをはてなブログに設置する方法

はてなブログのダッシュボードからデザインをクリックします。

f:id:nanana-blog:20190831235542j:plain

カスタマイズ(スパナマーク) ⇒ サイドバー ⇒ モジュールを追加 の順でクリックします。

f:id:nanana-blog:20190831235728j:plain

左のメニューからHTML を選択し、タイトルに「Twitter」と入力して下にコピーしたコードを貼り付けます。

貼り付け終わったら適用ボタン をクリックします。

f:id:nanana-blog:20190901000009j:plain

以上でサイドバーにTwitterのタイムライン埋め込みが完了です。

f:id:nanana-blog:20190901000254j:plain

最後に

いかがだったでしょうか。

本日ははてなブログにTwitterのツイートとタイムラインを埋め込む方法を紹介しました。

私はブログ記事を投稿した時にTwitterにツイートするだけなので、ツイートを埋め込むことはあまりなさそうですが、頻繁にツイートされている方は試してみてください。

www.nanana-blog.com

www.nanana-blog.com

www.nanana-blog.com

www.nanana-blog.com

www.nanana-blog.com