SNS Count CacheでSNSボタンにシェアカウント数を表示させる方法!ストークにも使える

SNSCountCache
スポンサーリンク

LIFE LOGSのてんぐうです。

今回はWordPressプラグイン『SNS Count Cache』でSNSボタンにシェアカウント数を入れる方法に関してご説明したいと思います。

SNS Count Cacheは『Twitter、Facebook、Google+、Pocket、Pinterest、Linkedin、はてなブックマークのシェア』の数を取得し、バックグラウンドでキャッシュしてくれる優れたプラグインです。

すでに用意された関数を利用するだけで、キャッシュからシェア数の参照を行ってくれます。

基本的には難しい設定をする必要がないので、簡単にシェア数の反映が可能です。読み込みもネットワーク経由ではないのでページの高速化を見込むことができますよ。

私は『stork(ストーク)』というテーマテンプレートを使っているのですが、デフォルトではシェアのカウント数が表示されません。同じようにカウント数が表示されないテンプレートを使っている方は、ぜひ参考にしてくださいね。

難しいことを抜きにして『最低限表示されれば良い』という方は、インストール後に有効化を行うだけで問題ありません。

少し手間がかかりますが、Twitterのツイート数とFacebookのシェア数を表示することも可能ですよ。

画像付きで解説しますので、初心者の方でも簡単に導入することが出来ると思います。

WordPressのプラグインからSNS Count Cacheをインストールしよう

WordPressのダッシュボードメニュー

まずWordPressのダッシュボードにアクセス。

画面左のメニューから『プラグイン』を選択して『新規追加』のボタンをクリックします。

プラグインの検索画面

『キーワード』の『プラグインの検索』項目に『SNS Count Cache』と入力してください。

SNS Count Cache

画像では既に有効になっていますが、インストールを行っていなければ『今すぐインストール』と表示されているはずです。

ボタンをクリックしてインストールした後、有効化を押せば完了です。画面左下に『SNS Count Cache』の項目が増えています。

スポンサーリンク

SNS Count Cacheの基本的な機能と設定の見方

SNS Count Cacheインストール後

次は実際に設定をいじってみたいと思います。

画面左下のプラグイン項目からSNS Count Cacheをクリック。

  • ダッシュボード
  • キャッシュ状況
  • シェア数
  • 設定
  • ヘルプ

5つのメニューからカウント数の読込状況の確認、どのSNSを読み込むかの設定変更などが行えるので、実際に触れていきましょう。

ダッシュボード画面の説明

SNSCountCache全体の確認

ダッシュボードの項目では『全体キャッシュの状況』を確認することができます。

総コンテンツ数はSNS Count Cacheに認識されている記事の数(固定ページも含まれる)が表示されます。インストール時は未キャッシュの状態ですが、時間の経過と共に読み込まれていきますよ。

他にも『全体のシェア数』をダッシュボードで確認することが可能です。

記事ごとの個別キャッシュ状況に関して

SNSCountCacheURL項目

キャッシュ状況の項目ではURLごとに個別でチェックが行えます。クロールされた日時の確認もできますよ。

放置しておいても問題なくカウントされていきますが、画面右側にある『キャッシュ』のボタンを押せば手動でシェアのカウント数を反映させることが可能です。

SNSCountCache全体の確認

実際に押してみました。最新の記事ですぐにシェア数を知りたいときは便利ですね。

シェア数の項目

各SNSのシェア数

記事の一覧とSNSシェア数をまとめて閲覧することができます。過去にどの記事がバズっていたのか簡単にチェックすることが可能なのでとても便利な機能です。

『この記事はバズったから続編や関連記事を書こうかな…』といった戦略を立てるのにも役立ちますね。

TwitterとFacebookはデフォルトの状態では数字が表示されないので設定の項目でご説明します。

設定の項目

SNS Count Cacheの設定項目では細かい部分まで変更が可能です。

ですが、特別にいじらなくても使えるプラグインなので、無理に触れる必要はありません。(むしろ変に触らない方が良いかも)

