skuare.net

JavaScriptライブラリjQueryのサンプルを中心にWebサイト構築に役立つ情報を紹介

Facebookページにiframeを組み込む

そろそろFBMLが廃止になるので、iframeの組み込み方法をメモ。
▼完成品

sponsors

【STEP1】アプリ作成
まずはアプリを作りに行きます
http://www.facebook.com/developers/の右上にある「Set Up New App」をクリック。


アプリ名を入れ、「同意する」にして作成。
Captchaによるセキュリティチェックがはいります。

【STEP2】アプリ登録
作成するとアプリが表示されますので、当該アプリの「設定を編集」をクリックします。
次の画面では「Facebook Integration」をクリックすると以下のようなものが表示されます。
こちらにiframeの情報を入力していきます。

必須事項は下記です。
■Canvas Page:アプリのベースURL
■Canvas URL:ページの読み込み先URL
■Canvas Type:もちろんIFrameを選びましょう
■タブ名:Facebookページの左に表示されるものです。
■Page Tab Type:こちらもiFrameで。
■タブのURL:こちらでIFrameの読み込み先を指定
Canvas URL/タブURLが時サーバー側の読み込み先となります。
例:Canvas URLがhttp://yourdomain.com/、タブのURLがtabの場合
iframeの読み込み用ファイルは、http://yourdomain.com/tab/にアップします。

【STEP3】アプリをFacebookページに表示
最後にFacebookページへの表示を設定します。
マイアプリに戻ります。
ここにある「Application Profile Page」をクリックするとアプリトップに飛びます。
左カラム下にある「マイページへ追加」を選ぶと反映されます。

iframe完成ページ
Facebookページで、いいねしてねー

sponsors

「Facebookページにiframeを組み込む」をシェアする

記事作成:
記事URL:

TOP > > > Facebookページにiframeを組み込む

前の記事:
次の記事:skuare.netのGoogle Analytics数値[2011/2]

JavaScript

read more

Column

read more