CocoonでTwitterのシェア数を表示させる方法|プラグイン不要

わいひら氏の「Simplicity」から「Cocoon」へテーマの変更しました。今までより見やすく使いやすくなって大変満足しています。しかし「Cocoon」からツイッターのシェア数表示が無くなりました。それをなんとか見られるようにしたくてフォーラムで助けを求めたら、実現できました。なのでその方法をご紹介します。

SNS

スポンサーリンク

SimplicityからCocoonへ変更

8月上旬からテーマを「Simplicity」から「Cocoon」に変更しました。

SimplicityからCocoonにテーマ変更|発生したエラーと対策

SimplicityからCocoonにテーマ変更|発生したエラーと対策
わいひら氏の無料テンプレート「Cocoon」の正式版がリリースされたのでテーマの変更をしたところ、少しばかりエラーがありました。それらの対策方法です。

変更当初は素人故に色々四苦八苦しましたが、今では大変満足しています。しかし1つだけ何とかならないかと思うようになりました。それはツイッターのシェア数が表示されなくなったことです。

ツイッターシェア数表示がない寂しさ

1つのツイートでもリツイートでも大変嬉しい私です。なのでツイート数が表示されていることはある意味私の癒しであると同時に次の記事も頑張って書くぞという励みです。しかしツイッターのシェア数は少し前から公式で表示されなくなりました。

この変化はブログを書いている人達に少なからず影響を与えました。私もその1人です。しかしその問題はすぐに解決されました。widgetoon.js&count.jsoonというサービスにサイトを登録すれば、過去のツイート数を集めてくれるのです。

当時使っていたテーマ「Simplicity」でもすぐに対応してくれたので、当サイトも登録して、すぐにまたシェア数を表示できるようになりました。

廃止されたTwitterの「シェア数付きボタン」を表示させる方法、「count.jsoon」の基本的な使い方
widgetoon.jsスクリプトと、count.jsoonAPIサービスを利用して、サイトやページごとのツイート数を取得するWordpressカスタマイズ方法の紹介です。count.jsoonコードの使い方など。

しかしCocoonからは対応しない方針になっています。

一応補足として書いておくと、Cocoonテーマ自体では、count.jsoonの対応はしていません。
というのも、最近count.jsoonカウントもされたりされなかったりあって、あまり信用ならないからです。
count.jsoonに対応するには、上に書かれているようなカスタマイズをするしかありません。

もう少し、手軽に対応するには、SNS Count Cacheプラグインを使用した方法もあります。
Cocoonは一応、SNS Count Cacheプラグインに対応しています。
なので、プラグインをインストールしてcount.jsoonの設定を行えば、Twitterのカウントも表示されます。

count.jsoonの設定方法
Simplisity2からCocoonに変更しました。 Simplisity2の時からcount.jsoonを利用していましたが、Cocoonでの設定はどのようにしたらよいでしょうか?

わいひら氏の作っているテーマですから、その方針に従うしかありません。というわけで私も初めて「SNS Count Cache」を利用することにしました。が、問題があったのです。

SNS Count Cacheの問題点

プラグイン「SNS Count Cache」はSNSのカウント数をキャッシュして表示してくれるプラグインです。早速当サイトでも使いました。しかしツイッターやはてブなどのシェア数は表示されるのに、フェイスブックのシェア数だけ取得されないのです。

Facebookシェア数が取得されなくなる

私はFacebookを利用していないためアカウントを持っていません。なのでFacebookは利用しない設定にしていました。するとこのプラグインを有効にしたらシェア数が表示されなくなったのです。

少ないながらもシェアされている記事もあるので、これは非常に寂しい。というか、利用するにチェックを入れていないのだから、チェックを入れていないSNSは普通に取得してくれればいいのに・・・。

とまあ、何せこのプラグインを有効化するとFacebookのシェア数が表示されなくなってしまう問題が起こったのです。

Facebookアカウント必須

「SNS Count Cache」でFacebookのシェア数を取得し、表示するためには、Facebookのアカウントを取って更に開発者登録しないと手に入らない「app ID」と「シークレットキー」が必要です。

それならば私も「Cocoon」乗り換えを機会にFacebookへ登録するべく検討中です。

Cocoonでツイッター取得する手順

というわけで、Facebook登録せず、プラグインも使わずに、ツイッターのシェア数を取得できないかと「Cocoon」のフォーラムで助けを求めました。詳細はフォーラムをどうぞ。

SNS Count Cacheを使わずにツイッターのシェア数を表示させたい
わいひら様へ こんにちは。Simplicityで長年お世話になっていた優です。先日からCocoonに切り替えました。非常に使いやすく、見やすくて満足しています。ただ1つだけ、個人的に改造できたらなと思ったことがあるので御指南下さい。 Simplicityではツイッターのシェア数が表示されていましたが...

ここで教えてもらった方法がこちらです。

PHPとcount.jsoonを用いてTwitterのシェア数を取得するWordPressカスタマイズ方法
count.jsoon APIを用いて、Twitterのcount.json APIのようにツイート数を取得する方法です。今回は、Wordpress上でPHPを用いてシェア数を取得します。

