Facebook App ID(アプリID)の取得方法

Facebook関連の機能をWordpressをはじめとしたウェブサイトに実装する時につまづきやすいのが、Facebook App IDの取得。他のSNSのシェアボタンは発行されたコードを貼り付けるだけで表示されるのに、Facebookだけエラーが出てうまくいかない…という経験をした方は多いのではないでしょうか。

この記事では、Facebook App IDを取得するために必要な手順をまとめました。ネットの知識が少ない方でもスムーズにできるように書きましたので、「どうやったらいいかさっぱりわからないよ!」という方は、ぜひこちらの記事を参考にしてみてください。

Facebook App ID(アプリID)とは?

FacebookのApp ID(アプリID)は、OGPの設定やFacebook用のアプリを作成する時に必須のIDです。これを発行することでウェブサイトだけでなくiOS、Androidアプリと連携するアプリも作成できるようになる万能選手です。

今回はOGPの設定のために使用します。以下の手順で取得しましょう。

Facebook App ID(アプリID)の取得方法

まずFacebook Developerページを開きましょう。もちろんFacebookにログインした状態でアクセスしてください。

Facebook Developer

右上の「My Apps」にマウスカーソルを乗せるとメニューが出てくるので「Add a New App」をクリック。

Add a New App

ポップアップが出てくるので「ウェブサイト」をクリック。

「ウェブサイト」をクリック

すでにApp IDを発行したことがある人だとQuick Start for Websiteの所に今まで作ったApp IDが出てきますが、今回はそれは無視して「Skip and Create App ID」をクリック。

Skip and Create App ID

ID作成画面が出てくるので、表示名とネームスペース、カテゴリを決めましょう。特に思いつかなかったら「表示名」にはサイト名、「ネームスペース」には「サイト名+ogp」とでも入れておけばわかりやすいんじゃないかと思います。

全て入力が終わったら右下の「アプリIDを作成」をクリック。「これは別のアプリのテストバージョンですか?」は「いいえ」のままで大丈夫です。

ネームスペース、カテゴリ

クリックすると簡単なテストみたいなものが出てきますがそこは割愛。テストを通過するとこんな画面が出てきます。App IDというフォームに記載されている数値がFacebook App IDです。

ID発行

あとは数字をコピペしておしまい…といきたいところですが、実はこの時点では世の中に公開されている状態ではないのでIDは使えません。使ってもエラーが出てしまいます。

公開状態にするために、まずは左サイドバーの「Settings」をクリックし、下図の赤枠部分にメールアドレスを入力してください。入力が終わったら右下の「Save Changes」をクリック。

Settings

次に「App Review」ページを開き、赤枠の部分をクリック。

App Review

「アプリを公開しますか?」という質問が出てくるので「確認」ボタンを押しましょう。

ogp_part09

これで作成したApp IDが公開状態になり、誰でも使える状態になりました。

ogp_part10

あとはSuzakuの初期設定メニューにある「Facebook OGP app_id」の項目に発行されたIDをコピペすれば終了です。