特定の日付範囲のFacebook投稿をウェブサイトに表示する方法
クリック・ソーシャル

ClickSocialを使ってWordPressから直接ソーシャルメディア投稿をスケジュールする

無料トライアル開始 アングルライト
ホーム ブログ 特定の日付範囲のFacebook投稿をウェブサイトに表示する方法

特定の日付範囲のFacebook投稿をウェブサイトに表示する方法

facebookの特定の日付範囲の投稿をウェブサイトに表示する方法

特定の日付範囲のFacebook投稿を埋め込む方法をお探しですか?

あなたのサイトにFacebookの投稿を追加することは、あなたのビジネスページを宣伝し、Facebookコミュニティを成長させ、訪問者を魅了する素晴らしい方法です。

そして今日は、Facebookの投稿を日付でフィルタリングしながら埋め込む最も簡単な方法を紹介しよう。

始めよう!

なぜWordPressサイトにFacebookの投稿を埋め込むのか?

あなた自身のFacebookの投稿を埋め込むことによって、あなたのサイトを訪問するすべての人々から新しいいいね、コメント、フォロワーのトンを得ることができます。

さらに、Facebookの投稿を日付範囲でフィルタリングし、Facebookからの特定の投稿のみを表示したり、古いコンテンツを非表示にしたり、古い投稿を削除したりすることもできる。

そうすることで、新鮮なコンテンツをサイトに表示し続けることができ、SEOを高めることができる。

しかし、手動でそれを行うには、FacebookのAPIを扱う必要がある。この方法はコーディングが必要なので、Facebookの投稿をフィルタリングするには多くの時間と労力がかかる。

facebookの投稿を手動で埋め込むコード

この投稿では、HTMLやJavascript、コードスニペットなど一切不要で、選択した日付範囲のFacebook投稿を埋め込む最も簡単な方法をご紹介します。

特定の日付範囲のFacebook投稿を埋め込む方法

以下のステップバイステップのチュートリアルに従うだけで、わずか数分で選択した日付範囲のFacebookの投稿を表示することができます!

ステップ1:Facebook Feed Proプラグインをインストールする

Facebookの投稿を埋め込む最も簡単な方法は、Facebook Feed Proを手に入れることから始めることができます。

カスタムfacebookフィードプロプラグイン

市場で最高のFacebookフィードプラグインとして、あなたはわずか数分でFacebookの投稿のフィードを作成、カスタマイズ、埋め込むために使用することができます - 全くコーディングは必要ありません。

プラグインのDate Rangeエクステンションはこちらから入手できます。

その後、WordPressウェブサイトに両方をインストールし、有効化するだけです。

WordPressのプラグインをインストールする方法については、こちらをご覧ください。

Facebook Feed Proプラグインとその拡張機能をインストールして有効化したら、ステップ2に進むことができます。

ステップ2:日付範囲拡張機能を有効にする

WordPressのダッシュボードからプラグインのDate Rangeエクステンションを有効にして、プラグインの設定を完了します。

まず、ダッシュボードからFacebookフィード " 拡張機能 メニューを開き、日付範囲セクションを探します。

そこでアクティベートボタンをクリックして続行する。

facebookフィードプロで日付範囲拡張を有効にする

ステップ3に進み、このプラグインを使ってFacebook投稿の新しいフィードを作成することができる。

ステップ3:新しいFacebookフィードを作成する

プラグインの3ステップのガイドフローを使えば、あなたのウェブサイトに新しいFacebookフィードを簡単に作成できます。

そのためには、まずダッシュボードエリアからFacebookフィード " すべてのフィードメニューを開き、新規追加をクリックします。

新しいfacebookフィードを作成する

次に、サイトに埋め込むFacebookの投稿のタイプを選択できます。Facebook Feed Proでは、9つのオプションから選ぶことができます:

  • タイムラインFacebookのタイムラインから公開投稿を表示する
  • 写真Facebookの写真をウェブサイトに埋め込む
  • 動画Facebook動画のフィードを表示する
  • アルバムフォトアルバムを選択し、すべての画像を表示
  • イベント Facebookイベントカレンダーをウェブサイトに追加する
  • レビュー好意的なレビューと証言でコンバージョンを高める
  • 単一の特集投稿:特定のFacebook投稿をハイライトする
  • シングルアルバム:選択したFacebookのアルバムのコンテンツを表示する

