とんぼの徒然日記

日々の思った事を気ままに、画像も付けたり、(笑)

Twitter内でつぶやかれた内容をホームページに埋め込む方法


スポンサーリンク

 

f:id:doragonflykun:20180518122204j:plain

ホームページで記事コンテtwitterンツを作成する際、Twitterで発信されたツイートを引用してよりわかりやすく表記するという方法があります。
事実を述べることに加えて、ツイートを埋め込むことでわかりやすく見やすいコンテンツ作成が可能になる場合があります。

 Twitter内でつぶやかれた内容をホームページに埋め込む方法を紹介します。

※利用する際に気をつけるべき著作権についても触れていますので、参考にしてください。

埋め込みツイートとは
Twitterでつぶいやいた内容を、ホームページやブログの記事内に表示できる機能です。
この機能を利用すると、Twitter内で発信された情報をふまえたコンテンツを作成しやすくなります。

埋め込むことができるツイート内容は、以下の3つです。
・ツイートのテキストのみ

・テキストとともにツイート内に含まれる画像も表示する(画像が含まれる場合のみ)

・テキストとともにツイート内に含まれる動画も表示する(動画が含まれる場合のみ)

※動画を表示する際は、ホームページ上には動画のサムネイルが表示されており、再生ボタンをクリックすることでホームページ上で再生させることが可能です。

ツイートを埋め込む方法
ツイートをホームページ上に埋め込む方法は、大きく2つがあります。
どちらも一度覚えてしまえば難しい操作ではありませんので、自身の運営するホームページの仕様に適した方法を選択してください。

・ツイートのURLをペーストする

・ツイートの埋め込みコードを取得してペーストする

ツイートの埋め込みコードを取得してペーストする場合のみ、さまざまなカスタマイズを行えます。
カスタマイズを行う際は、取得したコードに以下でご紹介するコードを追加してペーストしてください。

※各コードは「“ja”」の後に半角スペースを入れた後ろに入力してください。

参考:<blockquote class="twitter-tweet" data-lang=“ja" align=“left"><p lang="ja" dir="ltr”>

左、中央、右よせ
特にカスタマイズをせずにコードをそのままペーストした場合、テキストは左寄せで表示されます。

ホームページの仕様上、左寄せではなく中央または右寄せにしたい場合は、blockquoteタグ内に以下のコードを使用してください。

・左寄せ:align=“left"

・中央寄せ:align=“center"

・右寄せ:align=“right"

色を変更する
ホームページのイメージカラーに合わせたツイートの埋め込みをしたい場合に使用できる方法です。
リンクの色、背景色を変更することが可能です。

・リンクの色:data-link-color=“#000000” カラーコードについては、

紹介されているホームページが多数ありますので使用したい色のコードを「””」内に入力してください。

・背景色:data-theme=“dark” 背景色は

「dark」または「light」のいずれかを選択することができます。 特に設定しない場合は、lightの状態で表示されます。

幅・高さを調節する
あまりに大きなサイズを指定しても反映されませんが、多少であれば幅・高さを指定することがで可能です。

・幅:width="300"

・高さ:height="500"

手順
step1.
まずはTwitterにログインしておきます。
ホームページ上に埋め込みたいツイートを開くと表示されている、「…」マークをクリックしてください。

step2.
4つのメニューが表示されますので、ツイートのURLをペーストする場合はこの中から「ツイートへのリンクをコピー」を選択してください。

ツイートの埋め込みコードを取得してペーストする場合は

「ツイートをサイトに埋め込む」を選択してください。

step3.
・ツイートのURLをペーストする場合、

ツイートへのリンクURLが表示されますので、コピー&ペーストを行ってください。

・ツイートの埋め込みコードを取得してペーストする場合、

埋め込みコードが表示されます。

これで埋め込みは完了です。

 

※自社のアカウントやホームページ運営者本人のアカウントでつぶやかれた内容を埋め込む際はあまり問題になりませんが、商品やサービスを利用しているユーザーなどのツイートを埋め込む際、著作権の問題が発生する場合があります。

Twitter利用規約では、ツイートは世界中の誰しもが閲覧できるものであり、Twitterが提供している方法を使用したツイートの再使用は許可するもの、とされています。