2012年7月12日木曜日

アメブロに個別のツイートを埋め込む方法

アメブロで書けよという感もあるのですが個人ではアメブロ使っていないので。


Twitterでは、個々のツイートをwebページなどに埋め込むことができます。

Twitterの貼りつけたいツイートで「開く」をクリックし、

詳細をクリックしたのちに、

「このツイートをサイトに埋め込む」をクリックすると、

上のように、埋め込み用のコードが表示されるので、これを貼り付けることで、以下のようにツイートを埋め込むことができます。


しかし、アメブロの記事本文にこれを貼りつけて投稿すると下のようなエラーメッセージが出ます。
これは、アメブロが記事本文で、学部からのjavascriptの呼び出しを禁止しているためです。
具体的には、ツイート埋め込み用コードの、以下の部分が該当します。
<script src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
ということで、ちょっと困ってしまうのですが、実はアメブロにもjavascriptを記述したり呼び出せる場所があります。それは、「フリープラグイン」です。

ブログ編集画面の左にあるメニューから、「サイドバー」をクリックします。

そのなかの「プラグインの追加」を選ぶと、以下のような画面になるので、

「フリープラグイン」タグを選択します。

ここに先ほどのコード
<script src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

を貼り付けます。あとは、保存して、次の画面の指示に従って、「フリープラグイン」をサイドバーに配置します。
こののち、記事本文に、ツイート埋め込み用コードから、先程のjavascriptを呼び出すコードを除いた部分(<blockquote class="twitter-tweet" lang="ja">と</blockquote>で囲まれた部分)を貼りつけると、アメブロでもこちらのように綺麗にツイートを埋め込むことができます。


1 件のコメント:

  1. 通りすがりですが埋め込み方を調べていてこちらすごく分かりやすかったです、ありがとうございます。

    返信削除