CocoonではTwitterのシェア数が表示されません。これは本家Twitter側がツイート数取得APIをやめてしまったためです。
代替として「count.jsoon」というサービスに登録してツイート数を取得する方法がありますが、カウントが表示されたりされなかったりする事もあるためCocoonでは採用されてません。
という事でTwitterのシェア数を表示したい場合には自分で「count.jsoon」に登録してphpのファイルを編集する必要があります。
今回は「count.jsoon」の登録とTwitterシェア数表示のカスタマイズを紹介していきます。
Twitterのシェア数を表示する手順と流れ
Twitterのシェア数を表示する手順は3ステップです。
- count.jsoonに登録
- 子テーマのfunctions.phpにコードを追加
- phpファイルを編集してTwitterカウント数を表示する記述に変更する
それぞれ注意点もあるのでその都度紹介していきます。
※カスタマイズ前にはバックアップとっておくと安心です。ファイル編集などは自己責任でお願いします。
手順1.count.jsoonに登録
count.jsoonに登録していきます。
サイト登録申請ボタンをクリック。
利用規約の同意にチェックを入れてサイトURLとメールアドレスを入力して「サイト登録」をクリック。
以上で登録申請は完了です。
登録処理が終わるまで1日～2日かかりますのでその間にファイルの編集をしていきます。
手順2.子テーマのfunctions.phpにコードを追加
子テーマのfunctions.phpにコードを追加していきます。
functions.phpは記述ミスしたり、重複する記述をしたりするとサイトが真っ白になりますので慎重に。
ただ、記述ミスで真っ白になっても追加した記述を削除して元に戻せば大丈夫です。
WordPressの管理画面から「外観」⇒「テーマエディター」⇒「テーマのための関数（functions.php）」と進みます。
functions.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;
}
手順3.phpファイルを編集してTwitterカウント数を表示する記述に変更する
最後の手順は「tmp/sns-share-buttons.php」というファイルの
<?php echo get_twitter_count(); ?>
という記述を
<?php echo fetch_twitter_count( get_permalink() ); ?>
に書き換えるのですが、やり方は2通りあります。
- 親テーマのファイルを編集する
- 子テーマにファイルを追加して編集する
親テーマを編集するのが簡単なんですが、テーマ自体が更新したら再度編集が必要になります。
子テーマの編集だとテーマが更新しても再度編集は必要ありません。
ただ、Cocoonの子テーマには「sns-share-buttons.php」ファイルがないので、追加してから編集する必要があります。
また、親テーマに大きな変更があったりすると不具合出る可能性もなくはないって感じですね。
どちらも重要なテーマ編集なので自己責任でお願いします。
※「親テーマの編集」「子テーマの編集」両方する必要はありません。どちらかの編集だけでOKです。
1.親テーマのファイルを編集する場合
WordPressの管理画面から「外観」⇒「テーマエディター」⇒右上の「編集するテーマを選択」で「Cocoon（親テーマ）」を選択。
「tmp」フォルダの中の「sns-share-buttons.php」をクリック。
「sns-share-buttons.php」から以下の記述を探します（私のは18行目にありました）。
<?php echo get_twitter_count(); ?>
この部分を以下のように書き換えます。
<?php echo fetch_twitter_count( get_permalink() ); ?>
2.子テーマのファイルを編集する場合（エックスサーバーの場合）
レンタルサーバーはエックスサーバーの例でやっていきます。
まずは親テーマの「sns-share-buttons.php」をコピーする必要があります。
ファイルマネージャーから「自分サイトのドメイン」⇒「public_html」⇒「wp-content」⇒「themes」⇒「cocoon-master」⇒「tmp」と進み、「sns-share-buttons.php」にチェックを入れて「編集」。
これが親テーマの「sns-share-buttons.php」なので内容をまるっとコピーします。
コピーできたらこんどは子テーマの方へいきます。
ファイルマネージャーから「自分サイトのドメイン」⇒「public_html」⇒「wp-content」⇒「themes」⇒「cocoon-master」と進み「tmp」というフォルダを作成。
作成した「tmp」フォルダをクリックしてtmpフォルダ内に今度は「sns-share-buttons.php」ファイルを作成。
次に追加した「sns-share-buttons.php」にチェックを入れて「編集」。
後は親テーマからコピーした「sns-share-buttons.php」の内容を子テーマの「sns-share-buttons.php」に貼り付け。
後は
<?php echo get_twitter_count(); ?>
という記述を
<?php echo fetch_twitter_count( get_permalink() ); ?>
に書き換えて保存したらOKです。文字コードは「UTF-8」で保存。
以上で編集は完了です。
count.jsoonの登録が完了してればTwitterのシェア数が表示されます。
このSNSシェアボタンが表示されない場合はフォルダの追加やファイルの記述ミスがありますので再度確認してみて下さい。
参考：PHPとcount.jsoonを用いてTwitterのシェア数を取得するWordPressカスタマイズ方法｜寝ログ
コメント