コレクション広告

コレクション広告フォーマットにはインスタントエクスペリエンスが含まれています。この広告フォーマットは、優れた視覚効果で没入感を高めた方法により、ユーザーが自分のモバイルデバイスで商品とサービスの発見、閲覧、購入をさらに簡単に行えるようにします。フィード内広告ではヒーロー画像またはヒーロー動画の下に3つの商品が大きく取り上げられ、ユーザーが広告でインタラクションを行うとフルスクリーンのインスタントエクスペリエンスが開きます。コレクション広告には、画像ベースの広告と動画ベースの広告の2種類があります。

「キャンバス」という用語が使用されている場合は、すべてインスタントエクスペリエンスを指していると考えてください。「キャンバス」はこのフォーマットの以前の名称です。

コレクションフォーマットの広告は、インスタントエクスペリエンスを構築することによって作成できます。テンプレートから始めるか、または自分でカスタマイズしたレイアウトを選択します。詳しくは、広告ヘルプセンターの「インスタントエクスペリエンスについて」をご覧ください。

JavaScript SDKを使用してコレクション広告ダイアログを作成することにより、コレクションフォーマット用のFacebookの広告作成ユーザーインターフェイスをウェブサイトに組み込むこともできます。

コレクションの使用に関する基本情報については、以下をご覧ください。

ショップで使用するコレクションを作成する場合、またはメタデータを商品セットに追加する場合は、コマースプラットフォームの「商品セットコレクションAPI」をご覧ください。

For API calls, your AD_ACCOUNT_ID should be formatted as act_XXXXXXXXXXXXXXX.

サポートされている目的と配置

コレクション広告は次の目的で使用できます。

  • トラフィック
  • コンバージョン
  • 商品カタログ販売(1つの商品セットを使ったコレクションを使用する場合にサポートされます)
  • 来店数(1つの商品セットを使ったコレクションを使用する場合にサポートされます)
  • ブランドの認知度アップ
  • リーチ

トラフィックとコンバージョンが目的の場合、スライドショー動画を使用することもできます。詳しくは、ビジネスヘルプセンターの「広告の適切な目的を選択する」をご覧ください。

次の配置がサポートされています。

配置について詳しくは、ビジネスヘルプセンターの「配置について」ビジネスヘルプセンターの「マーケティングの目的に対応した広告配置」をご覧ください。

商品セットに基づくコレクション広告

コレクション広告を作成するには、その前に広告クリエイティブとインスタントエクスペリエンスを指定する必要があります。ローテーションで表示するため、写真、または商品タグ付きの商品を表す要素を4つ以上指定してください。カルーセル要素の子要素の写真も有効です。

カタログからコレクション広告を作成します。コレクション広告は、ヒーロー画像または動画の下に3点の製品を表示し、モバイルフィードに表示されます。この機能では、スライドショー動画を使用できます。

広告はフィードに表示され、利用者が広告をタップするとフルスクリーンで展開され、さらに詳しい情報を見ることができます。

商品セットを使用するには、Advantage+ カタログ広告について十分に理解し、商品カタログの設定を済ませている必要があります。詳しくは、Advantage+ カタログ広告Advantage+ カタログ広告の「商品カタログ」をご覧ください。

広告の作成

商品セットからコレクション広告を作成する際は、正確な要素を使用してインスタントエクスペリエンスを明示的に作成する必要もあります。コレクション広告でこのインスタントエクスペリエンスを使用すると、コレクション広告が自動的に生成されます。インスタントエクスペリエンスには以下を含める必要があります。

インスタントエクスペリエンスの画像

画像を使用してインスタントエクスペリエンスを作成します。

curl \
  -F 'canvas_photo={ 
    "photo_id": "PHOTO_ID", 
  }' \
  -F 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/PAGE_ID/canvas_elements

Open In Graph API Explorer

または、動画を使用してインスタントエクスペリエンスを作成します。

curl \
  -F 'canvas_video={ 
    "video_id": "VIDEO_ID", 
  }' \
  -F 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/PAGE_ID/canvas_elements

Open In Graph API Explorer

または、テンプレート動画を使用してインスタントエクスペリエンスを作成します。

curl -X POST \
  -F canvas_template_video={
      "name": "Cover Image or Video",
	"bottom_padding": "0",
	"top_padding": "0",
	"product_set_id": <Product_Set_ID>,
	"template_video_spec": {
	    "customization": {
	        "text_color": "FFFFFF",
	        "text_background_color": "000000",
		  "name_template": "{{product.name}}",
		  "body_template": "{{product.current_price strip_zeros}}"
	    },
	}
  }' \
  -F 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/<PAGE_ID>/canvas_elements