フィードの種類を選択したら、「次へ」ボタンをクリックして次に進みます。

facebookフィードの種類を選択する

この例では、タイムラインからFacebookの投稿を埋め込みます。

Facebookフィードの作成が完了したら、次のステップに進みましょう。

ステップ4:フィードをFacebookに接続する

フィードをFacebookに接続することで、Facebookの投稿を取得し、WordPressのウェブサイトに表示することができます。

準備はできたか?

まず、ここで新規追加 ボタンをクリックする。

フェイスブック・フィード・プロにソースを追加

このプラグインは、フェイスブックページとフェイスブックグループのどちらを接続するかを尋ねます

お好きなオプションを選んで、下の「Facebookに接続」ボタンをクリックしてください。

フェイスブック・フィード・プロを使ってフェイスブックに接続

そうすると、プラグインがウェブブラウザ上でhttps://www.facebook.com。その後、フィードをFacebookプロフィールに接続することができます。

ここで、ポップアップでページまたはグループを選択し、「次へ」ボタンをクリックします。

フェイスブックのページを選択する

フィードのFacebookへの接続を完了するには、プラグインはあなたのアカウントへの読み取り専用アクセスを要求します。

Facebook Feed Proは、このアクセス権を使ってFacebookのコンテンツを閲覧し、あなたのアカウントに変更を加えることは一切できません。

他のSmash Balloonプラグインと同様、Facebook Feed Proも安全にご利用いただけます

完了 ボタンをクリックして、プラグインにアカウントへの読み取り専用アクセス権を与えます。

facebookフィードプロへの読み取り専用アクセスを許可する

Facebookアカウントとの接続が完了すると、プラグインはWordPressウェブサイトに戻ります。

このページまたはグループをFacebookフィードのソースとして確認するには、「追加」 ボタンをクリックします。

facebookフィードソースの確認

新しいFacebookフィードを作成する際、ウェブサイトを離れることなく、このソースを再利用することができます。

ここで「次へ」 ボタンをクリックして次に進むことができます。

フェイスブック・フィード・プロ

次のステップに進む前に、フィードテンプレートのデザインをインポートすることができます。そうすれば、あなたのFacebookフィードのための素晴らしい外観を即座に準備することができます。

7つのフィードテンプレートから選択できます:

  • デフォルト
  • シンプルな石積み
  • ウィジェット
  • 大型グリッド
  • 最新アルバム
  • ショーケース・カルーセル
  • シンプルなカルーセル

続行するには、フィード・テンプレートを選択し、「次へ」をクリックします。

Facebookフィードを作成し、それをソースに接続した後は、選択した日付範囲を使って投稿のフィルタリングを開始することができます。

ステップ 5: 日付範囲の選択

Facebook Feed Proにはライブフィードエディターが付属しており、Facebookフィードをこれまで以上に簡単にカスタマイズできます。

左側には、フィードレイアウト、カラースキーム、プロフィール画像、ヘッダーデザイン、投稿スタイルなど、オプションを選択・解除するだけで変更できるオプションがあります。

ここからフィード設定にアクセスし、Facebookの投稿をフィルタリングすることもできる。

ライブフィードカスタマイザー facebookフィードプロ

Facebookのフィードに変更を加えると、右側のライブプレビューでFacebookの投稿がどのように表示されるかがわかります。

Facebookの投稿を日付でフィルタリングする準備はできましたか?上部の設定タブをクリックしてください。

次に、左側のフィルターオプションを選択して続行します。

オープンフィルター フェイスブック・フィード・プロ

左側で、「日付範囲内の投稿を表示」と書かれたオプションを見つけるまでスクロールダウンします。

これをオンに切り替えると、以下のオプションを使って日付範囲を入力できます。使用できる日付範囲は2種類あります:

  • 特定: 特定の2つの日付の間の投稿を表示する(例:2022年9月23日以降、2022年12月23日以前の投稿を表示する)
  • 相対:今日から一定日数以内の投稿のみを表示する(例:過去30日間の投稿を表示する)

