アートアンドサイエンスのFacebookページにWelcomeページを追加したので、その作業手順をポストしてみたいと思います。これは外部サーバーに作成したページをiFrame(インラインフレーム)形式でFacebookに読み込むという、現在最もポピュラーな方法になります。
※Facebookの仕様変更によりこの手順で進められない場合がございますが、何卒ご了承ください。こちらは2011年1月20日現在の操作手順です。
STEP1|準備する
■Facebookアカウントとページ
【例】
http://www.facebook.com/artnscienceinc
■WelcomeページとそのURL
サイズが幅520px高さ800px以内のphpファイルとして作成
↓
サーバーの共有SSL機能を使用してセキュアなディレクトリを作成
↓
そこへ作成したphpファイルをアップロードしURLを取得
【例】
サーバーにアップしたWelcomeページURL:
http://facebook.artandscience.jp/index.php
セキュアなWelcomeページURL:
https://secure550b.sakura.ne.jp/facebook.artandscience.jp/index.php
※ファイルの拡張子(htmlかphpか)、SSLページのURLの形式は使用するレンタルサーバーにより異なります。
■メニュー用リストアイコン
左サイドメニュー横に表示されるリストアイコン作成
サイズ:16×16ピクセル
ファイル形式:png、jpg、gifのどれか
【例】
STEP2|Welcomeページをアプリ化してFacebook内のページとして追加する
■Facebookの開発者ページにアクセスし、アプリを作成
開発者ページ:https://developers.facebook.com/apps
※このページを見るためにはログインが必要です。
↓
右上の「新しいアプリケーションを作成」 をクリック
↓
「App Display Name(アプリの名前=作りたいページのタイトル)」を入力
【例】ようこそ!
規約にチェックし、「続行」をクリック
↓
認証を行う
———-アプリ作成が完了し、アプリの基本設定画面が表示される———-
■アプリアイコン画像を設定
「アイコンを変更」をクリック
↓
STEP1でで作成したリストアイコン用の画像ファイルを選択しアップロード
■「アプリをFacebookに統合する方法」を設定
「Facebook上のアプリ」をクリックし各項目を設定
・「キャンパスURL」:
STEP1で取得したWelcomeページのURLからページのファイル名(index.php)を削除したもの
【例】http://facebook.artandscience.jp/
・「セキュリティで保護されたキャンパスのURL」:
STEP1で取得したWelcomeページのセキュアなURLからページのファイル名(index.php)を削除したもの
【例】https://secure550b.sakura.ne.jp/facebook.artandscience.jp/
↓
「ページタブ」をクリックし各項目を入力
・「ページタブ名」:左サイドメニューに表示される名前
・「Page Tab URL」:STEP1で取得したWelcomeページのURL
【例】http://facebook.artandscience.jp/index.php
・「Secure Page Tab URL」:STEP1で取得したWelcomeページのセキュアなURL
【例】https://secure550b.sakura.ne.jp/facebook.artandscience.jp/index.php
↓
「変更を保存」をクリック
———-設定完了———-
STEP3|WelcomeページへのリンクをFacebookの左サイドメニューに追加
基本設定ページのアプリタイトルのすぐ下にある「App ID」コピー(メモ)し、
下記 URL の●●部分ペーストして出来たURLにアクセス
http://www.facebook.com/add.php?api_key=●●&pages=1
↓
アプリケーションの追加先ページをプルダウンメニューから選択
↓
「(アプリ名)を追加する」 ボタンをクリック
↓
追加完了し自動的にFacebookページに移動するので、追加を確認
下記のように左サイドのメニューの一番最後に「ようこそ!」が追加されている
完成したwelcomeページ例:http://www.facebook.com/artnscienceinc?sk=app_211750818918328
STEP4|Facebook ページへ訪れた人にWelcomeページを最初に表示させる
Facebook ページ内の「基本データを編集」をクリック
↓
左サイドメニュー「権限の管理」をクリック
↓
「デフォルトで表示するタブ」でプルダウンメニューから作成したアプリを選択
↓
「保存」をクリック
↓
ログインしていない人にしか表示されないため、
ログアウトするか別のブラウザでFacebookページを確認する
これで完了です。