# Marketo Web PersonalizationでProfiles APIを使用する

Treasure DataのProfiles APIトークンをMarketoのWeb Personalization機能と統合して、すべての顧客データを活用することで、顧客に完全にパーソナライズされた体験を提供できます。

* [前提条件](/ja/products/customer-data-platform/audience-studio/profiles/use-the-profiles-api-with-marketo-web-personalization#h1_1644201065)
* [Profiles APIトークンの作成](/ja/products/customer-data-platform/audience-studio/profiles/use-the-profiles-api-with-marketo-web-personalization#h1__441927612)
* [新しいトークンに名前を付ける](/ja/products/customer-data-platform/audience-studio/profiles/use-the-profiles-api-with-marketo-web-personalization#h2_251609309)
* [トークンの設定](/ja/products/customer-data-platform/audience-studio/profiles/use-the-profiles-api-with-marketo-web-personalization#h2_196158072)
* [トークンへのセグメント追加](/ja/products/customer-data-platform/audience-studio/profiles/use-the-profiles-api-with-marketo-web-personalization#h1__1028383756)
* [TD Profiles APIとMarketoの統合](/ja/products/customer-data-platform/audience-studio/profiles/use-the-profiles-api-with-marketo-web-personalization#h1__182532925)
* [Profiles APIトークンで使用するMarketoの設定](/ja/products/customer-data-platform/audience-studio/profiles/use-the-profiles-api-with-marketo-web-personalization#h2_1294540003)
* [Marketo RTPタグとTreasure Dataタグの追加](/ja/products/customer-data-platform/audience-studio/profiles/use-the-profiles-api-with-marketo-web-personalization#h2_2234673)
* [例](/ja/products/customer-data-platform/audience-studio/profiles/use-the-profiles-api-with-marketo-web-personalization#h1__1406500097)


# 前提条件

* JavaScriptとHTMLの基本知識
* Treasure Dataの基本知識
* Treasure Data JavaScript SDKの基本知識
* Treasure Data Profiles APIの基本知識
* [Marketo Web Personalization](https://docs.marketo.com/display/public/DOCS/Understanding+Web+Personalization)の基本知識
* MarketoのアドオンWeb Personalization機能へのアクセス。


# Profiles APIトークンの作成

## 新しいトークンに名前を付ける

1. TD Consoleを開きます。
2. Audience Studioに移動してセグメントを選択します。
3. フォルダーを選択します。
4. **新規作成**を選択します。
5. **Profile APIトークン**を選択します。


![](/assets/create_profile_api_token.d07368447c21f911e4cd104cea3710cce089327674fbd36df615c051711ff6c9.cf3845cb.png)

1. トークンの名前を入力し、オプションで説明を入力します。次へを選択します。


## トークンの設定

名前と説明は、トークンに名前を付けたときのものが引き継がれます。変更することもできます。

1. **ルックアップキー**を入力します。


ルックアップキーは、ペアレントセグメント内の一意の値を持つカラムです。このキーは正しいプロファイルを識別します。

![Note](/assets/note.767ca0ca6d076817a978148fbb7dd2a68ca7d067ced0ff61bfb3be582d0426d9.cf3845cb.png)

**注:** ルックアップキーの更新は、トークンワークフローが完了すると有効になります。

`td_global_id`をルックアップキーとして使用する場合、Profiles APIはAPIリクエストのクエリパラメータではなく、ブラウザのCookieからルックアップ値を取得します。ブラウザ外でのテストまたは検証の目的(例: Postman)では、異なるカラムを使用してルックアップ値を手動で渡してください。

1. (オプション)最大5つの属性を入力します。


プロファイル属性は、クエリ時にプロファイルトークンから返すことができます。

![](/assets/cptoken_lookupkey.a4fdda5f033ac9bc65803145af0187498c5a29fec6d8dae8ceb8fb94771598ff.cf3845cb.png)

1. 以下のいずれかを選択します:


* **次へ**を選択して続行し、セグメントを追加します。
* **作成**を選択してトークンを設定します。(後でセグメントを追加することもできます。)


![](/assets/config_token.0d19c72c2bfbc57a48198756674abe5a80f6f4782cc23b744568f79f354be71d.cf3845cb.png)

# トークンへのセグメント追加

1. 以下のいずれかを選択します:


* トークンの設定後、次へを選択します。
* Audience Studio > フォルダー > Profiles APIトークンに移動します。


![](/assets/segmentselect.125e8e424498ad8117a756c58875a8ee9d5d7999c778df16ae54e4307c739a18.cf3845cb.png)

1. Profiles APIトークンにセグメントを追加します。
2. **保存**を選択します。
![](/assets/use-the-profiles-api-with-facebook-custom-audience-2024-02-08.6d199d43e89e4355f3218d3b5e63a8105d8656d109565e985d922b15621a62e8.cf3845cb.png)


# TD Profiles APIとMarketoの統合

Profiles APIトークンとMarketoを統合するには、以下のセクションの手順を完了してください:

* TD profile APIで使用するMarketoの設定
* JavaScript DFPとTreasure Dataタグの作成


## Profiles APIトークンで使用するMarketoの設定

1. Marketoを開きます。
2. Marketoアイコンを選択します。
3. Web Personalizationを選択します。


![](/assets/image-20190829-000347.ffb085130c7b0a84ff1dd699dc588a7ade40a267fce6e108df1b463b48fd6409.cf3845cb.png)

1. Segmentsを選択します。


![](/assets/image-20190829-000239.99622038b8e54f1e82d7b1f7b9c32366541eb8e0fc04ebad62633d6022c68a59.cf3845cb.png)

1. Create Newを選択します。


![](/assets/image-20190829-000032.8506b4d8da21bb63f5ec1f0efb32e8ced4217c77463ef9aa3d4e88688c391c94.cf3845cb.png)

1. Treasure Dataで作成したセグメント番号を指定します。


![](/assets/image-20190828-235909.ac60440369551b0d5812bc2ca30b343e77ceca43a3538ffcded425dfefc3c6b7.cf3845cb.png)

1. Saveを選択します。
2. Campaignに移動します。例: Marketoロゴ > Campaign。
3. Create New Web Campaignを選択します。


![](/assets/image-20190828-235832.4e81bb76dc62523e0028099ffa009770454c2198700a0a93bda456574ad588f6.cf3845cb.png)

1. Treasure Dataで作成したセグメント名を選択します。
2. コンテンツを設定します。例: Dialog、In Zone、Widget。


![](/assets/image-20190828-235754.08546d531bf44f2c90d77ea2575fca9128f01bcdaaa87ffb6c20842d602c2b89.cf3845cb.png)

## Marketo RTPタグとTreasure Dataタグの追加

1. MarketのWeb Personalization JavaScriptタグをページに読み込みます。以下の例を参照し、[Marketoドキュメント: Web Personalization](http://developers.marketo.com/javascript-api/web-personalization/)を参照してください。
2. Profiles APIトークンへの呼び出しを追加します。
3. MarketoのRTPタグのUser Context機能を使用して、レスポンスをMarketoに送信します。
4. 以下の例を参照し、[Marketoドキュメント: User Context](http://developers.marketo.com/javascript-api/web-personalization/user-context/)を参照してください。
5. コードをテストします。例:


![](/assets/image-20191209-220910.f90bb9f2d24e925667372b768bd654cdff3f98db46dc45fdbcd9160f0e2364be.cf3845cb.png)

# 例

MarketのWeb Personalization JavaScriptタグをページに読み込むためのコード例:


```javascript
<!-- Marketo RTP tag -->
(function(c,h,a,f,e,i){c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
c[a].p=e;c[a].a=i;var g=h.createElement("script");g.async=true;g.type="text/javascript";
g.src=f;var b=h.getElementsByTagName("script")[0];b.parentNode.insertBefore(g,b)})
(window,document,"rtp","[rtp-js-cdn-url]","[pod-url]","[accountId]");
rtp('setAccount', 'YOUR_MARKETO_ACCOUNT_ID');
```

Profiles APIトークンとMarketo Web Personalizationを統合するためのコード例


```html
<script type="text/javascript">
  <!-- Marketo RTP -->
  (function(c,h,a,f,e,i){c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
  c[a].p=e;c[a].a=i;var g=h.createElement("script");g.async=true;g.type="text/javascript";
  g.src=f;var b=h.getElementsByTagName("script")[0];b.parentNode.insertBefore(g,b)})
  (window,document,"rtp","[rtp-js-cdn-url]","[pod-url]","[accountId]");
  rtp('setAccount', 'YOUR_MARKETO_ACCOUNT_ID');

  <!-- Treasure Data -->
  !function(t,e){if(void 0===e[t]){e[t]=function(){e[t].clients.push(this),this._init=[Array.prototype.slice.call(arguments)]},e[t].clients=[];for(var r=function(t){return function(){return this["_"+t]=this["_"+t]||[],this["_"+t].push(Array.prototype.slice.call(arguments)),this}},s=["addRecord","blockEvents","fetchServerCookie","fetchGlobalID","fetchUserSegments","resetUUID","ready","setSignedMode","setAnonymousMode","set","trackEvent","trackPageview","trackClicks","unblockEvents"],n=0;n<s.length;n++){var c=s[n];e[t].prototype[c]=r(c)}var o=document.createElement("script");o.type="text/javascript",o.async=!0,o.src=("https:"===document.location.protocol?"https:":"http:")+"//cdn.treasuredata.com/sdk/2.14/td.min.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(o,a)}}("Treasure",this);

  // Configure an instance for your database
  var td = new Treasure({
    host: 'in.treasuredata.com',
    writeKey: '[YOUR_WRITE_KEY]',
    database: '[YOUR_DB_NAME]'
  });

  // Enable cross-domain tracking
  td.set('$global', 'td_global_id', 'td_global_id');

  // Get segment number from TD and send it to Marketo's RTP
  var successCallback = function(values) {
    var segIdAll = [];
    for (var i = 0; i < values.length; i++) {
      segIdAll = segIdAll.concat(values[i].values);
    };
    var segId = segIdAll.filter(function (x,i,self) {
      return self.indexOf(x) === i;
    });
    // http://developers.marketo.com/javascript-api/web-personalization/user-context/
    rtp('set', 'customVar1', segId.join(";"));
  };
  var errorCallback = function(err) {
    console.log(err);
  };

  var trackPageviewSuccessCallback = function(){
    td.fetchUserSegments({
      audienceToken: ['YOUR_PROFILES_API_TOKEN_1', 'YOUR_PROFILES_API_TOKEN_2'],
      keys: {
        key_column_1: 'someValue',
        key_column_2: 'someOtherValue',
      }
    }, successCallback, errorCallback)
  };

  td.trackPageview([YOUR_TABLE_NAME], trackPageviewSuccessCallback);
</script>
```