ご希望のタイプを選択し、下の「送信元」と「送信先」の欄に日付を入力してください。

フェイスブックの日付範囲を選択

この例では、 2021年10月1日から2023年10月1日までのFacebookの投稿を表示している。

最後にSaveボタンをクリックして変更を確定します。

このように、Facebookのフィードには、選択した日付範囲の投稿が表示されます。Facebookのフィードを日付範囲でフィルタリングし終わったら、次のステップに進みましょう。

ステップ6:Facebookの投稿をカスタマイズする

プラグインは自動的にあなたのウェブサイトのデザインをコピーするので、あなたのフィードは箱から出してすぐに美しく見えます。さらに、フィードはすべて完全なレスポンシブ対応なので、モバイルデバイスからの訪問者も取り込むことができます。

ライブフィードカスタマイザーを使って、Facebookフィードのデザインをさらに変更できるようになりました。

まず、上部にある「カスタマイズ」タブをクリックし、メインのカスタマイズオプションを再度開きます。

カスタマイズオプションに戻る

次に、このプラグインを使って、ウェブサイト上のFacebook投稿のレイアウトを設定することができる。

まず、左側のフィードレイアウトオプションをクリックします。

オープンフィードレイアウト フェイスブック・フィード・プロ

Facebookフィードのレイアウトを4種類から選べるようになりました:リスト、グリッド、メイソンリー カルーセルです。

以下、それぞれのレイアウトを見ていこう:

フィードレイアウトオプション Facebookソーシャルメディアフィードウィジェット

Facebookの投稿をもっとはっきり見えるようにしたい?

リストレイアウトを選択し、Facebookのフィードを1列に表示することができます。

facebookフィードのリストレイアウト

選択した日付範囲のFacebookの投稿をたくさん表示したい場合は、メイソンレイアウトを選択することができます。

このレイアウトは、Facebookのフィードを複数のカラムで表示します。

メゾン・レイアウト フェイスブック・フィード・プロ

Facebookからたくさんの写真や動画を埋め込むには、グリッドレイアウトを使うことができます。

そうすれば、魅力的なビジュアルコンテンツをシンプルな行と列で見せることができる。

グリッドレイアウト・フェイスブック

次に、カルーセルレイアウトが あります。これは、あなたの投稿を美しいFacebookのカルーセルで表示します。

その結果、よりインタラクティブなサイトで訪問者を惹きつけることができる。

カルーセル・レイアウト

フィードレイアウトを選択したら、「保存」 ボタンをクリックして変更を確定します。

その後、小さなカスタマイズ ボタンで、もう一度メインのカスタマイズオプションに戻ることができます。

フェイスブックのカスタマイズボタンをクリック

このように、ライブフィードエディタでは、ヘッダーデザイン、投稿スタイル、配色、投稿数などを簡単にカスタマイズすることができます。

Facebookフィードの見た目が気に入ったら、「保存」ボタンをクリックします。

次のステップでは、Facebook Feed Proの助けを借りて、WordPressウェブサイトにFacebookの投稿を埋め込むことができます。

ステップ7:Facebookの投稿をWordPressに埋め込む

Facebook Feed Proには、Facebookのコンテンツを埋め込む2種類の方法があります:

  • WordPressページにFacebookの投稿を埋め込む
  • WordPressのサイドバーやフッターにFacebookの投稿を埋め込む

さっそく、この2つの方法を以下に紹介しよう。

WordPressページにFacebookの投稿を埋め込む

ライブフィードエディタを使用すると、わずか数回の簡単なクリックでFacebookの投稿を埋め込むことができます - 埋め込みコードで悩む必要はありません。

まずは、右上の埋め込み ボタンをクリックしてください。

facebookソーシャルフィードウィジェットの埋め込みボタン

次に、Facebook Feed Proは、あなたのFacebookフィードを埋め込むことができるすべての方法を表示します。手動で埋め込む場合は、ここにショートコードをコピーすることもできます。

続行するには、「ページに追加」ボタンをクリックします。

