ブログのコメントシステム比較、結果レスポンシブ対応・高速化表示にも対応したdisqusをオススメする

wordpress, ブログ運営

テーマを変更するに当たってブログのコメントシステムをカスタマイズした際の備忘録。

ブログで使えるコメントシステムには、有用な選択肢としては5つある。ローカル環境で5つのコメントシステムを試して、それぞれの特徴をまとめてみました。【コメントシステムを導入しようかなぁ~】と悩んでいる方が居れば、どのコメントシステムを導入するかの判断材料になればと思います。

当ブログでは悩みに悩んだ結果disqusを選択しました、その理由などは記事中盤で解説します。またwordopress環境でのdisqusをより高速化させる導入方法を記載いたしました。

スポンサーリンク

各種コメントシステムの特徴

Disqus
レスポンシブ対応・高速表示
facebook,googlePlus,twitter等のSNSのアカウントでコメントできる
コメントシステムのSNS化が出来る
個々のコメントに対する評価(レーティング機能)
導入が簡単
大手有名サイトも使用
(米ローリング・ストーン誌や大手ニュースサイトCNBC等で採用)
Livefyre
レスポンシブ対応・高速表示
facebook,googlePlus,twitter他、各種SNSのアカウントでコメントできる
匿名でコメント出来るが、高機能なスパム対策が施されている
個々のコメントに対する評価(レーティング機能)
導入が簡単
大手有名サイトも使用
(大手ニュースメディアCNNのサイト等で採用)
Jetpack
コメントシステムだけでなく色々な機能が備わっているwordpress plugin
レスポンシブ対応
wordpressでしか使えない
各種主要SNS対応
動作速度が遅い
(jetpackの使用する機能をコメントだけにしても遅い)
■ブログの標準機能のコメントシステム
各ブログサービスにもよるが、標準的な機能が備わっている
動作速度は一番速い
各種SNSサイトとの連携が出来ない
■各種SNS(facebook,twitter,google+等のコメントシステム)
動作速度は標準
それぞれを個別で全て導入すると非常にブログが重くなる
ブログの訪問者がよく使うSNSが偏っているなら導入しても問題ない
訪問者の主要SNSが分散しているとコメントの機会が減る

比較してdisqusに決めたー理由

デザインや動作などを見て、まず候補はdisqusとLivefyreの2つに絞られた。

ブログの標準のコメントシステムは各SNSの対応が出来ないので却下。各種SNS純正のコメントシステムは、個別に導入する手間と動作速度の面で却下。Jetpackコメントシステムは、デザインや機能はいいのだが、動作速度の面で劣っているので却下。(1~2秒ほどの速度低下が見られた)

disqusとLivefyreは、ほぼ同等の速度と機能を持っており、どちらにするか悩んだのだが、最終的に【コメントのSNS化】の面でdisqusに決めることにした。

また日本でも近年利用者が増えている現状と、アクティブユーザー数が約1億人ほど居る現状から、サービスが終了する見込みが無いこと。

disqusはwordpress以外のブログサービスでもjavascriptが使用できる環境ならば、導入できるので、国内での利用ブログも増えやすい。

その他のdisqusの概要と魅力については下記のまとめが参考になった。

disqus導入方法

disqusを導入する前にユーザー登録をする必要がある。

登録画面は英語なので、日本語訳で解説されたページをご紹介します。

ユーザー登録とdisqusサービス上での設定はこちらを参考にされるといいと思います。

各種ブログへの導入方法

各種ブログサービスでの使用方法です。

■アメブロ(アメーバブログ)での使用方法

※こちらの記事では、アメブロの使用テーマによって記事下に移動させる際のコードを変える必要がある場合があります。

■so-netブログでの使用方法

■bloggerでの使用方法

■Tumblrでの使用方法

wordpressでdisqusをより高速化させる方法

ユーザー登録とサイト登録が完了した状態からの解説です。

通常の導入方法だと、公式のpluginをインストールして、各種情報を入れるだけで、導入完了となるのですが、より高速化させたいので、私は違う方法をとりました。といっても手間はそんなに変わりません。

Disqus Conditional Loadのインストール

Disqus Conditional Load

Disqus Conditional Load

公式のプラグインを使うよりもこちらの方が動作が速いので、こちらをインストールします。
管理画面より【プラグイン】→【新規追加】→検索バーで【disqus】で検索。

インストールすると、管理メニューに【Disqus Settings】が追加されるので、設定をしていきます。

disqus設定項目

disqus設定項目

殆どの設定はデフォルトのままでいいので、必要項目だけを設定します。

【Advanced】の項目

API Application Public Key とAPI Application Secret Keyを記入してください。
これはAPI – Disqusのページで確認できます。

Advanced Settingsの設定は以下の様にしました。

Advanced Settingsの設定画像

Advanced Settingsの設定画像

一番動作が軽いのは【Load Disqus when】の項目を【On Click】にすればいいのですが、それだと、コメント欄を表示させるのにユーザーに1つのアクションを要求することになってしまうので、スクロールすると読み込みが開始される設定にしました。

設定を触ったのはここぐらいで、本当に簡単に導入することができます。

disqusを使う上で気をつけたいところ

disqusだけに限らず、コメントシステムには同様の事が言えるのだが、以下の記事が参考になった。

普段ブログを書いていたりする人にとっては、コメントの使い方等は十分分かっていると思うが、それ以外のユーザーにとっては、使い方が分からないこともある。

なので只単に設置しているだけでは、コメントを貰う機会を損失しているかもしれない。

disqusを設置して、【コメント欄の上部に簡単な説明文を表記】しておくのがベストだなと思います。(まだこのブログでは書いていないので記事書いた後にでも、書こうかな。)

こういった細やかな配慮もブログには必要だな、と感じた事例でした。

この記事が気に入ったら
『いいね』しよう!