Facebookページのタイムラインを、ホームページのデザインになじむ形で埋め込めるウィジェット

Facebookページの投稿を取り込み、ホームページ上に自動で更新される一区画として表示する、埋め込み型の部品です。表示されるのはページ自身の投稿です。文章、写真、動画が、Facebookから届いた反応・コメント・シェアの数と一緒に取り込まれます。貼り付けたときの状態で止まらず、ページの更新についていきます。登録の前に知っておいてほしい制限が1つあり、対象はFacebookページだけです。CollectSocialsは個人プロフィールとグループには対応していません。ホームページ作成サービスごとの貼り付け手順は、日本語の検証記事にまとめています。

2026年6月の検証で再現できた原因は4つです。1つ目は、設定ツールがそもそもコードを返さないことで、Get Codeのスピナーが回り続けたり、個人プロフィールや権限の制限があるページでは何も起きなかったりします。2つ目は、幅が500pxで固定されていて、それより広い区画を埋められないことです。3つ目は、読み込んだときに幅を1回測ったあとは画面幅の変化に反応しないため、スマホや画面の向きを変えたときに崩れることです。4つ目は、必要なFacebookのSDKが、同意管理ツールやCookieのブロックで止められていることです。ウィジェットはMetaの設定ツールもFacebookのSDKも使わず、幅の上限もなく、区画の幅が変わればそれに合わせて並び直すので、この4つの原因には当たりません。検証の画面は日本語の記事に載せています。

ページプラグインではできません。Metaのドキュメントで幅は最小180px、最大500px、既定340pxと決まっていて、1179pxのページでdata-widthを500にしても、右側におよそ680pxの空白が残りました。コンテナの幅に合わせる設定（data-adapt-container-width）はありますが、合わせられるのは500pxまでで、それも読み込んだときに1回だけです。ウィジェットは置いた区画の幅いっぱいに広がり、画面幅が変わればそれに追従します。

よくある原因は、そのページがMeta Business Suiteのビジネスポートフォリオに入っていることです。その場合、接続の途中でFacebookが求めるビジネスへのアクセスも許可しないと、ページが一覧に出てきません。ページの権限だけでなく、その画面に出てくる項目をすべて許可してください。それでも見つからないときは、ページを選ぶ画面にページの選択を更新するボタンがあります。すでに作ったソースやフィードは削除されません。ただし、ボタンを押すといったん接続の許可が取り消されるので、Facebookの画面で許可を最後まで済ませるまで、その接続のソースは新しい投稿を取り込めません。

フィードとしては埋め込めません。公式のページプラグインが対応しているのはFacebookページだけで、検証でも個人プロフィールのURLを入れると何も起きませんでした。CollectSocialsで接続できるのも、あなたが管理しているFacebookページだけで、個人プロフィールとグループには対応していません。プランを変えても変わりません。ホームページにフィードを出したいなら、Facebookページを使ってください。

プランのスケジュールに合わせて自動で同期されます。無料プランは24時間ごとで、上位のプランほど間隔が短くなり、最上位のプランでは5分ごとです。ページの新しい投稿は、何もしなくても反映されます。埋め込みコードは投稿が変わっても同じままなので、貼り直しも手動の更新も要りません。

40種類のうち7種類のレイアウト、16種類のテーマすべてとテーマビルダー、モデレーション（承認・除外・文章の編集）、1日1回の自動同期が含まれます。Facebookは有料のプラットフォームではなく、X（旧Twitter）以外のすべてのプラットフォームと同じく無料プランで使えます。無料プランで接続できるソースは1つです。無料プランのウィジェットには小さなCollectSocialsのクレジットリンクが入り、有料プランでは外せます。7日間のトライアルでは、すべてのレイアウトとモバイル用の別デザインを含むデザインスタジオの全機能を、クレジットカードなしで使えます。

ウィジェット自体は置きません。deferのスクリプト1つとコンテナ1つだけで、Shadow DOMの中に描画され、2026年6月の測定ではfacebook.comのCookieストアも、ウィジェット自身のCookieも作られませんでした。ただし、訪問者が動画をクリックしてFacebookのプレーヤーで再生する場合は、そのプレーヤーがFacebookのCookieを使うことがあります。一方で、速度スコアのランキングはあえて公開していません。スコアはフィードをページのどこに置くか、何が入っているかで変わるからです。そう判断した理由とテストデータは、8つのInstagramフィードウィジェットを同じページで比べた検証にあります。

CollectSocialsは、Facebookページの投稿の取得にMetaの公式のGraph APIだけを使い、スクレイピングは行っていません。接続はMeta公式のログインと権限の許可画面で行い、パスワードを私たちが見ることも保存することもありません。与えた許可は、あとからFacebookの設定で取り消せます。

HTMLを貼り付けられるブロックがあるビルダーなら、Plain HTMLのコードをそのまま貼り付けられます。スクリプトが取り除かれてしまう場合は、埋め込みの画面でWixかSquarespaceを選んだときに出るiframe形式のコードを使います。iframeを貼り付けられるビルダーなら、フィード自体はiframeの中に表示されます。高さの自動調整はスクリプトが動くときだけ働き、動かない場合は固定の高さの枠の中でスクロールする表示になります。

できます。1つのフィードに10のプラットフォームを組み合わせられるので、Facebookページの最新の投稿の隣に、Instagramの写真、Googleの口コミ、YouTubeの動画を1つのウォールに並べられます。組み合わせるにはソースが2つ以上必要なので、7日間のトライアル（3つまで）か有料プランで使えます。X（旧Twitter）以外のプラットフォームはすべて無料プランで使え、Xだけが有料なのは、XがAPIの利用に料金をかけているからです。Instagram側の設定は、専用のページで説明しています。