SeedProd ドキュメント

SeedProd のドキュメント、リファレンスマテリアル、チュートリアル

Facebook埋め込みブロック

Facebook埋め込みブロックを使用すると、Facebookの投稿、動画、コメントをSeedProdページに直接埋め込むことができます。訪問者をFacebookに誘導する代わりに、公開されているFacebookコンテンツを、視聴者がすでにエンゲージしている場所に表示できます。

製品発表の投稿を強調したい場合でも、動画の証言を紹介したい場合でも、特定の顧客コメントを掲載したい場合でも、このブロックを使用すると、各コンテンツタイプに合わせて調整されたコントロールで柔軟な埋め込みオプションを利用できます。

Facebook埋め込みブロックの例

要件: Facebook埋め込みブロックは、すべての ライセンスプランで利用可能です。このブロックがコンテンツを正しく表示するには、ページ設定またはSeedProd > 設定FacebookアプリIDを設定する必要があります。


Facebook埋め込みブロックをページに追加する

SeedProdページにFacebook埋め込みブロックを追加するには、次の手順に従ってください。

ステップ1:ブロックを追加する

デザイン > ブロックの下で、Facebook埋め込みブロックをページの目的のセクションにドラッグアンドドロップします。

Facebook埋め込みブロックをSeedProdページにドラッグアンドドロップする

ステップ2:コンテンツ設定を構成する

追加したら、Facebook埋め込みブロックをクリックして設定を開きます。コンテンツタブで、表示するFacebookコンテンツとその動作方法を構成します。

Facebook設定:

  • FacebookアプリID:接続されているFacebookアプリを表示します。まだアプリIDが設定されていない場合は、ページ設定で設定するように促されます。接続すると、別のFacebookアプリに切り替えるためのアプリを変更オプションが表示されます。
  • 埋め込みタイプ:埋め込むFacebookコンテンツのタイプ(投稿動画、またはコメント)を選択します。この設定の下のフィールドは、選択したタイプによって異なります。
  • 投稿リンク(埋め込みタイプが投稿に設定されている場合に表示):埋め込みたい公開Facebook投稿の完全なURLを入力します。
  • 動画リンク(埋め込みタイプが動画に設定されている場合に表示):埋め込みたいFacebook動画の完全なURLを入力します。
  • コメントリンク(埋め込みタイプがコメントに設定されている場合に表示):埋め込みたいFacebookコメントの完全なURLを入力します。
  • 投稿全体を含める(埋め込みタイプが投稿または動画に設定されている場合に表示):埋め込みコンテンツ全体を表示するにはオンに切り替え、省略されたバージョンを表示するにはオフに切り替えます。
  • フルスクリーンを許可(埋め込みタイプが動画に設定されている場合に表示):訪問者が埋め込み動画をフルスクリーンに拡大できるようにするにはオンに切り替えます。
  • 自動再生(埋め込みタイプが動画に設定されている場合に表示):ページを読み込んだときに動画を自動再生するにはオンに切り替えます。
  • キャプション(埋め込みタイプが動画に設定されている場合に表示):利用可能な場合は、埋め込み動画にキャプションを表示するにはオンに切り替えます。
  • 親コメント(埋め込みタイプがコメントに設定されている場合に表示):コンテキストを追加するために、埋め込みコメントと一緒に親投稿を含めるにはオンに切り替えます。
  • 配置:埋め込みコンテンツの水平方向の配置を設定します - 左、中央、または右。
Facebook埋め込みブロックのコンテンツ設定

ステップ3:デザインをカスタマイズする

高度な設定タブでは、Facebook埋め込みブロックの間隔と表示を調整できます。

間隔:

  • 余白: Facebook埋め込みブロックの外側の間隔(上、右、下、左)を制御します。
  • パディング: Facebook埋め込みブロックの内側の間隔(上、右、下、左)を調整します。デスクトップ、タブレット、モバイルのデバイスごとの値に対応しています。

属性:

  • CSS ID: SeedProdがカスタムスタイリングまたはJavaScriptターゲティングのために自動生成した、Facebook埋め込みブロックの一意の識別子を表示します。
  • カスタムクラス: テーマまたはカスタムCSSから特定のスタイルを適用するためにカスタムCSSクラスを追加します。
  • カスタム属性: ブロックラッパー要素に任意のHTML属性を追加します。属性名を改行し、attribute-name|valueの形式で入力します。

デバイス表示:

  • デスクトップで非表示: デスクトップ画面でFacebook埋め込みブロックを非表示にします。
  • タブレットで非表示: タブレットデバイスでFacebook埋め込みブロックを非表示にします。
  • モバイルで非表示: モバイルデバイスでFacebook埋め込みブロックを非表示にします。

アニメーション効果:

  • 表示アニメーション: Facebook埋め込みブロックが表示領域にスクロールインしたときに再生されるアニメーション効果(バウンス、フェードイン、ズームイン、ローテートインなど)を選択します。
Facebook埋め込みブロックの詳細設定

ステップ4:変更を保存

Facebook埋め込みブロックの設定と外観のカスタマイズが完了したら、必ず作業を保存してください。


Facebook埋め込みブロックをページに追加しました!このブロックを使用すると、公開されているFacebookコンテンツをSeedProdページに簡単に埋め込むことができ、訪問者をサイト外に誘導することなくエンゲージメントを維持できます。埋め込みコンテンツが期待どおりに読み込まれて表示されるように、FacebookアプリIDが正しく設定されていることを確認してください。

関連記事