Facebookページがうまく表示されない場合

上記の方法でFacebookページがうまく表示できない場合は、Facebookページの「公開範囲」の設定を確認してみてください。Facebookページの設定から「一般」を確認すると、公開範囲の設定が可能です。

ここで

  • 公開範囲：「このページは公開されています」
  • 国別制限：「誰でも見ることができます」
  • 年齢制限：「誰でも見ることができます」

上記の設定になっていない場合は、変更してください。Facebookページは誰にでも公開できる状態になっていないとWebサイトに埋め込みができないと覚えておきましょう。

WebサイトにFacebook投稿・ページを埋め込む際の注意点

Facebook投稿やページを埋め込む際の注意点として、以下の2つが挙げられます。

  • 横幅制限
  • 個人情報の漏洩

Facebookの埋め込み機能はWebサイトへアクセスしたユーザーをFacebookに誘導することもできますし、Facebook上で投稿したコンテンツをコピペできるので非常に便利です。しかし、いくつか注意点があるので注意する必要があります。

横幅制限に注意する

まず1つ目は横幅制限に注意するということです。

Facebookの埋め込みサイズが横幅が180px~500pxという制限があります。制限内であればサイズをカスタマイズできますが、それ以上のサイズには対応不可。

「横幅を800pxに設定して、コンテンツの視認性をあげよう」とデザインをカスタマイズしても、うまく表示されないのであれば意味がありません。そのため、Facebookの埋め込みには横幅制限があることを理解しておきましょう。

個人情報の表示に注意する

2つ目は個人情報の表示に注意することです。Facebookページにいいね！がつけられている場合、いいね！を押したユーザーのアイコンが表示されてしまいます。

ページを埋め込む側は気にすることがなかったとしても、アイコンが表示される本人は「見られたくない」と感じるかもしれません。

またトラブルにも発展しかねないので、いいね！ユーザーを表示しない設定が必要です。

その方法は、Facebookのアカウント画面で「アプリ」をクリックします。すると、「アプリ、ウェブビュー、プラグイン」という文言の後に「編集」というボタンリンクがあるので、そちらをクリック。

「Tum Platform Off」と表示されるので、スクロールして「Disable Platform」をクリックすれば、Facebookページでいいね！を非表示ににすることができます。

Facebookの埋め込みを活用してコンテンツを充実させよう

この記事では、Facebookの埋め込みについてご説明しました。Facebookの投稿とページについては、埋め込みの仕方が変わりますので、混合しないように注意してください。

また、Facebookページの埋め込みについて、「IFrame」でコードを発行しても、Webサイトで表示できないというエラーが発生することがあります。その場合は、「Javascript SDK」で対応しましょう。

基本はWordPressを利用している方がほとんどでしょう。もちろん、独自CMSでも対応可能です。Facebookのページは専門的な知識も必要なく、やり方さえ分かっていればものの数分でWebサイトに埋め込むことができますので、ぜひ試してみてください。