基本的に使うであろう最低限の機能、TwitterとFacebookのカウント数はデフォルトでは計算されない仕様になっているので、この2つの部分だけ設定の項目から変更を行いたいと思います。

シェア基本キャッシュ機能に関して

シェア基本キャッシュ機能のSS

『対象SNS』の項目では、どのソーシャルサービスのシェア数をカウントするか決めることができます。表示させたい項目にチェックを入れるだけでOKです。

『カスタム投稿タイプ』では一般的な投稿記事(post,page)以外に、カスタムで投稿したものを指定してシェア数を表示することが可能です。ここは特に無視して問題ないですね。

シェア数のチェック間隔では『一度にチェックするコンテンツ数』をどの程度の時間で読み込むか指定することができます。

デフォルトの規定値では『600秒ごとに20コンテンツ(10分間隔で1度に20記事)』になっていますが、読み込み中は重くなる可能性があるので私は『300秒ごとに5』へと変更しました。

スキーム移行モードはhttpからhttpsにURLを変更した際に、シェア数の表示を引き継ぐことができる機能です。

これからブログを作成する方は、殆どの人がhttpsなので必要ないかもしれませんね。

まだ移行していない方は有効にしておくと良いですよ。

シェアキャッシュ機能でSNSボタンにFacebookのシェア数を表示させる方法

Facebookのカウント数を表示させるには『Facebook開発者向けページ』にてアプリケーション登録を行う必要があります。

Facebookデペロッパーログイン

👉開発者向けFacebook

まずはFacebookにログイン後、デペロッパーページにアクセスしてください。

Facebookデペロッパー確認画面

次にアプリ名(名前はあとで変更可能)と連絡先のメールアドレスを入力してNextをクリック。

セキュリティチェック能力

セキュリティチェックを入力後『送信する』を押して進みます。これでデペロッパー画面にログインが行えるようになりました。

デペロッパーアプリID

ログイン後のダッシュボードに『アプリID』と『app secret』が保存されているので、このふたつの項目をコピーします。『app secret』は画面右側にある『表示』をクリックして表示させればコピーすることが可能になりますよ。

Facebookシェアキャッシュ機能

次に『シェア基本キャッシュ – Facebook』の『App ID(Client ID)にアプリID』を入力

『App Secret(Client Secret)にapp secret』を入力後、設定の更新を押します。

FacebookAPP入力後

設定の更新を押した後は、自動的に『Access Token』の項目が入力されています。

これでFacebookのシェア基本キャッシュの入力は完了ですね。反映されるまで時間が掛かるので気長に待ちましょう。

 

シェアキャッシュ機能でSNSボタンにTwitterのツイート数を表示させる方法

次はTwitterのツイート数を表示させる方法です。

これは『count.jsoon & widgetoon.js』のサービスを利用することで表示させることが可能です。

widgetoon1

👉widgetoon.js&count.jsoon digitiminimi

まずは公式サイトから登録を行います。『サイト登録申請』を押して進みましょう。

widgetoon2利用規約

利用規約の同意にチェックを入れて、使用するURL(サイト)と登録用のメールアドレスを入力します。間違いなければそのまま『サイト登録』を押してください。

widgetoon登録受付完了

『登録を受け付けました』と表示されれば完了です。

登録が完了する前にTwitterで連携認証を行おうとすると『このアカウントはサービスに登録されていません。Twitterログインの利用は登録完了メールにあるURLからアカウントを登録する必要があります。』とエラーになってしまいます。

登録処理には1~2営業日掛かるので少し待ってくださいね。

 

count.jsoon & widgetoon.jsからメールが届いたら認証を行う

※追記です。登録後、2日で『count.jsoon & widgetoon.js』からメールが届きました。

count.jsoon & widgetoon.jsからの登録メール

メールに含まれているURLより、ユーザーページにアクセスを行ってください。

count.jsoon & widgetoon.js認証

登録したサイトURLに間違いがないかを確認、『使用サイト』の入力にミスがなければ『Twitter連携』のボタンを押して完了です。

count.jsoon & widgetoon.jsアプリ認証

以上でTwitterの連携は完璧です。

今後Twitterのツイート数をカウントすることができるようになりますよ。

 

