Facebookの投稿をサイトに埋め込む方法（埋め込み投稿）

つい先月末（7月2013年）から一般ユーザーにも公開された『Embedded Posts』（埋め込み投稿）が、8月も半ばを過ぎ、私もようやく使えるようになりました。（8月前半は使えませんでした）

そこで今回は、フェイスブックの投稿をWebサイトに''埋め込む''方法をご紹介します。

フェイスブック内で『公開』されている投稿を、自分のサイトに直接埋め込むことができる機能です。

各投稿右上の『▼』タブをクリックして表示される『埋め込み投稿』を選択、続いて表示されるコードをコピーして、あとは自分のサイトに貼り付けるだけで、簡単にフェイスブックの投稿をブログやホームページに表示させることができます。

投稿の持つ『いいね！』の数やシェア、コメントなどもそのまま表示させることができます。
また、ユーザーは『埋め込み投稿』に対して『いいね！』やコメントなどのアクションをそのまま行うことができます。

◆ポイント１．
自分の投稿だけではなく、友達、一般ユーザーの投稿であろうとも、『公開』されているものは埋め込むことができる。（ノートの投稿であっても、公開投稿されていれば利用可能）

◆ポイント２．
写真や動画にも対応しているということ。フェイスブック上では写真や動画を投稿するが、その機能をそのままサイトに持ち込むことができ、サイト上で動画を再生することができる。

◆ポイント３．
サイトに埋め込まれた投稿を見たユーザーが、埋め込み投稿に付いた『▼』タブからコードを取得し、さらに別の場所で埋め込むことができる。

◆ポイント４．
投稿を埋め込んだ後に、フェイスブック上で共有範囲が『公開』から変更されると、サイト上でも利用できなくなる。

埋め込みしたい投稿の右上にある『▼』タブをクリック。一覧の中にある『埋め込み投稿』をクリックします。

















次に表示されるコードをコピーします。

あとはご自分のサイトに、先ほどコピーしたコードを貼り付けると投稿が表示されます。
解説ではBloggerブログを利用しました。（レイアウト→ウィジェット→HTML/JavaScriptウィジェットに貼り付けで表示されました）

なお、サイトに埋め込み後に、フェイスブック上の投稿の共有範囲を『公開』以外にすると、下の画像のような表示があり、埋め込み投稿は表示されなくなります。
特に、他ユーザーの投稿を利用する場合、公開範囲が変更されたり、投稿が削除される場合もありますのでご注意を。

『埋め込み投稿』がまだ利用できない、という方もいるかもしれません。
その場合は、Facebook developersにあるソーシャルプラグインのページから、コードを作成することができます。

①まずは埋め込みをしたい投稿のＵＲＬを取得します。
投稿の上部にある『日付』をクリックします。

【補足】
投稿には日付の横に公開範囲が表示されています。
公開範囲が地球のマークなら『公開』設定となっていますので埋め込み利用できます。それ以外ならマークをクリックして変更をしておきましょう。



日付をクリックすると、投稿が個別に表示されると思います。
画面上部のＵＲＬは、この投稿個別のＵＲＬです。これをコピーします。





②次に下記のリンクに移動してコードを取得します。
『Embedded Posts』（埋め込み投稿）

リンク先に移動したら、画面中ほどにある『Get your Embedded Post Code』（埋め込み投稿のコードを取得）とあります。

その下、『URL of story』にある入力枠に、先ほどコピーした投稿のURLを貼り付けします。
（URLを貼り付けた後、画面のどこかをクリックすると埋め込みしたい投稿が表示されます）

最後に左下にある『Get Code』をクリックします。

これでコードが生成されました。
あとはコードをコピーしてサイトに貼り付けてください。

『埋め込み投稿』は、個人アカウントやFacebookページの投稿を、Webサイトに取り込むことができる機能です。

フェイスブックの投稿を、そっくりそのままサイトに移動させてきたような感じです。

特にお薦めしたい投稿、フェイスブック外でも拡散したい情報（例えばキャンペーンのお知らせ）などがある場合、この機能が役に立つと思います。