Add This ContentAPIでコンテンツの利用状況を取得｜Add This｜Web関連特集

TOP Web関連特集Add This ContentAPIでコンテンツの利用状況を取得

AddThis Content API
過去1カ月の人気コンテンツを取得〔trending〕
過去1週間のクリック状況を取得〔clicked〕
過去1週間のシェア状況を取得〔shared〕
Twitter、Facebook、Google+など各種サービス上でのシェア・クリック状況を取得

AddThis Content API

2012/5/20

Add Thisは、様々なソーシャルメディアに対応したソーシャルボタンを簡単にサイトに設置できるサービスです。サイトに設置しているAdd Thisウィジェットの利用状況（コンテンツのシェア数やクリック数）をフィードで取得することができます。

フィードはRSS形式またはJSON形式で取得できます。
ここではJSON形式でフィードを取得しjQueryでHTML出力する方法を解説します。

Profile IDとContent Feedの有効化

まずは、Add Thisにログイン後、設定画面（Settings→Publisher Profiles）を開きましょう。

APIリクエストの際、「Profile ID」が必要になります。
これは、プロフィール画面の上部に記載されています。

次に、「Content Feed」の「Enable content feeds」にチェックを入れて、コンテンツのRSSやJSONフィードにコンテンツフィードがアクセスできるように許可します。

※これを有効にすることで、サイトに設置しているAdd Thisウィジェットの解析データの一部へ一般アクセスができるようになります。そもそも外部から参照されたくない場合は有効にしないように。

API

http://q.addthis.com/feeds/1.0/ファイル名.json?パラメータ&パラメータ

以下の条件をパラメータとして付加できます。
※Add ThisのAPIを叩くためのURL生成ジェネレータは「API & SDK References」→「Content Feeds」にあります。

※「Enable Public Feed」を無効にすると生成できません。

ファイル名

表示するフィードをファイル名に指定します。

ファイル名	説明
trending	Trending Content：人気のあるコンテンツ（シェア、クリック数が多いもの）
shared	Most Shared：最もシェアされたコンテンツ
clicked	Most Clicked：最もクリックされたコンテンツ

オプション

以下のパラメータで取得条件を指定可能です。

パラメータ	説明
pubid	取得したいフィードの「profile ID」を指定。例）&pubid=cocoism3
domain	特定のドメイン上のURLを表示する場合に指定。全ドメインのフィードを生成する場合は空白でOK。例）&domain=phpjavascriptrooom.com
period	特定の期間に共有または/クリックされたURLを表示したい場合に指定。 Last Month：過去1カ月間　&period=month Last Week：過去1週間　&period=week Last Day：過去1日　&period=day
service	特定のサービスから共有または/クリックされたURLを表示したい場合に指定。 ※指定可能なサービスコードはこちら→Service Codes 例）&service=facebook

http://q.addthis.com/feeds/1.0/shared.json?
domain=phpjavascriptroom.com&pubid=cocoism3&period=month

APIをたたくと、以下のようなJSONデータが返ります。

json

[
  {
    "url":"http://phpjavascriptroom.com/?t=ajax&p=jquery_plugin_imagegallery#at_pco=cfd-1.0",
    "title":"画像ポップアウト・イメージギャラリー・スライドショー｜jQuery plugin｜Ajax｜PHP & JavaScript Room",
    "shares":7,
    "clicks":15
  },
  {
    "url":"http://phpjavascriptroom.com/?t=topic&p=socialicon#at_pco=cfd-1.0",
    "title":"ソーシャルブックマーク関連のフリーアイコン｜アイコン｜Web関連特集｜PHP & JavaScript Room",
    "shares":3,
    "clicks":3
  },
  …略…
]

過去1カ月の人気コンテンツを取得
trending

2012/5/20

指定したドメイン上での過去1カ月間で最もクリック＆シェアされた人気コンテンツを取得するサンプルです。

http://q.addthis.com/feeds/1.0/trending.json?
domain=phpjavascriptroom.com&pubid=cocoism3&period=month

設置サンプルサンプルを見る

