
ドーモ、僕(@zomubbit)です。ぞむぅ。
前回の記事はここからどうぞ☆
突然ですが、ブログにSNSのシェア数を表示させていますか?


あれ?Twitterのシェア数なくなくない??


でも今からご説明する3STEPを踏めば、誰でもこんな風にTwitterのシェア数を表示することが出来るようになります。


本記事はサーバー上のフォルダとPHPファイルを編集します。
サーバーとかPHPファイルとか聞いて「うわ、、」と思った方、筆者のPCレベルは「何もしてないのに動かなくなったぁ!」です。
そんなパソコン弱者でもとても簡単に出来ます。安心してね。
・PHPファイルはサイトを構成している大事なファイルですので、編集をする前に必ずバックアップを取ってください。
・親テーマではなく子テーマを編集してください。
SNSのシェア数の表示方法
そもそもSNSのシェア数はどうやって表示すればいいのか?
以下の手順で進めば秒で終わります。
①シェア数の表示にチェックを入れる


WordPressの編集画面で『Cocoon設定→SNSシェア→シェア数の表示』に行きます。
シェア数の表示欄は下へスクロールすると出てきますので、これにチェックを入れて「変更をまとめて保存」を押してください。
以上です。
Twitterのシェア数の表示方法
STEP1:count.jsoonに登録する


上記のボタンからwidgetoon.js&count.jsoonのサイトに飛んで、「サイト登録申請」を押してください。


上記3点を入力後、「サイト登録」を押してください。
以上です。
登録処理に1~2営業日掛かりますので、その間に他の設定をやっておきましょう。
因みに筆者は翌日には登録されました。金曜に申請したら土日を挟んだ月曜以降の登録になるかもです。
STEP2:functions.phpにコードの追加


WordPressの編集画面から『外観→テーマエディター→functions.php』まで行って、下記のソースコードを貼り付けて、「ファイルを更新」を押してください。
『編集するテーマを選択』はCocoon childを選択してください。
//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;
}
STEP3:tmpフォルダ編集
サーバー編
①親テーマからシェアボタンファイルをコピーする


お使いのサーバー(エックスサーバー、ロリポップ、さくらインターネット、ConoHa WING 等)にログイン後、Cocoon親テーマの『tmp』フォルダを目指してください。
ConoHa WINGの場合は、まず『サイト管理→ファイルマネージャー』の手順で進んでください。
進んだら『****@localhost→public_html→自分のサイトURL→wp-content→themes→cocoon-master→tmp』の順でtmpフォルダまで行ってください。


『sns-share-buttons.php』ファイル上で右クリック&コピーで、ファイルをコピーしてください。
②子テーマにシェアボタンファイルを貼り付ける


『wp-content→themes→cocoon-child-master→tmp』の順でtmpフォルダまで行き、先ほどコピーしたファイルを貼り付けてください。
※画面の何もないところで右クリックをするとメニューが出てくるので『ペースト』を選んで下さい。
※tmpフォルダがない時は、、、


cocoon-child-masterフォルダ内で新規フォルダをクリックしてフォルダを作ってください。フォルダ名は『tmp』で。
WordPress編
①sns-share-buttons.php


WordPressの編集画面から『外観→テーマエディター→tmp→sns-share-buttons.php』まで行って、sns-share-buttons.phpをクリックしてください。
『編集するテーマを選択』はCocoon childを選択してください。
②ソースコードの置き換え


『ctrl+F』で出てきた検索バーに下記のソースコードを入力してください。
<?php echo get_twitter_count(); ?>


上記の検索で出てきたオレンジ色の箇所を以下のソースコードと置き換えてください。
<?php echo fetch_twitter_count( get_permalink() ); ?>
「ファイルを更新」を押して終了です。お疲れさまでした!
親テーマを直接編集することでもっと簡単に出来る方法もあるみたいですが、それをしてしまうと親テーマがアップデートした場合に編集内容が無効になってしまったり、カスタマイズを原因とする不具合が起こった際に復旧が難しいので、あまりお勧めはしません。
まとめ


はい!Twitterのシェア数を表示する方法をご紹介しました。
筆者は大体1週間程度で全記事のTwitterのシェア数が反映されました。気長に待ってみてください。
因みにこのラディッツもどきが言ってる「シェア数6がゴミ」発言ですが、全部ゾムビットが自分でシェアした数です。トホホ。人様にシェアしていただいた数はいくつであろうと家宝でございますよ。


同情するならシェアを(して)くれ!


素人なりに頑張って反映させたのに、丸アイコンに変えたからシェア数表示やめたっていうね。
それでは今回はこの辺で。次もぜってぇ見てくれよな☆
コメント