ページに追加 facebookフィードプロ

次に、フィードを埋め込むWordPressページを選択できます。

そうしたら、下の追加ボタンをクリックしてください。

facebookフィードをwordpressに追加する例

これをクリックするとWordPressのページが開き、Facebookフィードをコンテンツブロックとして埋め込むことができる。

まず、プラスアイコン(+)をクリックしてブロックを追加し、カスタムFacebookフィード ブロックを選択します。

更新を クリックすると、新しいFacebookフィードがオンラインになります。以上の簡単な手順で、特定の日付範囲のFacebook投稿を数分で埋め込むことができます。

今、ウェブサイトを開くと、このスクリーンショットのように、ウェブページ上でフェイスブックの投稿を見つけることができる:

フェイスブック・フィードの例

このプラグインを使ってFacebookのコンテンツをページに埋め込む方法はお分かりいただけたと思います。それでは、Facebookウィジェットを使って投稿を埋め込む方法を見ていきましょう。

Facebookの投稿をWordPressのサイドバーやフッターに埋め込む

Facebook Feed Proは、フッターやサイドバーなどのウィジェット対応エリアに簡単に投稿を埋め込むこともできます。

以前のように、あなたはプラグインのライブフィードエディタから直接これを行うことができます。

ライブフィードエディターがまだ開いていない場合は、ダッシュボードからFacebookフィード " すべてのフィード メニューに移動し、Facebookのフィードをクリックします。

facebookのライブカスタマイザーでフィードを開く

あなたのFacebookフィードがライブフィードエディターで再び開かれます。

エディター上部の埋め込み ボタンをクリックします。

facebookソーシャルフィードウィジェットの埋め込みボタン

このポップアップを使って、FacebookのフィードをWordPressのサイドバーやフッターに埋め込むことができます。

そのためには、ウィジェットに追加 オプションを選択する。

ウィジェットのfacebookフィードに追加する

Facebook Feed Proは、WordPressウィジェットを追加、削除、管理できるように、あなたのサイトのウィジェットページにリダイレクトします。

次に、サイドバーパネルを クリックして、Facebookの投稿をサイドバーに埋め込みます。

サイドバーパネルを開く

また、ここではサイドバーを例として使用する。

Facebookの投稿をサイトのコンテンツの下に埋め込みたい場合は、代わりにフッターパネルをクリックしてください。

フッターパネルを開く

新しいFacebookウィジェットを追加するには、まず下部にあるプラス(+)アイコ ンをクリックします。

そして、オプションからカスタムFacebookフィード・ウィジェットを選択する。

フェイスブック・ソーシャルメディア・フィード・ウィジェット

最後に「更新」をクリックすると、サイトのサイドバーまたはフッターにFacebookウィジェットが表示されます。

ウェブサイトを開くと、指定した日付範囲のFacebookの投稿を見ることができます。

サイドバーにfacebookソーシャルメディアフィードウィジェット

そうだ!

特定の日付範囲のFacebook投稿を埋め込み、新鮮なコンテンツで訪問者を魅了する方法がお分かりいただけただろう。

このように、Facebook Feed Proを使えば、WordPressサイトにFacebookの投稿のフィードを超簡単に作成、カスタマイズ、埋め込むことができます。

Facebookの投稿を簡単に埋め込む準備はできましたか?ここからFacebook Feed Proを入手してください

あなたのサイトにもっと多くの種類のソーシャルメディア統合を追加したいですか?最高のソーシャルメディアフィードプラグインのリストをチェックしてください。

この記事が役に立ったと思われた方は、Facebookや Twitterのフォローをお忘れなく。

著者アバター
サジャン・シャルマ シニアライター
WordPress、ソーシャルメディアマーケティング、オンラインビジネスについて10年以上執筆。専門分野はインフルエンサーマーケティング、コンテンツキュレーション、デジタルマーケティング戦略など多岐にわたる。

コメントを追加する

コメントをお寄せいただきありがとうございます。すべてのコメントはプライバシーポリシーに従って管理され、すべてのリンクはnofollowであることにご留意ください。名前欄にはキーワードを使用しないでください。個人的で有意義な会話をしましょう。