2018.11.22Hacksスポンサーリンクそろそろどうにかせんとなー・・・・・・と思いつつ放置していたんですが、このたびPC表示側のみオリジナルのソーシャルボタンに切り替えてみました。体感的には表示高速化できたかなーと思います。この実装をするにあたり大変便利なプラグインを新規に投入しました。Cache」というやつです。各ソーシャルメディアでは、シェア数を表示するための公式ボタンが、それぞれ配布されています。いかんせん公式のボタンは重いんですよね。それもあって、だいぶ以前から、シェア数をAPI経由で取得して表示するオリジナルボタンを設置したいなーと思っていました。API経由で取得するにしても、毎回リクエストを飛ばして取得してたら、それこそ本末転倒じゃねーかという状況になりかねません。各ソーシャルメディアのシェア数を、定期的に取得・キャッシュする処理を行ってくれるというプラグインです。記事の表示処理とは完全に分離された状態で処理をするので、表示スピードに影響することのない、オリジナルのカウント付きソーシャルボタンを実装することが可能になります。リリース当初の対応サービスは、Facebook、Twitter、Google+、はてなブックマークの4サービスだったのですが、バージョン0.3.0にアップデートされたことで、Pocketにも対応となりました。当ブログは上記5サービスをメインにボタンを設置しているので、このアップデートを機会に、公式ボタンからオリジナルのボタンに変更することにしました。Cache」は、あくまでもシェア数を取得・表示させるためのプラグインです。オリジナルのボタンを実装する場合、別途HTMLとCSSの知識が必須になります。ちなみに当ブログでは以下の状態で実装しています。?>を、Webフォントアイコンの左に設置しました。単一記事ページでは、記事のフッターにも設置しています。ここが、これまで公式ボタンを置いていたエリアですね。公式ボタンのときと同様に縦置きバルーンで実装しています。当ブログにおける実装コード一応、どういうコードで実装しているのかも紹介しておきます。うちのブログではfunciton.phpにコードを記述し、テンプレート側で呼び出すようにしています。functions.phpの記述コードは以下。?>と記述すればOK。ちなみにGoogle+のコードは、インタラクティブ投稿で実装しています。APIを使ってGoogle+へインタラクティブ投稿させるようにしてみました。その実装方法についてまとめてみましたよ。CSSは以下のような感じになっております。Cache」はWordPressの管理画面上で、取得したシェア数を一覧で確認することができます。現時点で1290記事ありますが、一画面内でズラッと見ることができます。このテーブルを、年単位で抽出して、昇順降順で並び替えたりできると、なお良いんですがねぇ。それについてはエクセルなりCSVなりにコピペしてサクッと手作業すればいいか。バージョン0.3.0から、取得・キャッシュ保存したシェア数を使った人気記事一覧を作ることができるオプションが追加されました。こちらもかなり便利そうですね。Cache」を選択肢のひとつに入れておくといいのではないかと思います。カズキフリーランスのウェブディレクター。