インスタントエクスペリエンスの商品セット

次に、商品カタログにあるproduct_set_idを使用してcanvas_product_setを作成します。コレクション広告を作成するには、show_in_feedtrueに設定する必要があります。

curl \
  -F 'canvas_product_set={ 
    "max_items": 50,
    "product_set_id": "<PRODUCT_SET_ID>",
    "item_headline": "{{product.name}}",
    "item_description": "{{product.current_price}}"
    "image_overlay_spec": {
      "overlay_template": "pill_with_text",
      "text_type": "price",
      "text_font": "dynads_hybrid_bold",
      "position": "top_left",
      "theme_color": "background_e50900_text_ffffff",
      "float_with_margin": true,
    },
    "storefront_setting": {
        "enable_sections": true,
        "customized_section_titles": [
            { "title_id": "popular", "customized_title": "My Populars" },
            { "title_id": "favorites", "customized_title": "My Favorites" }
        ],
        "product_set_layout": {
            "layout_type": "GRID_3COL"
        }
    },
    "retailer_item_ids": [0, 0, 0],
    "show_in_feed": true
  }' \
  https://graph.facebook.com/v21.0/<PAGE_ID>/canvas_elements

注: 上記の例で、item_headlineitem_descriptionimage_overlay_specstorefront_settingretailer_item_idsは、すべて任意フィールドです。これまでは、これらのフィールドを、コレクション広告とその基盤となるインスタントエクスペリエンスアセットを作成するのと同じ呼び出しで指定していました。現在では、この呼び出しで指定します。

image_overlay_specパラメーターですべての必須フィールドを指定します。詳しくは、マーケティングAPI、リファレンスの「広告クリエイティブリンクデータ、画像オーバーレイ仕様」をご覧ください。

storefront_settingパラメーターは、product_set_layoutenable_sectionscustomized_section_titlesフィールドをサポートします。

product_set_layoutフィールド
名前説明

layout_type

文字列

必須。商品セットの表示方法。
値:GRID_2COLGRID_3COLCAROUSELHSCROLL_LIST

customized_section_titlesを使用するには、enable_sectionstrueに設定する必要があります。customized_section_titlesフィールドは、それぞれにパラメーターtitle_idcustomized_titleが指定された、オブジェクトの配列を期待します。

customized_section_titlesフィールド
名前説明

title_id

文字列

必須。
置換するデフォルトのセクションタイトル文字列を表す列挙型文字列。
値:keep_shoppingtake_another_lookyou_may_also_likerelated_productstrendingpopulartop_itemsfavoritesmost_viewedtop_picks_for_yousuggested_for_youfeatured_favoritesjust_for_youexplore_moreshop_by_category

customized_title

文字列

必須。
利用者にセクションタイトルとして表示される代替カスタム文字列。

インスタントエクスペリエンスのフッター

リンクを使用して、インスタントエクスペリエンスのフッターを作成します。

curl \
  -F 'canvas_button={ 
    "rich_text": {
      "plain_text": "See more at www.abc.com."
    },
    "open_url_action": {
      "url": "https://www.abc.com"
    }
  }' \
 -F 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/PAGE_ID/canvas_elements

Open In Graph API Explorer

必要であれば、フッターで使用するボタンも作成できます。

curl \
  -F 'canvas_footer={ 
    "child_elements": [BUTTON_ELEMENT_ID]
  }' \
  -F 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/PAGE_ID/canvas_elements

Open In Graph API Explorer

フッターのテキストは比較的柔軟に指定することができます。これまではSee more....を指定する必要がありましたが、現在はボタンURLを使用してカスタムテキストを指定できます。

インスタントエクスペリエンスを完成させる

curl \
  -F 'body_element_ids=[
    PHOTO/VIDEO_ELEMENT_ID,
    PRODUCT_SET_ELEMENT_ID,
    FOOTER_ELEMENT_ID
  ]' \
  -F 'is_published=true' \
  -F 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/PAGE_ID/canvases

Open In Graph API Explorer

テンプレート動画、商品セット、ボタン、ストア所在地、設定した任意のフッターを使ってインスタントエクスペリエンスを作成するには、source_template_idパラメーターを含める必要があります。

curl \
  -F 'body_element_ids=[
    TEMPLATE_VIDEO_ELEMENT_ID,
    PRODUCT_SET_ELEMENT_ID,
    FOOTER_ELEMENT_ID
  ]' \
  -F 'name="Dynamic Video Instant Experience"' \
  -F 'source_template_id="1932289657009030"' \
  -F 'is_published=true' \
  -F 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/<PAGE_ID>/canvases

