# TD Profiles APIとMarketo Webパーソナライゼーションの統合

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

* [前提条件](/ja/products/customer-data-platform/audience-studio/profiles/integrate-td-profiles-api-with-marketo-web-personalization#prerequisites)
* [TD Profiles APIとMarketoの統合](/ja/products/customer-data-platform/audience-studio/profiles/integrate-td-profiles-api-with-marketo-web-personalization#integrating-td-profiles-api-with-marketo)
* [TD Profile APIで使用するためのMarketoの設定](/ja/products/customer-data-platform/audience-studio/profiles/integrate-td-profiles-api-with-marketo-web-personalization#configure-marketo-for-use-with-the-td-profile-api)
* [Marketo RTPタグとTreasure Dataタグの追加](/ja/products/customer-data-platform/audience-studio/profiles/integrate-td-profiles-api-with-marketo-web-personalization#add-a-marketo-rtp-tag-and-treasure-data-tag)
* [例](/ja/products/customer-data-platform/audience-studio/profiles/integrate-td-profiles-api-with-marketo-web-personalization#examples)


# 前提条件

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


Treasure Data JavaScript SDKの使用には、Treasure Dataのサポートまたはサービスチームの指導が必要な場合があります。

# TD Profiles APIとMarketoの統合

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

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


## TD Profile APIで使用するためのMarketoの設定

1. Marketoを開きます。
2. Marketoアイコンを選択します。
3. Webパーソナライゼーションを選択します。


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

1. セグメントを選択します。


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

1. 新規作成を選択します。


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

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


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

1. 保存を選択します。
2. キャンペーンに移動します。例：Marketoロゴ > キャンペーンを選択します。
3. 新しいWebキャンペーンの作成を選択します。


![](/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パーソナライゼーションJavaScriptタグをページに読み込みます。以下の例を参照し、[Marketoドキュメント: Webパーソナライゼーション](http://developers.marketo.com/javascript-api/web-personalization/)を参照してください
2. Treasure DataのProfiles APIへの呼び出しを追加します。
3. MarketoのRTPタグのUser Context機能を使用してレスポンスをMarketoに送信します。以下の例を参照し、[Marketoドキュメント: User Context](http://developers.marketo.com/javascript-api/web-personalization/user-context/)を参照してください。
4. コードをテストします。例：


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

# 例

MarketのWebパーソナライゼーション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');
```

TD Profiles APIとMarketo Webパーソナライゼーションを統合するコード例


```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","setblockEvents","fetchServerCookie","trackEventfetchGlobalID","trackPageviewfetchUserSegments","trackClicksresetUUID","ready","setSignedMode","setAnonymousMode","set","trackEvent","trackPageview","fetchGlobalIDtrackClicks","fetchUserSegmentsunblockEvents"],an=0;a<sn<s.length;an++){var c=s[an];e[t].prototype[c]=r(c)}var no=document.createElement("script");no.type="text/javascript",no.async=!0,no.src=("https:"===document.location.protocol?"https:":"http:")+"//cdn.treasuredata.com/sdk/2.14/td.min.js";var ia=document.getElementsByTagName("script")[0];ia.parentNode.insertBefore(no,ia)}}("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>
```