Twitterボタンのツイート数表示の代替JSでの復活方法まとめ

Twitterのツイート数を復活する方法まとめ


2015年11月、ツイートのカウント数を提供していたサービスが廃止され、ブログやWEBサイト上のツイートボタンのカウント数の取得が出来なくなりました。

記事を見て「これいいじゃん!」と思い、いいね、とかツイートしたい、と思ったとしても、カウントが0だと(誰もしていないと)、なんとなく気後れしてクリックできなかった・・という以前の記憶があるのですが、

ツイートボタンにカウント数がなくなってみると、この心理的なブロックを少し感じるようになったので、やっぱりカウント数表示って結構大事だな、と今更のように感じました。

そこで、ツイートカウント数を復活させるべく対策、その際参考にした記事やその時の手順等を備忘録的にまとめてみました。

digitiminimiのwidgetoon.jsとcount.jsoon

ツイート数をカウントをしていたツイッターのwidget.jsの代替として登場したのが、digitiminimiのwidgetoon.jsとcount.jsoon。
無料で利用できるところもありがたいですね。

設定方法等が丁寧に書かれていてわかりやすい記事、

「廃止されたTwitterの「シェア数付きボタン」を表示させる方法、「count.jsoon」の基本的な使い方」http://nelog.jp/count-jsoon

を参考にツイッター公式ボタンタグを変更しました。
※寝ログさん、いつもありがとうございます。

また、オリジナルデザインボタンの方は、カウント数はプラグインSNS Count Cacheを使用しているので、以下の記事、

【WordPress】Twitterカウント復活!代替APIがあったよ!http://www.omoide-soko.jp/apps/wordpress/wordpress/1384

を参考に設定しなおしました。
※風の羅針盤さん、ありがとうございます。

この記事では以下の2パターンについて、設定内容、変更内容について備忘録的にまとめてみました。

  • ツイッター公式のボタンタグ&公式widget.jsを使用
  • オリジナルデザインボタンでツイートカウント数はプラグインSNS Count Cacheを使用

digitiminimiでの登録

上のどちらの場合でも、ツイート数を表示させるためのこのサービスを利用するには、まずdigitiminimiでの登録が必要です。

以下のページから使用するサイトとメールアドレスを登録します。
digitiminimiでの登録画面http://jsoon.digitiminimi.com/

1サイト1メールアドレス登録になっており、複数サイトを登録するにはそれぞれの違うメアドが必要です。

各サイトのメールアドレスを使用するのが良いと思います。
例:abc.com で使う場合 mail@abc.com で登録

登録完了メールが下のような感じで届きます。
登録完了メール

リンクをクリックして、マイページを開き、サービス状態のTwitter連携:登録するをクリックします。

アプリの連携認証画面に変わるので、認証ボタンをクリックして認証、でOKです。

次にボタンの設定をします。

ツイッター公式ボタンとウィジェットを使用している場合

jsoonのツイッターボタンタグ

公式のツイートボタンを使用していた場合は、以下のタグに差し替えます。

◆ホリゾンタルタイプの場合

ツイッターボタン・カウント有り横置き・ホリゾンタルタイプ

<a href="http://twitter.com/share"
  class="twitter-share-buttoon"
  data-url="<?php the_permalink(); ?>"
  data-text="<?php the_title(); ?>"
  data-count="horizontal"
  data-lang="ja">ツイート</a>

◆バーティカルタイプの場合

ツイッターボタン・カウント有り・ヴァーティカルタイプ

<a href="http://twitter.com/share"
   class="twitter-share-buttoon"
   data-url="<?php the_permalink(); ?>"
   data-text="<?php the_title(); ?>"
   data-count="vertical"
   data-lang="ja">ツイート</a>

スクリプト

下のボタンのカウント数を取得するために使用するスクリプトをfooter.phpの</body>タグ前にコピペします。

この時、ボタン以外でツイッター埋め込みタイムラインなどを使用している場合には、ツイッター公式widget.jsをタイムラインの方で使用するので、新しいスクリプトを加えるだけでOKです。

例)Twitter埋め込みタイムライン
Twitter埋め込みタイムライン

ツイッター埋め込みタイムラインなどを使用していないのであれば、公式スクリプトは不要になりますので、
公式スクリプト

<script>// <![CDATA[ !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs'); // ]]></script>

と差し替えます。

下が、新しいスクリプトです。

<!-- TWITTER count-jsoon-->
<script type="text/javascript" src="http://jsoon.digitiminimi.com/js/widgetoon.js"></script>
<script> widgetoon_main(); </script>

ヘッダーにjsoon、フッターでwidgetoonをという方法と、フッターに両方とも置く、という方法を2つとも試してみたところ、フッターに両方とも置いても問題なく取得できました。

ヘッダーにjsoonを置くとPagespeedページで注意されるので、フッターの方がおすすめです。

APIの使い方の詳細については、以下のページを参考にしてみて下さい。

digitiminimi.comの、「APIの使い方」ページ
http://jsoon.digitiminimi.com/service_usage.html

では、次にオリジナルデザインボタンの場合です。

オリジナルデザインボタンで、ツイートカウント数はプラグインSNS Count Cacheを使用している場合

先述の記事を読んでいただければ抜かりはないのですが、一応自分なりに(^^ゞ。

この場合、SNS Count Cacheのツイートカウント数取得先を変更する必要があります。
変更するには、/wp-content/plugins/sns-count-cache/includes内のclass-share-crawler.phpを編集します。

FTPソフトで、/wp-content/plugins/sns-count-cache/includesを開きます。
サーバーフォルダ階層・プラグイン

class-share-crawler.phpを一度ダウンロードします。

ダウンロード先のフォルダを新規に作っておいて、ダウンロードするとダウンロードしたファイルがどこにダウンロードしたのかわからない!といったことが起こり難くわかりやすいです。
クローラーphpファイルをダウンロード

class-share-crawler.phpを編集しますが、まず、ダウンロードしたデフォルトのphpは上書きしないように保存しておきましょう。
※何かうっかりミスなどをやらかした時のためにすぐに元に戻せるようにするためのバックアップ
バックアップ

編集するファイルをテキストファイルなどで開き、154行目にツイートカウント数を取得するための記述があり、155行目が実際にカウント数を取得するAPIを指定している行です。

変更箇所155行目

この155行目を変更します。
※ココでは前のものをコメントアウト(/* ~ */)して、その下に新しいスクリプトを追加しています。

if ( isset( $target_sns[SNS_Count_Cache::REF_SHARE_TWITTER] ) && $target_sns[SNS_Count_Cache::REF_SHARE_TWITTER] ) {
/*$query_urls[SNS_Count_Cache::REF_SHARE_TWITTER] = 'http://urls.api.twitter.com/1/urls/count.json?url=' . $url;*/
$query_urls[SNS_Count_Cache::REF_SHARE_TWITTER] = 'http://jsoon.digitiminimi.com/twitter/count.json?url=' . $url;
}

変更したら、FTPソフトで元のphpファイルと同じところにアップロードし、上書きします。
編集済みファイルをアップロード

ツイッターボタンのカウント表示をオフにしていた場合は復活させておきましょう。

後はSNS Count Cacheがカウントを取得してくれるのを待つのみ、です(^^)

ではでは、今日はこの辺で。
お役に立ちましたら、ツイートなどしていただけるとうれしいです(≧▽≦)

Published:2016/03/15

Written by

コメントを残す