WebサイトとFacebookを連携させる際などに必要となるFacebookアプリID(app_id)。

以前当記事では、OGPの設定にアプリIDの取得が必須とご案内しておりましたが、現在はアプリID無しでもOGP画像は正常に表示されます(サイト側で設定は必要)。

ただし、WordPressで制作しているサイトであれば、プラグインの利用のために「FacebookアプリID」を求められる場合もあります。また、FacebookはUIの変更の頻度が高く、アプリIDの取得方法に迷う方が多いのも実情です。

というわけで当記事では、2024年10月現在最新版のFacebookアプリID(app_id)の取得方法を詳しく解説いたします。取得方法がわからない方は、ぜひ参考にしていただけますと幸いです。手順通りに操作いただければ、10分あれば取得できます。

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

それでは早速、FacebookアプリID(app_id)の取得する手順を解説していきます。通常のFacebookアカウントが必要ですので先にアカウントを作成しておいてください。
>>Facebook | 新規アカウントを作成

大まかな手順は次の通りです。

  1. Meta for Developersを開く
  2. アプリの作成
  3. アプリを設定してID取得

Meta for Developersを開く

まずは「Meta for Developers」にアクセスします。次の画面が開きますので、画面右上の「マイアプリ」をクリックします(ログアウトしている方は「ログイン」と表示されます)。

metaのログイン画面

Meta for Developers

Facebookの社名変更に合わせて、「Meta for Developers」となっています。

アプリの作成

次の画面では、「アプリを作成」というボタンが表示されます。

metaのアプリ作成箇所

アプリを作成といってもボタンを操作するだけでOKです。これから何かを開発するわけではありません。「アプリを作成」をクリックすると下記画面が表示されます。

アプリを作成の手順1

そのまま「次へ」をクリックし進みます。

ユースケースは「その他」を選択

ユースケース選択画面では、「その他」を選択して、次の画面で「Business」を選択。

Businessを選択

次に表示される画面で、アプリ名とメールアドレス、ビジネスポートフォリオ(デフォルトのまま)を設定します。

「アプリを作成」をクリックして、次の画面が開けば、アプリの作成は完了です。

上記赤枠箇所でアプリIDを確認できますが、「アプリのモード」をライブにしないと使えないので、次の設定に進みます。

アプリを設定してID取得

この設定を飛ばすとアプリIDを正常に取得できないので、必ずご確認ください。

画面左側の「アプリの設定」から「ベーシック」をクリックして、下記箇所を入力します。

アプリのベーシック設定

  1. 表示名には、アプリの表示名と同じものが表示されているはずです。
  2. あなたのサイトのプライバシーポリシーページのアドレスを入力します。
  3. 連絡先のメールアドレスが正しいか確認します。

プライバシーポリシーが未設定だと、正しく保存できませんのでご注意ください。

ここまで確認できたら、ページの最下部までスクロールします。

ページの最下部へスクロール

「プラットフォームを追加」という横長のボタンをクリックしてください。「データ保護責任者の連絡先」の項目は空白で構いません。

Websiteを選択

「Website」を選択して、「次へ」で進みます。

WebサイトのURLを入力する箇所

↑の赤枠箇所にFacebookと連携するWebサイトのURLを入力して、「変更を保存」します。

アプリのモードを「ライブ」に

最後に必ずアプリのモードを「ライブ」にしてください。

上記のようにボタンが青色になれば完了です。後はアプリIDをコピペして必要な箇所に貼り付ければ、そのまま活用できます。

【TCDテーマ向け】FacebookアプリIDの設定箇所について

TCDテーマをお使いの方は、テーマオプション内にある「Facebook OGP」にて、アプリIDの入力欄が設けられています。

TCDテーマのアプリID登録箇所

※一部の古いテーマでは設定箇所が異なることもあります。

上記箇所にアプリIDをコピペして、OGP用画像を設定すれば、OGPの設定は完了です。

ちなみに冒頭で申し上げた通り、アプリIDが未設定でもOGP画像を登録さえすれば、正常に表示されます。

ただし、シェアデバッガーで確認した際に次のようなエラーメッセージが表示されますので、アプリIDが登録されていないことが原因と覚えておきましょう。※このエラーはOGP画像の表示には影響しません。

app_idが存在しない場合のエラーメッセージ

TCDテーマでは、アイキャッチ画像がそのままOGP画像として利用される仕様ですが、アイキャッチ画像が未設定のブログ記事や、その他のページ(トップページ、アーカイブページ、固定ページなど)では、次のように「No Image」と表示されてしまう可能性があります。

OGP画像無し OGP画像有り
OGP画像無し OGP画像有り

このように画像が表示されるとイメージが湧きやすく、サイトやページの内容も伝わりやすくなります。どのページがシェアされてもいいようにOGP画像は登録しておくのがオススメです。

まとめ

FacebookアプリIDの取得方法をご紹介いたしました。

Meta for Developers」へアクセスして「アプリを作成する」となると少し難しそうですが、手順通りに進めれば、問題なくクリアできると思います。

必要な項目が未設定だと正常に保存できないので、その点だけ注意しておけばOKです。FacebookのUIはコロコロ変わりますが、最新版を解説した当記事を参考に設定してみてください(2024年10月現在)。