Open In Graph API Explorer

ストアフロントテンプレートの場合、source_template_id = 1932289657009030を指定する必要があります。これは、インスタンスエクスペリエンス、テンプレートの使用で定義されています。各テンプレートのレイアウトは固定されていますが、デフォルトのコンテンツを独自のダイナミック動画、商品、テキスト、リンクに置き換えることができます。詳しくは、インスタントエクスペリエンス、テンプレートの使用をご覧ください。

インスタントエクスペリエンスを使用してコレクション広告を作成する

最後に、コレクション広告を作成する必要があります。これにより、利用者はコレクション広告の画像または動画要素をクリックできるようになります。

インスタントエクスペリエンスの最初の要素が写真である場合は、object_typeSHAREに設定します。

curl \
  -F 'name=Collection Sample Image Creative' \
  -F 'object_story_spec={ 
    "link_data": { 
      "link": "https://fb.com/canvas_doc/CANVAS_ID", 
      "message": "AD_MESSAGE",
      "name": "AD_HEADLINE", 
    }, 
    "page_id": "PAGE_ID" 
  }' \
  -F 'object_type=SHARE' \
  -F 'access_token=ACCESS_TOKEN' \
  https://graph.facebook.com/v21.0/AD_ACCOUNT_ID/adcreatives

Open In Graph API Explorer

インスタントエクスペリエンスの最初の要素が動画である場合は、次のリクエストを実行します。

curl \
  -F 'name=Collection Sample Video Creative' \
  -F 'object_story_spec={ 
    "video_data": {
      "call_to_action": {
        "type":"LEARN_MORE",
        "value":{
          "link":"https://fb.com/canvas_doc/CANVAS_ID",
        }
      },
      "image_url": "THUMBNAIL_IMAGE_URL",
      "message": "AD_MESSAGE",
      "title": "AD_HEADLINE", 
    }, 
    "page_id": "PAGE_ID" 
  }' \
  -F 'object_type=VIDEO' \
  -F 'access_token=ACCESS_TOKEN' \
  https://graph.facebook.com/v21.0/AD_ACCOUNT_ID/adcreatives

インスタントエクスペリエンスの最初の要素がテンプレート動画である場合は、次のリクエストを実行します。

curl -X POST \
  -F 'name="Dynamic Video Collection Ad"' \
  -F 'adset_id=<ADSET_ID>' \
  -F 'status=PAUSED \
  -F 'creative={
       "object_story_spec": {
         "instagram_actor_id": "<INSTAGRAM_PAGE_ID>",
         "page_id": "<MAIN_PAGE_ID>",
         "template_data":{
           "call_to_action":{
             "type":"LEARN_MORE"
           },
           "format_option":"collection_video",
           "link":"https://fb.com/canvas_doc/CANVAS_ID",   
           "name":"Test Dynamic Ads with dynamic video",
           "retailer_item_ids":[
             "0",
             "0",
             "0",
             "0"
           ]
         }
       },
       "object_type": "SHARE",
     }' \
  -F 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/act_<AD_ACCOUNT_ID>/ads

広告プレビュー

広告プレビュー機能がある場合は、ad_formatとユーザーアクセストークンを指定して、広告や広告クリエイティブに基づいたプレビューを生成することができます。

curl -X GET \
  -d 'ad_format="MOBILE_FEED_STANDARD"' \
  -d 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/<CREATIVE_ID>/previews

Open In Graph API Explorer

注: テンプレート動画のインスタントエクスペリエンスの場合、フォーマットとしてBIZ_DISCO_FEED_MOBILEGROUPS_MOBILEMOBILE_FEED_STANDARDSUGGESTED_VIDEO_DESKTOPSUGGESTED_VIDEO_MOBILEWATCH_FEED_MOBILEがサポートされています。

詳しくは、広告プレビューをご覧ください。

標準コレクション広告

テンプレートを使うと、特定のビジネスゴールに適したインスタントエクスペリエンスを簡単に作成できます。各テンプレートのレイアウトは固定されていますが、デフォルトのコンテンツを独自の画像、動画、商品、テキスト、リンクに置き換えることができます。詳しくは、インスタントエクスペリエンス、テンプレートの使用をご覧ください。

インスタントエクスペリエンスを使用したコレクション広告には、指定するアセットに応じて、画像ベースの広告と動画ベースの広告の2種類があります。広告クリエイティブの準備ができたら、広告を作成できます。

画像ベースの広告を作成する

