こんにちは、専業アフィリエイターの孔雀です。
この記事では、ブログにツイッターのツイート文、タイムライン、フォローボタンを埋め込む方法について解説していきたいと思います。
この記事は、主に以下のような人をターゲットに書いています。
この記事を読むべき人
- ブログにツイッターのツイート文を埋め込む方法を知りたい人
- ブログにツイッターのタイムラインを埋め込み方法を知りたい人
- ブログにツイッターのフォローボタンを設置する方法を知りたい人
ブログにツイッターを埋め込むことで、ブログに訪問してきた読者を自分のツイッターに誘導させることが可能になります。
ツイッターからブログ記事へ流入させるだけでなく、ブログからもツイッターへ流入させるような仕組みを作っていきましょう。
目次
ブログにツイッターを埋め込む方法
ブログに埋め込み可能なツイッターのコンテンツは、主に以下の3つがあります。
②タイムライン
③フォローボタン
1つずつ埋め込み方法を解説していきます。
ツイート文をブログに埋め込み方法
これは自分が呟いたツイート文だけでなく、他人の呟いたツイート文も埋め込むことが可能です。
まず、埋め込みたいツイート文の右上にある矢印部分をクリックします。
「ツイートを埋め込む」をクリックします。
「set customization options.」のリンク(下の画像の赤枠部分)をクリックします。
①と②のカスタマイズを選択します。
ちなみに、カスタマイズの内容は下記の通りです。
設定が完了したら、「Update」をクリックします。
次に、「Copy Code」をクリックします。
これでブログへ貼り付けるタグがクリックボードにコピーされました。
次に、コピーしたタグをブログへ貼り付ける作業です。
貼り付ける場合は、必ずhtmlが編集できるモードに切り替えてから貼るようにします。
例えば、WordPressなら「テキスト」モード、
はてなブログの場合は「HTML編集」モードといった具合です。
ブログへ正しく貼り付けられれば、以下のように表示されます。
タイムラインをブログに埋め込み方法
次に、特定のアカウントで表示されるタイムラインを埋め込む方法です。
まず、タイムラインを埋め込みたいツイッターアカウントのTOPページアドレスをコピーします。
次に、「https://publish.twitter.com/」をクリックし、コピーしたアドレスを入力して矢印部分をクリックします。
左側の「Embedded Timeline」をクリックします。
「set customization options.」のリンク(下の画像の赤枠部分)をクリックします。
埋め込むタイムラインのサイズ(高さ、横幅)を指定します。
数字の単位は、px(ピクセル)です。
下にプレビューがリアルタイムで表示されるので、それを確認しながら設定するといいと思います。
そして、①と②のカスタマイズを設定します。
ちなみに、カスタマイズの内容は下記の通りです。
設定が完了したら、「Update」をクリックします。
次に、「Copy Code」をクリックします。
これでブログへ貼り付けるタグがクリックボードにコピーされました。
次に、コピーしたタグをブログへ貼り付ける作業です。
貼り付ける場合は、必ずhtmlが編集できるモードに切り替えてから貼るようにします。
例えば、WordPressなら「テキスト」モード、
はてなブログの場合は「HTML編集」モードといった具合です。
ブログへ正しく貼り付けられれば、以下のように表示されます。
フォローボタンをブログに設置する方法(フォロワー数を表示)
次に、自分が管理するツイッターアカウントのフォローボタンを設置する方法です。
これを設置することで、わざわざツイッターのプロフィール画面に飛ばなくてもブログから直接フォローできるようになります。
フォローボタンを設置したいツイッターアカウントのTOPページアドレスをコピーします。
次に、「https://publish.twitter.com/」をクリックし、コピーしたアドレスを入力して矢印部分をクリックします。
右側にある「Twitter Buttons」をクリックします。
左側にある「Follow Button」をクリックします。
「set customization options.」のリンク(下の画像の赤枠部分)をクリックします。
①と②のカスタマイズを指定します。
下にプレビューがリアルタイムで表示されるので、それを確認しながら設定するといいと思います。
カスタマイズの内容は以下の通りです。
②・・・やや大きめのフォローボタンにしたい場合ににチェックを入れます。
設定が完了したら、「Update」をクリックします。
次に、「Copy Code」をクリックします。
これでブログへ貼り付けるタグがコピーされました。
コピーしたコードをブログで表示させたい箇所に挿入すればOKです。
このフォローボタンをクリックするたけで、指定したアカウントへのフォローが完了します。
ツイッターのフォローボタンの横にフォロワー数を表示させる方法
フォローボタンの横にフォロワー数が表示されるバナーも設置できます。
以下のようなバナーですね。
表示例
上でコピーしたコード内にあるタグの一部を書き換えることで表示させることが可能です。
タグの一部を以下のように変更すると、フォロワー数が表示されるバナーが追加されます。
ブログにツイッターを埋め込む時の著作権に関する注意事項
自分がツイートした呟きを自分のブログに埋め込むのは問題ありませんが、他人のツイートした呟きをブログに埋め込む場合には注意が必要です。
ツイッターの利用規約上では、ツイッター上の機能を使って他人のツイートを他人の許可なくブログに埋め込む行為自体は違反行為にはなりません。
ただし、そのツイートの中に著作権を侵害する画像などが使われている場合には、そのツイートをブログに埋め込んだ側も著作権侵害となる可能性が出てくるので注意です。
まとめ:ブログにツイッターを埋め込む方法(1.ツイート2.タイムライン3.フォローボタン)と著作権に関する注意事項
今回は、ブログにツイッターのツイート文、タイムライン、フォローボタンを埋め込む方法について解説してみました。
最近はブログとツイッターを連動させて運用するのが一般化してきたので、やり方をおぼえて取り入れてみてください。
合わせて読んでね