<? header("Access-Control-Allow-Origin: *"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="Content-Language" content="ja" />
        <meta http-equiv="Content-Script-Type" content="text/javascript" />
        <meta http-equiv="Content-Style-Type" content="text/css" />
        <meta http-equiv="imagetoolbar" content="no" />
        <title>Add this Content API| 設置サンプル</title>
        <link rel="stylesheet" type="text/css" href="/content/lib/global.css" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <!-- JS -->
        <script type="text/javascript">
            $(function(){
                // Trending Content
                var url="http://q.addthis.com/feeds/1.0/trending.json?callback=?";
                $.getJSON(url, {
                        "domain":"phpjavascriptroom.com",
                        "pubid":"cocoism3",
                        "period":"month"
                    },
                    function(json){
                        var s="";
                        for(var i in json){
                            var obj=json[i];
                            var clicks=obj.clicks;
                            var shares=obj.shares;
                            var title=obj.title;
                            var url=obj.url;
                            s+="<li><a href='"+url+"'>"+title+"</a><br>クリック数："+clicks+" / シェア数："+shares+"</li>";
                        }
                        $("#res").html(s);
                    }
                );
            });
        </script>
    </head>
    <body>
<!-- CODE -->
        <h2>phpjavascriptroom.comのAdd This利用状況</h2>
        <h3>トレンドコンテンツTOP20</h3>
        <ol id="res"></ol>
<!-- / CODE -->
    </body>
</html>

過去1週間のクリック状況を取得
clicked

2012/5/20

指定したドメイン上での過去1週間で最もクリックされたコンテンツを取得するサンプルです。

http://q.addthis.com/feeds/1.0/clicked.json?domain=phpjavascriptroom.com&pubid=cocoism3&period=week

設置サンプルサンプルを見る

<? header("Access-Control-Allow-Origin: *"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="Content-Language" content="ja" />
        <meta http-equiv="Content-Script-Type" content="text/javascript" />
        <meta http-equiv="Content-Style-Type" content="text/css" />
        <meta http-equiv="imagetoolbar" content="no" />
        <title>Add this Content API| 設置サンプル</title>
        <link rel="stylesheet" type="text/css" href="/content/lib/global.css" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <!-- JS -->
        <script type="text/javascript">
            $(function(){
                // Most Shared, Last Month
                // http://q.addthis.com/feeds/1.0/clicked.json?domain=phpjavascriptroom.com&pubid=cocoism3&period=week
                var url="http://q.addthis.com/feeds/1.0/clicked.json?callback=?";
                $.getJSON(url, {
                        "domain":"phpjavascriptroom.com",
                        "pubid":"cocoism3",
                        "period":"week"
                    },
                    function(json){
                        console.log(json);
                        var s="";
                        for(var i in json){
                            var obj=json[i];
                            var clicks=obj.clicks;
                            var shares=obj.shares;
                            var title=obj.title;
                            var url=obj.url;
                            s+="<li><a href='"+url+"'>"+title+"</a><br>クリック数："+clicks+" / シェア数："+shares+"</li>";
                        }
                        $("#res").html(s);
                    }
                );
            });
        </script>
    </head>
    <body>
<!-- CODE -->
        <h2>phpjavascriptroom.comのAdd Thisクリック状況</h2>
        <h3>過去1週間で最もクリックされたコンテンツ</h3>
        <ol id="res"></ol>
<!-- / CODE -->
    </body>
</html>

過去1週間のシェア状況を取得
shared

2012/5/20

指定したドメイン上での過去1週間で最もシェアされたコンテンツを取得するサンプルです。

http://q.addthis.com/feeds/1.0/shared.json?
domain=phpjavascriptroom.com&pubid=cocoism3&period=week

設置サンプルサンプルを見る

<? header("Access-Control-Allow-Origin: *"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="Content-Language" content="ja" />
        <meta http-equiv="Content-Script-Type" content="text/javascript" />
        <meta http-equiv="Content-Style-Type" content="text/css" />
        <meta http-equiv="imagetoolbar" content="no" />
        <title>Add this Content API| 設置サンプル</title>
        <link rel="stylesheet" type="text/css" href="/content/lib/global.css" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <!-- JS -->
        <script type="text/javascript">
            $(function(){
                // Most Shared, Last Month
                // http://q.addthis.com/feeds/1.0/shared.json?domain=phpjavascriptroom.com&pubid=cocoism3&period=week
                var url="http://q.addthis.com/feeds/1.0/shared.json?callback=?";
                $.getJSON(url, {
                        "domain":"phpjavascriptroom.com",
                        "pubid":"cocoism3",
                        "period":"week"
                    },
                    function(json){
                        console.log(json);
                        var s="";
                        for(var i in json){
                            var obj=json[i];
                            var clicks=obj.clicks;
                            var shares=obj.shares;
                            var title=obj.title;
                            var url=obj.url;
                            s+="<li><a href='"+url+"'>"+title+"</a><br>クリック数："+clicks+" / シェア数："+shares+"</li>";
                        }
                        $("#res").html(s);
                    }
                );
            });
        </script>
    </head>
    <body>
<!-- CODE -->
        <h2>phpjavascriptroom.comのAdd Thisシェア状況</h2>
        <h3>過去1週間で最もシェアされたコンテンツ</h3>
        <ol id="res"></ol>
<!-- / CODE -->
    </body>
</html>

Twitter、Facebook、Google+など各種サービス上でのシェア・クリック状況を取得

2012/5/20

選択したサービス上での月間トレンドコンテンツを取得するサンプルです。

設置サンプルサンプルを見る

<? header("Access-Control-Allow-Origin: *"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="Content-Language" content="ja" />
        <meta http-equiv="Content-Script-Type" content="text/javascript" />
        <meta http-equiv="Content-Style-Type" content="text/css" />
        <meta http-equiv="imagetoolbar" content="no" />
        <title>Add this Content API| 設置サンプル</title>
        <link rel="stylesheet" type="text/css" href="/content/lib/global.css" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <!-- JS -->
        <script type="text/javascript">
            $(function(){
                // Trending Content
                var url="http://q.addthis.com/feeds/1.0/trending.json?callback=?";
                var data={
                    "domain":"phpjavascriptroom.com",
                    "service":"twitter",
                    "pubid":"cocoism3",
                    "period":"month"
                }
                function review(){
                    $("#res").empty().html("Loading...");
                    data["service"]=$("#service").val();
                    $.getJSON(url, data,
                        function(json){
                            var s="";
                            if(json.length<1){
                                s+="データがありません";
                            }else{
                                for(var i in json){
                            console.log(json[i]);
                                    var obj=json[i];
                                    var clicks=obj.clicks;
                                    var shares=obj.shares;
                                    var title=obj.title;
                                    var url=obj.url;
                                    s+="<li><a href='"+url+"'>"+title+"</a><br>クリック数："+clicks+" / シェア数："+shares+"</li>";
                                }
                            }
                            $("#res").html(s);
                        }
                    );
                }
                review();
                $("#service").change(function(){
                    review();
                });
            });
        </script>
    </head>
    <body>
<!-- CODE -->
        <h2>phpjavascriptroom.comのAdd This利用状況</h2>
        <h3>各サービス上での人気のコンテンツ</h3>
        <p>
            <label for="service">サービス選択：</label>
            <select id="service" name="service">
                <option value="facebook" selected>facebook</option>
                <option value="facebook_like">facebook Like</option>
                <option value="twitter">Twitter</option>
                <option value="google">Google</option>
                <option value="google_plusone">Google +1</option>
                <option value="hatena">Hatena</option>
                <option value="email">Email</opiton>
                <option value="print">Print</option>
            </select>
        </p>
        <ol id="res">Loading...</ol>
<!-- / CODE -->
    </body>
</html>

Webサービス連動 防災情報関連のAPIやツール

YouTube YouTubeチャンネルのカスタマイズ方法

PHP & JavaScript Room

Add ThisAdd This ContentAPIでコンテンツの利用状況を取得