curl 
  -F 'name=Instant Experiences Collection Sample Image Creative' 
  -F 'object_story_spec={ 
    "link_data": {
      "link": "https://fb.com/canvas_doc/ELIGIBLE_CANVAS_ID", 
      "message": "Ad message", 
      "name": "name", 
      "picture": "IMAGE_URL", 
      "collection_thumbnails": [
        {"element_crops": {"100x100": [[0, 0], [100, 100]]},"element_id": "PHOTO_ELEMENT_WITH_PRODUCT_TAGS_ID",},
        {"element_child_index": 0,"element_id": "",},
        {"element_child_index": 1,"element_id": "PRODUCT_LIST_ELEMENT_ID",},
      ],
    }, 
    "page_id": "PAGE_ID" 
  }' 
  -F 'access_token=ACCESS_TOKEN' 
  https://graph.facebook.com/v21.0/AD_ACCOUNT_ID/adcreatives

動画ベースの広告を作成する

curl 
  -F 'name=Instant Experiences Collection Sample Video Creative' 
  -F 'object_story_spec={ 
    "page_id": "PAGE_ID", 
    "video_data": { 
      "call_to_action": {"type":"LEARN_MORE","value":{"link":"https://fb.com/canvas_doc/ELIGIBLE_CANVAS_ID"}}, 
      "image_url": "IMAGE_URL",
      "collection_thumbnails": [
        {"element_crops": {"100x100": [[0, 0], [100, 100]]},"element_id": "PHOTO_ELEMENT_NO_PRODUCT_TAGS_ID",},
        {"element_child_index": 0,"element_id": "PHOTO_ELEMENT_WITH_PRODUCT_TAGS_ID",},
        {"element_child_index": 1,"element_id": "PRODUCT_LIST_ELEMENT_ID",},
      ],
      "title": "My title", 
      "video_id": "VIDEO_ID" 
    } 
  }' 
  -F 'access_token=ACCESS_TOKEN' 
  https://graph.facebook.com/v21.0/AD_ACCOUNT_ID/adcreatives

パラメーター

名前説明

link

文字列

必須
閲覧者をインスタントエクスペリエンスにリダイレクトします。

collection_thumbnails

配列

必須
サムネイルの配列。4つのサムネイルが必要です。

collection_thumbnailsフィールド

名前説明

element_id

数値文字列

必須
キャンバス写真のエレメントIDまたは商品リストのエレメントID。キャンバス写真は、このコレクション広告に添付されたインスタントエクスペリエンスに関連付ける必要があります。利用者が広告をクリックすると、このIDに関連付けられた画像がインスタントエクスペリエンスに表示されます。ヒーロー画像要素IDは無効です。

element_child_index

整数

商品タグと商品リスト要素を含む写真要素では必須
商品タグ付きの写真要素IDの配列からの商品インデックス。または、商品リスト要素を含むproduct_id_listの配列からの商品インデックス。
注: 正の整数を指定する必要があります。

element_crops
AdsImageCrops

写真要素では必須
指定された画像のトリミングサイズを定義したJSONオブジェクト。100x100のトリミングキーのみを指定できます。

エンゲージメントオーディエンスを作成する

コレクション広告でインタラクションを行った利用者のオーディエンスを自動作成できます。これは、標準インスタントエクスペリエンスのエンゲージメントオーディエンスに似ています。詳しくは、「インスタントエクスペリエンス」のエンゲージメントオーディエンスをご覧ください。

コレクション広告をタップした利用者を、フルスクリーン表示されるインスタントエクスペリエンス広告のターゲットに設定できます。このタイプのオーディエンスをフルスクリーンエクスペリエンスエンゲージメントオーディエンスと呼びます。カスタムオーディエンスを作成してこのオーディエンスを構築した後、object_idCANVAS_IDに設定して、いずれかのイベントをトラッキングするルールを作成します。

インスタントエクスペリエンスを開いたオーディエンスを作成する

curl \
    -F 'name=Collection Engagement Audience' 
    -F 'description=People who opened this Instant Experience' 
    -F 'rule=[{"object_id":"CANVAS_ID","event_name":"instant_shopping_document_open"}]' 
    -F 'access_token=ACCESS_TOKEN' 
https://graph.facebook.com/v21.0/AD_ACCOUNT_ID/customaudiences

Open In Graph API Explorer

コレクション広告をクリックしたオーディエンスを作成する

curl \
    -F 'name=Collection Engagement Audience' 
    -F 'description=People who clicked any links in this Instant Experience' 
    -F 'rule=[{"object_id":"CANVAS_ID","event_name":"instant_shopping_element_click"}]'
    -F 'access_token=ACCESS_TOKEN' 
