人生を楽しくする「まちゅブログ」はここをクリック

Twitterのタイムラインと特定のツイートをブログに埋め込む方法

スポンサーリンク

みんなの声
いろんな人のブログ読んでると、ツイートが貼ってあったりするけど、あれどうやるの?

 

今回はこのような疑問を解決します。

 

>>本記事でわかること
  • Twitterのツイートを貼る方法
  • Twitterのタイムラインを貼る方法

 

まちゅ
どうも、まちゅです!

 

まちゅ
この記事では、特定のツイートや自分のツイートのタイムラインをブログやサイトに埋め込む方法を解説していくよ!

 

ブログにTwitterを活用する事で、記事のバリエーションが幅広くなりますし、何より自分のブログへのモチベーションや楽しさがアップします。

 

ブログもTwitterもやっているという人は、ぜひTwitterの埋め込み機能を使ってみましょう!

 

スポンサーリンク

特定のツイートを埋め込む

特定のツイートを埋め込む

まずは特定のツイートを埋め込む方法を解説します。

 

Twitterを開き、埋め込みたいツイートの画面までいきましょう。

 

まちゅ
今回はこのツイートを試しに埋め込んでみますね!

 

まちゅのツイート

 

このツイートの下矢印の部分をクリックします。

 

まちゅのツイートの矢印

 

クリックすると、ツイートに関する選択肢が表示されるので、

ツイートを埋め込む】をクリック。

 

ツイートの選択欄

 

ツイートを埋め込むをクリックすると、

Twitter Publishのタブが新しく開かれ、

ツイートを埋め込むためのコードがコピー出来るページが表示されます。

 

twitterpublish

 

あとはコードをコピーして、テキストエディタに貼り付けるだけです!

 

まちゅ
実際にやってみましょう!

 

 

出来ましたね!

 

テキストエディタにコピーしたコードを貼り付ける事で、このように特定のツイートを埋め込む事が出来ました!

 

以上が特定のツイートを埋め込む手順でした。

 

タイムラインを埋め込む

タイムラインを埋め込む

次にタイムラインを埋め込んでみましょう。

 

ますはTwitter Publishのページを開きます。

 

twitterpublish空欄

 

このような入力欄が表示されるので、

 

まちゅ
自分のTwitterアカウントのURLを入力しましょう!

 

https://twitter.com/ユーザー名

 

僕の場合、画像のように入力。↓

 

まちゅのtwitterpublish

 

入力が完了したら、矢印をクリックして次へ進みます。

 

そしたら、

  • 埋め込みタイムライン
  • Twitterボタン

から埋め込みたいコンテンツを選べるので、【埋め込みタイムライン】をクリックします。

 

表示オプション

 

埋め込みタイムラインをクリックすると、すぐにコードが生成されますが、どうせならカスタマイズしましょう!

 

カスタマイズオプションを設定

 

【カスタマイズオプションを設定する。】をクリックします。

 

ここで埋め込みタイムラインの設定をカスタマイズしていきます。

 

カスタマイズ設定

 

  • 縦幅と横幅
    →任意ですが、モバイルに合わせた横幅がオススメ。今回は320px。
  • 背景色
    →光と闇があります。背景色が白か黒かの違い。
  • 言語
    →自動でOK。日本語を選んでもOK。

 

カスタマイズが完了したら、更新をクリックして次へ進みましょう。

 

タイムライン埋め込みコード

 

新しいコードが生成されているので、

【コードをコピー】をクリックしましょう。

 

あとは貼りたい場所に、コピーしたコードを貼り付けるだけです!

 

まちゅ
試しにここに貼ってみますね!

 

 

バッチリ貼れてますね!

 

これでタイムラインを埋め込むことが出来ました!

 

多くのブロガーさんは、サイドバーに埋め込みタイムラインを貼り付けてる人が多い印象です。

 

皆さんもタイムラインをどこに埋め込むか探してみるといいですね!

 

まとめ:Twitterのタイムラインと特定のツイートをブログに埋め込む方法

まとめ

お疲れさまでした!

 

Twitterを運用していながらも、ブログに埋め込む方法を知らない人が身近に何人かいたので、記事にしてまとめてみました。

 

これで皆さんのブログ運営が少しでも楽しくなる事を願っています。

 

 

それではこれで!

 

バイチャ(^^)/

 

スポンサーリンク