Google+のシェア数の読み込みは難しい?

Google+のシェア数に関しては、仕様の変更により読み込むことができませんでした。

何かしら手立てはあるのかもしれませんが、デフォルトの状態では読み込みが出来ないのでSNS Count Cacheのアップデートを期待するしかない状態ですね。

この仕様の変更はGoogle+によるものなので、今後もカウントを行うのは難しいかもしれません。

ただ、SNSで人気があるのはTwitterとはてなブックマークなので、これらのシェア数を表示することが出来れば十分だと思います。

フォロー基本キャッシュ機能

followシェアキャッシュ

フォローキャッシュ機能では対象SNSのフォロワー数をチェックすることが可能です。

それぞれのAPI登録が必要になるので少々手間が掛かります。私は特別に必要と思わないので『Feedly』以外は使っていません。

利用したい場合は該当のSNSの登録を行いましょう。

シェア臨時キャッシュ機能

シェア臨時キャッシュ機能

シェア臨時キャッシュ機能は、投稿日から何日までのコンテンツを新着とみなすか決めることができます。

例えば更新してから●日以内の記事は『シェア数のチェック感覚を短くして数字の反映を早める』など特別な設定が可能です。

デフォルトのままでも特に問題はありませんが、私はこちらも300秒の5コンテンツに指定しています。

WordPressテンプレート『stork(ストーク)』の例でカウント数をチェックしてみる

私が使っているWordPressテンプレート『stork(ストーク)』を例に、シェアカウント数の表示を確認したいと思います。

シェアカウント数反映前

上記の画像は『SNS Count Cache』のプラグインをインストールする前のものです。

『SNS Count Cache』をインストール後、有効化を行ってみます。

はてなブックマークとポケットのシェアカウント数が表示されました。特別な設定を行うことなく簡単に表示することができましたね。

Google+は仕様変更のためシェア数の表示は難しいですが、Twitterのツイート数とFacebookのシェア数は説明を行ったように設定すれば表示させることが可能です。

数字が見えた方が拡散されやすいという意見が多いので、頑張ってチャレンジして見てください。

スポンサーリンク

SNS Count Cacheのプラグインをインストールすると重くなるの?

PageSpeedInsights

👉PageSpeed Insightshttps

WordPressのプラグインをインストールすると、サイトが重くなることがあります。

気になったのでWebページの読込速度を判定してくれるGoogle『PageSpeed Insights』で測定を行ってみました。

PageSpeedInsights-mobile

モバイルでの測定結果・インストール前と変更なし

PageSpeedInsights-pc

パソコンでの測定結果・インストール前と変更なし

結果的には『プラグインをインストールする前の数字とインストール後の数字』に変化はありませんでした。

目に見えて重くなるようなことは無いようですが、シェア数を読み込んでいるときは若干重くなる気もします。念のため私はキャッシュの設定を『300秒ごとに5』へと変更を行ってゆとりを持たせています。

正直なところ、一度読み込んだ後のシェアカウント数なんて中々変わりません。3日以内など更新して間もないケースを除けば気にする必要はないと思いますね。

個人的には少しでも重くならない方が良いと思うので遅めにしていますが、デフォルトの設定でも問題なく利用できますよ。

『SNS対象』の部分だけチェックを入れて更新するだけで充分に使えますからね。

ストークにも使える『SNS Count Cache』でシェアカウント数を入れる方法のまとめ

今回は『SNS Count Cache』の使い方と、シェアカウント数を表示させる方法に関してお届けいたしました。

インストールしても特別に重くならなかったので、こだわりがなければシェアのカウント数は表示しておいた方が良いと思います。

はてなブックマークとpocketはデフォルトのままでも問題ないですが、Twitterのツイート数とFacebookのシェア数を表示させたい場合は、設定を行うのを忘れないでくださいね。

何もないのは寂しいのでシェアカウント数はあった方が良さそうですね。

これでSNSを有効に活用してくださいね。ブログ運営に関する人気記事もどうぞ♪

✍ブログ関連記事

スポンサーリンク


SNSCountCache