ネット関係

Facebookページを簡単にブログに埋め込む方法とは

 

facebook

Facebookページを作ったら、早速ブログに表示させたいですよね。ブログにFacebookページを表示させるのって何だか難しそう・・・と思っているかもしれませんが、驚くほど簡単に設置できます。

今回はFacebookページをブログのサイドバーに表示させる方法をご紹介します。

Facebook開発者ページでAppID登録

新規登録の方法

Facebookページをブログに埋め込むには、ページプラグインという無料のツールを使えば簡単に表示することができます。

このページプラグインを使うには、Facebook開発者ページへ行ってAppIDの登録が必要になります。

個人のFacebookアカウントにログインした状態で、Facebook開発者ページへ移動します。「今すぐ登録する」をクリックします。

Facebookページ ブログ

Facebook開発者として登録画面で、「はい」を選択して「次へ」をクリックします。

Facebookページ ブログ

「電話番号」を入力して「SMSで受け取る」をクリック、電話のメールに来た認証番号を「認証コード」に入力して「登録する」をクリックします。

Facebookページ ブログ

パスワードを求められたので、もう一度入力します。

Facebookページ ブログ

「アプリIDを作成」をクリックします。

Facebookページ ブログ

 

「表示名」はブログ名がわかりやすいです。メールアドレスはFacebookで登録したものが表示されていますので、カテゴリを選んで「IDアプリを作成してください」をクリックします。

Facebookページ ブログ

 

セキュリティチェックを入力して「送信」をクリックして登録完了!

Facebookページ ブログ

このようにアプリIDが追加されましたので、「すでに他のサイトを登録している場合」の部分は飛ばしてFacebookページのコードを取得に移ります。

Facebookページ ブログ

すでに他のサイトを登録している場合

すでに他のブログやサイトをFacebook開発者ページに登録している場合は、新たなブログ用のIDを取得します。「新しいアプリを追加」をクリックします。

Facebookページ ブログ

「表示名」はブログ名がわかりやすいです。メールアドレスはFacebookで登録したものが表示されていますので、カテゴリを選んで「IDアプリを作成してください」をクリックします。

Facebookページ ブログ

セキュリティチェックを入力して「送信」をクリックして登録完了!

Facebookページ ブログ

このようにアプリが追加されました。

Facebookページ ブログ

 

Facebookページのコードを取得

開発者ページでIDの登録が完了したら、Facebookのこちらのページからコードを取得します。

Facebookページ ブログ

 

FacebookページのURL に貼り付けたいFacebookページのURLを入力します。シンプルに表示させる場合はタブに何も入れません。

そして下の4つの項目を自分のブログで必要なものにチェックを入れます。

Facebookページ ブログ

 

もしタイムラインなども載せたい場合は、タブに「timeline」と入力します。
※複数載せたい場合は、「timeline,events,messages」のようにコンマ区切りにします。

Facebookページ ブログ

 

設定が決まったら「コードを取得」をクリックします。

Facebookページ ブログ

「IFrame」のタブを選択して、コードをコピーします。

Facebookページ ブログ

WordPressに埋め込む方法

管理画面「外観」→「ウィジェット」をクリックします。

Facebookページ ブログ

「テキスト」をサイドバー部分にドラッグ&ドロップします。

Facebookページ ブログ

「タイトル」を入力して先ほどのコピーしたコードを貼り付けて「保存」をクリックします。

Facebookページ ブログ

このような感じで表示されました!

Facebookページ ブログ

以上、Facebookページをブログに埋め込む方法でした!