https://graph.facebook.com/v21.0/AD_ACCOUNT_ID/customaudiences
    
Open In Graph API Explorer

コレクション広告ダイアログ

コレクション広告は、テンプレートを使用したインスタントエクスペリエンスをベースにしています。したがって、ダイアログを使用してコレクション広告を作成するには、追加パラメーターを含むインスタントエクスペリエンスダイアログを使用します。そうすれば、Facebookコレクション広告作成UIフローがウェブサイトに組み込まれます。UIコンポーネントについて詳しくは、「ダイアログ」をご覧ください。

JavaScript用Facebook SDKの設定については、以下をご覧ください。

JavaScript SDKによるインスタントエクスペリエンスの作成は、ログインしているユーザーのアクセス許可に依存します。提供されたページやビジネスのインスタントエクスペリエンスを作成するために必要なアクセス許可がユーザーにない場合、ダイアログにエラーが表示されます。また、ユーザーは商品カタログと商品セットへのアクセス権を持っている必要があります。エラーを確実に回避するには、ユーザーがビジネスマネージャにアクセスできることと、ページの広告を作成するアクセス許可を持っていることが必要です。

以上により、コレクション広告ダイアログをトリガーできます。

FB.ui({         
  display: 'popup',
  method: 'instant_experiences_builder',
  account_id: 'AD_ACCOUNT_ID'.
  business_id: 'BUSINESS_ID',
  page_id: 'PAGE_ID',
  template_id: 'TEMPLATE_ID'
}, function(response) {
  // callback
});

プラグインには次の設定を指定できます。

名前 説明

display

必須
値がpopupに設定された必須パラメーター。

method

必須
値がinstant_experiences_builderに設定された必須パラメーター。

account_id

必須
自分の広告アカウントID。

business_id

必須
自分のビジネスID。

page_id

必須
インスタントエクスペリエンスに関連付けるページID。

template_id

必須
使用するテンプレートのID。

product_catalog_id

任意
コレクションで使用される商品カタログのID。product_set_idが指定されている場合は必須です。

product_set_id

任意
コレクションで使用される商品セットのID。

すべての有効なテンプレートタイプとそれに対応するIDは、「インスタントエクスペリエンス」のテンプレートの使用で確認できます。

product_catalog_idパラメーターとproduct_set_idパラメーターは任意です。ただし、product_set_idを指定した場合は、product_catalog_idを指定する必要があります。これらのIDを指定した場合、ユーザーはUIでコレクションを変更できなくなります。どちらのパラメーターも指定しなかった場合、ユーザーはUIでカタログと商品セットを選択できます。コレクション広告をプレビューするには、インスタントエクスペリエンスプレビューダイアログを使用することをおすすめします。

成功すると、プラグインから次の応答が返されます。


{
  "success": true,
  "id": "CANVAS_ID"
}

返されるidは、未公開のインスタントエクスペリエンスです。これを広告キャンペーンで使用するには、公開する必要があります。

応答がないかundefinedの応答が返される場合は、ユーザーがインスタントエクスペリエンスを終了する前にダイアログを閉じたか、ユーザーがインスタントエクスペリエンスを保存したが終了しなかったことを意味します。グラフAPIをクエリすると、ページに属するすべてのインスタントエクスペリエンスを確認できます。これにより、終了されなかったインスタントエクスペリエンスがあるかどうかを調べることができます。

目的地カタログを追加する

コレクション広告のヒーロー画像に、目的地カタログからの広告クリエイティブを表示できます。その目的地のホテル画像のカルーセルを表示することもできます。これを行うには、カルーセル内のホテルに対応する目的地をFacebookが見つけられなかった場合にヒーロー画像の場所に表示するフォールバック画像を指定する必要があります。詳しくは、「目的地カタログ」をご覧ください。

以下の制限にご注意ください。

  • 動画クリエイティブはサポートされていません。
  • 目的地とホテルのカタログ画像の組み合わせの表示のみがサポートされます。
  • 他のカタログの組み合わせはサポートされていません。

この機能を使用するには、canvas_photoエレメントの作成時にdestination_set_idパラメーターを追加してから、別の標準的な手順に従ってインスタントエクスペリエンスとコレクション広告を作成します。

curl \
  -F 'canvas_photo={ 
    "photo_id": "PHOTO_ID", 
    "destination_set_id": "DESTINATION_SET_ID",
  }' \
  -F 'access_token=<ACCESS_TOKEN>' \
  https://graph.facebook.com/v21.0/PAGE_ID/canvas_elements

Open In Graph API Explorer