Facebook「いいね！」のリンク

概要

Facebookとの連携の１つとして、サイト上で「いいね！」されたデータをPiano DMPでトラッキングし、オーディエンスセグメントやターゲティングで利用できます。

手順

「いいね！」ボタンクリックのようなFacebookからトリガーされたイベントを取るにはイベントハンドラの追加が必要です。

イベントハンドラはcX.sendEvent(..)ヘルパー関数を利用して、Piano DMPに DMPパフォーマンスイベントとして送信します。

DMPにFacebookの他のデータ（性別、年齢、リンクURL、友達リストなど）を取り込みたい場合、開発者向けリファレンスを参照してください。

- https://developers.facebook.com/docs/facebook-login/web

サンプルコード（同期型の場合）

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <script type="text/javascript" src="http://cdn.cxense.com/cx.js"></script>
    <script type="text/javascript">
        // 通常のページビューイベントを送信します。
        cX.setSiteId('1234'); // <-- TODO: サイトIDを置き換えてください。
        cX.sendPageViewEvent();
    </script>

    <div>
        <img src="http://i.stack.imgur.com/aWl0G.png">
    </div>

    <div id="fb-root"></div>
    <script>
        window.fbAsyncInit = function() {
            FB.init({
                appId      : '123456789', // TODO: 取得済みのFacebookアプリIDに置き換えてください。
                xfbml      : true,
                version    : 'v2.3'
            });

            FB.Event.subscribe('edge.create', function(href, widget) {
                cX.setEventAttributes({ origin: 'xyz-website', persistedQueryId: '1234' }); // TODO: persistedQueryIdとoriginを挿入してください
                cX.sendEvent('Social', { action: 'liked_facebook' });
            });
        };

        (function(d, s, id){
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) {return;}
            js = d.createElement(s); js.id = id;
            js.src = "//connect.facebook.net/en_US/sdk.js";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));
    </script>
    <div class="fb-like" data-href="http://www.cxense.com" data-layout="button" data-action="like" data-show-faces="true" data-share="true"></div>

</body>
</html>

Last updated: August 14, 2026