わいひらさんの寝ログ内で紹介されていた方法ですが、私でも出来たくらいなので手順は簡単です。

  1. count.jsoonに登録
  2. Cocoonの子テーマの「functions.php」に関数をコピペで書き加える
  3. Cocoonの親テーマの「tmp/sns-share-buttons.php」のファイルのコードを書き換える

以上の3つです。ただし今回は「PHPファイルの書き換え」があるため、不具合発生も想定しなくてはなりません。

必ず「バックアップ」を取って作業をしましょう。

count.jsoonに登録

ではまずツイッターのツイート数を集めてくれる「count.jsoon」サービスに自分のサイトを登録します。(既に登録している方は次に進んで下さい)

widgetoon.js & count.jsoon | digitiminimi

トップへ行くと「サイト登録申請」のボタンが中央にあるのでクリックして中に入りましょう。

count.jsoon 登録

すると利用規約への同意や自分のサイトのURLと連絡用のEメールアドレスを登録するなどの手順が始って、全て登録を終えるとEメールが届きます。

count.jsoon 登録 メール

記載されているURLへアクセスすると登録したサイトの情報が判ります。うちは既にかなり前に登録したため、ツイッターとの連携も完了し、全ツイート回収完了となっています。

count.jsoon 登録 ツイッター 完了初めて登録した人はツイートの回収に数日を要しますので、暫く待ちましょう。

Cocoon子テーマの「functions.php」に関数を入力

続いて、Cocoonの子テーマから「count.jsoon」へツイッターのシェア数を読みに行ってねという命令をするコードを書き込みます。

まず「外観」から「テーマの編集」を選び、Cocoonの子テーマ「Cocoon Child」を選び、その中の「テーマのための関数(function.php)」を選びましょう。

Cocoon 子テーマ テーマのための関数 PHP

選ぶと使いたい関数を追記出来るようになっているので、そこに目的のコードを追記し、ファイルを更新します。追記するコードはこちらです。

//count.jsoonからTwitterのツイート数を取得
function fetch_twitter_count($url){
$url = rawurlencode( $url );
$subscribers = wp_remote_get( "http://jsoon.digitiminimi.com/twitter/count.json?url=$url" );
$res = '0';
if (!is_wp_error( $subscribers ) && $subscribers["response"]["code"] === 200) {
$body = $subscribers['body'];
$json = json_decode( $body );
$res = ($json->{"count"} ? $json->{"count"} : '0');
}
return $res;
}

追記するとこうなります。

Cocoon 子テーマ テーマのための関数 PHP

ここで問題が起こった場合、PHPコードの書き換えトラブルに対応できる知識が無い人は諦めて削除して、元に戻しましょう。時には諦めも肝心です。

Cocoonの親テーマ「tmp/sns-share-buttons.php」のファイルの書き換え

最後に難敵、Cocoonの親テーマを書き換えます。もう一度言いますが、こちらは親テーマです。必ずバックアップを取ってから行いましょう。

では、「外観」メニューから「テーマの編集」を選び、Cocoonの親テーマを呼び出します。そして、その中の「tmp/sns-share-buttons.php」を選びます。かなり下の方です。焦らずに探しましょう。

Cocoon 親テーマ  PHP

選んだら、記載してある15行目を見て下さい。

Cocoon 親テーマ PHP 改造

<?php echo get_twitter_count(); ?>

ファイルの中に上記のコードを見つけたら

<?php echo fetch_twitter_count( get_permalink() ); ?>

に書き換えます。

書き換えた後がこちら。

Cocoon 親テーマ PHP 改造

これでツイッターのシェア数を「count.jsoon」に呼び出す命令が書き加えられました。試しに上手く行っているか自分のサイトの記事を見て下さい。ツイート数が取得されており、Facebookなどのシェア数も表示されていれば成功です。

もし取得されていなければ、潔く諦めましょう。この方法はPHPのカスタマイズであり、個別対応しないことが、現時点でのCocoon開発者わいひら氏の意向です(2018/8/26)

注意点(2018/8/31 追記あり)

ツイッターのシェア数を「count.jsoon」に読み込ませるのは、PHPコードのカスタマイズ、改造です。わいひらさんに教えてもらった方法ですが、推奨方法ではありません。

何度も申し上げますが、テーマ「Cocoon」でツイッターのシェア数を取得・表示させたい場合は、プラグインの「SNS Count Cache」の利用が最適です。しかし私のようにFacebookアカウントを持っていない場合はこの方法を試してみてください。

2018/8/31 追記

この改造は親テーマへの記述が含まれています。そのため、テーマをアップデートすると書き込んだ内容が変わるので、都度、再記述が必要になります。それが面倒だと感じる方は改造しない方が良いでしょう。

最後にひとこと

ツイッターのシェア数もFacebookのシェア数も、プラグイン無しで表示されるようになってとても満足しています。

フォーラムで声をかけて下さったかうたっく様、そしてCocoonの生みの親わいひら様には心から感謝致します。ありがとうございました!