【WordPress】コメント機能強化プラグイン「comments – wpDiscuz」の設定備忘録

WordPressのコメント機能強化プラグイン「comments – wpDiscuz（version7）」の紹介＆各種設定の備忘録記事です。

デフォルトのコメントを拡張/強化することでブログ上でのコミュニケーションが楽しくなりそうなプラグインです！

「wpDiscuz」について

「Comments – wpDiscuz」はWordPressの標準コメント機能を拡張/強化するプラグイン。

かなり多機能な基本機能を無料で利用することができる。さらに追加の機能が必要な場合は有料のアドオンも用意されている。

作者はフォーラムプラグイン「wpForo」なども作っているgVectorsチーム。

インストール方法は、他の一般的なプラグインと同様に「管理画面→プラグイン→新規追加→wpdiscuzで検索→インストール」でOK。

Comments – wpDiscuz

Advanced AJAX-powered WordPress comments plugin with live commenting, comment voting, inline feedback, social login, cus...

ja.wordpress.org

見た目はこんな感じになる

コメントスレッド

ビフォー

アフター

コメントフォーム

ビフォー

アフター

【wpDiscuz】コメント投稿機能のテストページ

コメント投稿機能のテストページです。 WordPressのコメント機能を拡張するプラグイン「Comments – wpDiscuz」を導入してみたので、各機能を色々とチェックしています。

tonahazana.com

2020.08.22

wpDiscuz 7 Demo - wpDiscuz - WordPress Comment Plugin

Thank you for trying wpDiscuz! wpDiscuz 7 is a revolutionary perspective on the commenting world! This version is mostly...

wpdiscuz.com

公式サイトにコメント投稿をテストできるデモページがあります。 コメント投稿の感じを事前に試しておくのもいいでしょう。

各機能の設定

設定項目がすごく多いので網羅はしていません。自分で設定・確認した部分だけになります。

一般設定

General Setting。

Enable wpDiscuz on Home Page

wpDiscuzを有効化する設定。

Use WordPress native AJAX functions

使用するAjaxの指定。

この設定を有効にするとWordPressに標準搭載されている「admin-ajax.php」、無効にするとwpDiscuzの独自のajax.phpを使用する。

ヘルプによると標準のajaxよりwpDiscuzの方が高速らしいので、無効に設定してwpDiscuzの方を使用している。

高速化設定

JavaScriptとCSSを結合/縮小化する設定。

読み込みを高速化できるので、とりあえず有効でいいと思う。テーマやプラグインとの衝突があるようなら無効に。

グラバターの画像をキャッシュする設定も読み込み速度を上げたいなら有効化しておくといいかも。

その他

コメントフォームの設定

「Comment Form Settings」。

コメントフォームのセッティング全般。

Comment Form View

コメントフォームを初期表示で折りたたむか展開するかの設定。

「collapse」で折りたたみ、「expanded」で展開。

折りたたみ状態で表示されるのは、最低限のテキストエディタのみ。

Load Rich Editor

リッチエディタの適用設定。

「モバイル＆デスクトップ」or「デスクトップのみ」or「無効」。

太字・リスト・リンク・引用など11種類を自由に選択できる。

Google reCAPTCHA

スパムボット対策「Google reCAPTCHA」の設定。

reCAPTCHAは、「Version2」が無料、「version3」は有料のアドオンが必要となっている（※wpDiscuzの「ver7.0.0」時点）。

認証を追加しないとスパムコメントが大量に投稿されたりする可能生もあるので、できれば導入したいところ。

「reCAPTCHA」側の設定（サイトキー/シークレットキーの登録）に関しては、下記関連記事と同じ要領でOK！

【WordPress】スパムボット対策「reCAPTCHA v3」をプラグイン「Invisible reCaptcha」で簡単に導入する方法

スパムボット対策の「reCAPTHA v3」をWordPressに簡単に導入する方法の備忘録＆紹介記事です。 WordPressプラグイン「Invisible reCaptcha」を使用して「reCAPTHA v3」を導入してみました。「ログイン・コメント・問い合わせ（Contact Form 7）」などの各フォームを一括で手軽に保護できます！

tonahazana.com

2020.06.07

サイト登録の設定で「reCAPTCHA v2」の「私はロボットではありません」チェックボックスを選びます。

ユーザーの認証とプロフィール

「User Authorization and Profile Data」。

全部オフにしているので省略。

SNSのログインとシェアボタン

「Social Login and Share」。

「SNSアカウントを使ったログインボタン」＆「SNSシェアボタン」の設定。

SNSアカウントでログインしてコメントを書き込むことができる。TwitterやFacebookにログインしっぱなしでブラウジングしているなら結構便利な機能。

ただし、SNS別にアカウントやシークレットキーなどを取得する必要があるため設定が大変。

また、デフォルト設定ではログイン・ログアウト時に「wp-login.php」にリダイレクトするため、ベーシック認証を掛けている場合はURLの変更などが必要になる。

とりあえずSNSログインは無効。Twitterのシェアボタンだけ有効にしている。

評価ボタン

「Article and Comment Rating」。

記事に対する評価ボタンを表示する設定。

星☆マークの5段階評価で表示場所と色の指定ができる。

コメントフォームの上に設置した場合

上記画像の「3」と表示されている記事への評価値にマウスオーバーすると、何人が投票したのかも表示される。

この記事への評価ボタン設定は、同時に使用できない2種類がある。一つは上記したコメントに依存しないタイプ、もう一つがコメント（フォーム）に付属するタイプのもの。

後者だと下記画像のようにコメントフォーム内に評価ボタンが表示される。この設定はフォームの設定で行う。この設定のほうが記事に設置する評価ボタンより優先される。

記事への評価機能は、コメントフォームに埋め込んで、こちらの方は無効にしている。

Comment Thread Displaying

「Comment Thread Displaying」。

コメントスレッドを表示・読み込みする際の設定。

コメントリストの読み込み方法

「Comment List Loading Type」。

「Initiate AJAX loading after page」を選択。

「Load with page」だとページの表示速度に影響がでやすいと思われる。

ページの表示速度で考えると、「ロード後の読み込み」or「コメント表示ボタン」と思われる。とりあえずロード後の読み込みに設定している。

コメントのページネーションタイプ

「Comments Pagination Type」。

コメントの分割表示（ページネーション）の設定。

なるべく処理が軽くなるように、ページがスクロールされた際に読み込む「Lazy Load（遅延読込）」を選択している。

この設定は、ワードプレス側のディスカッション設定の影響を受けるようなのでヘルプページで要チェック。

Comment Form Settings - wpDiscuz - WordPress Comment Plugin

wpDiscuz comment forms can be found in Dashboard > wpDiscuz > Forms admin page. By default, there is one Default Form. C...

wpdiscuz.com

フィルターボタン

コメントを条件にしたがって並び替える機能。全て有効にしている。

コメントスレッドの機能

「Comment Thread Features」。

スレッドのレイアウト

コメントスレッドのレイアウトは3種類から選択可能。

設定は後述するフォームの設定で行う。

コメントの投票/評価ボタン

コメントを評価する「いいねボタン」的なもの。高評価・低評価を別々に表示したりもできる。

「Comment Voting Result Mode」は、「total cout」で総数、「separate count」で個別（プラスとマイナスを別に集計）に評価を表示。

ダウン（ディスライク）の表示有無、ゲスト（非ログインユーザー）に投票を許可するかなども設定可能。

スタイルと色

「Styles and Color」。

スタイルと色を設定できる。

Font Awesomeのロード

「Load Font Awesome css lib」。

テーマや他のプラグインでFont Awesomeをロードしていない（あるいは古いバージョン）場合は、有効化しないとアイコンが正常に表示されない。

カスタムCSSコード

初期値の

.comments-area{width:auto;}

だと、余白ありで横幅100％で表示される。

通知/購読とユーザーフォロー

「Subscription and User Following 」。

Eメールアドレスを登録しておくことで、特定の記事にコメントが投稿された際や、自分のコメントが承認・レスが付いたときに通知を受け取ることができる購読設定。

各表示を日本語化しないと分かりにくいですなあ。

コメント承認時の通知

「Notify comment author once comment is approved」。

コメントが承認された時にメールで通知する設定。

コメント承認時の通知（初期設定状態）

承認時のメール通知分は初期設定だと英語で分かりにくいので、「管理画面→Phrases→Email→Comment approved」で編集（翻訳）した方が分かりやすくなると思う。

通知の確認・承認

メールアドレスが登録された際に確認・承認メールを送信する設定。

いたずらでメールアドレスが登録されるのを防ぐために上記設定は有効にしておいたほうが良いと思われる。

有効にすると下記のような「通知設定にメールアドレスを登録しました？」と確認する（承認を求める）メールが該当アドレスに送信される。

通知登録の確認メッセージ（初期設定状態）

こちらも「管理画面→Phrases→Email」の項目で編集（翻訳）した方が分かりやすくて親切だと思う。

通知設定のドロップダウン表示

通知条件を選択する表示の「Subscription types in Subscription Bar drop-down」は、「Both」で両方を選択。

記事に新しいコメントが投稿された場合と、自分のコメントが承認された際に通知を選択できるようにする。

ユーザーラベルとバッジ

「User Labels and Badges」。

特定のユーザーコメントにラベル/バッジを表示する設定。

とりあえず初期値で運用。管理者/著者のコメントが分かりやすくなるので有効化しとくといいかも。

コメント管理

「Comment Moderation」。

コメントの再編集、スレッドのピン留め、1人のユーザーが書き込めるコメント数の上限、などを設定できる。

コメントの再編集関連

投稿後のコメントを再編集できる機能。

あまり必要性を感じないので無効にしている。

スレッドのピン留め

「Stick Button – Stick a comment thread」。

特定のスレッドを一番上に表示できる。管理者とモデレーターだけが使用可能。

とりあえず有効にしている。

スレッドを閉じる

「Close Button – Close a comment thread」。

特定のスレッドを閉じて、それ以上返信できないようにする。こちらも管理側の機能。

ユーザーあたりのコメント数制限

「Limit Comments per User」。

1ユーザーが投稿・サイト全体に投稿できるコメントの数を制限する設定。

スパム対策の一環にもなりそう。だけど、特に必要性を感じないので無効にしている。

コンテンツと添付ファイル

「Comment Content and Media」。

コメントのテキストの最小/最大数の指定は、添付するファイルの設定。

URLの自動画像変換

「Image Source URL to Image Conversion」。

コメントフォームに入力された画像のURLを、画像として読み込んでコメントに表示する機能。

いわゆる”直リンク”。便利そうに思えるけど利用規約などで禁止されている場合も多いし、特に言及されていなくても相手サーバーの負担になる可能生も高いので無効が無難かも。

ショートコードを有効にする

「Enable WordPress Shortcodes in Comment Content」。

テーマやプラグインで使っているショートコードをコメントでも使えるようにする設定。

動作の遅いショートコードを埋め込むと、読み込み速度に影響を及ぼす可能生があるとのことで、無効にしている。

「続きを読む」の設定

「The number of words before breaking comment text (Read more)」。

コメントの文字数が多い場合に、何文字で分割するか（「続きを読む」を表示するか）の設定。

「0」だと分割しない。

とりあえず分割なしにしている。長文でやり取りすることが多いなら分割するのもいいかな。

添付ファイルの設定

「File Attachment Settings」。

添付ファイル（主に画像）のアップロード設定。ファイルタイプ/ファイルサイズ/サムネイルの生成などを設定できる。

一つのコメントに添付できる画像は1つまで、2つ以上は有料アドオンの機能となっている模様。

「Enable Lightbox for Attached Images」は、ポップアップ風にモーダルダイアログで画像を拡大表示する設定。

このアップロード機能は面白いけど難がある。アップロードするファイルそのものは、コメントの承認やReCaptchaなどのセキュリティ前に実施されてしまうので、イタズラでファイルだけがアップロードされてしまうことがある（された 🙁 ）

ゲストユーザーにはアップロード機能を許可しない事も可能だが、そのためには各種ログイン設定が必要になるため敷居が高い。

【wpDiscuz】コメント投稿機能のテストページ

コメント投稿機能のテストページです。 WordPressのコメント機能を拡張するプラグイン「Comments – wpDiscuz」を導入してみたので、各機能を色々とチェックしています。

tonahazana.com

2020.08.22

テストページのコメントに画像を添付しているので確認できます（※いたずら投稿が発生したため画像の添付・アップロード機能は無効にしました）。

コメントに画像を付け加えたい場合は、アップローダーサイトなどへのリンクでも代用はできますね。

ライブコメントと通知

「Live Commenting and Notifications」。

コメントフォームにスクロールできる「comment Bubble」や、リアルタイムで新コメントを通知する機能などの設定。

コメントバブル

「Comment Bubble」。

コメントフォームに一発で飛べる、スクロールに追従するボタンを表示する。

CSSでbottom値を変えて上げるといいかも

表示箇所は3箇所から選択可能。

表示位置をCSSでカスタマイズしたり、メディクエリで表示を振り分ければ結構使えると思うが、とりあえず無効。

表示される位置を注意しないとアドセンスの規約違反（広告の上に表示される/被る）になる可能生もある。

ライブアップデート

Live Update関連の設定は、サーバーに掛かる負担が油断ならないのと、うちのコメント量的に必要性が低いと思われるので全て無効。

コメントが頻繁に書き込まれるサイトならコミュニティが活発になっていいかもしれない。

インラインコメント

「Inline Commenting」。

投稿記事の特定の箇所に簡易的なフォームを設置してコメントを投稿でき、返信をその場所とコメント欄に表示できる機能。

このインラインコメントは、設置した箇所毎に個別のIDが割り振られ、使い方に癖があったので注意したい。

設定の癖（旧情報）

例を上げると、「インラインコメントを設置した後、ページの公開・更新より先にプレビューしたりすると、そのインラインコメントは機能しない」。公開済みの記事に追記する形での更新では正常に機能するという状態だった。

プレビューによって発生していたあたり、個別のインラインコメント設定に割り振られるIDorURLが、本来の投稿ページの正規URLではなくプレビューしたページなどに紐づいてしまっていたのかも？詳細不明。

同一ページに複数設置する場合

上記環境での投稿編集中、ブロック「Feedback Shortcode」でランダムに生成されるはずのインラインコメント用IDが、エディタの同一セッション中だと、コピーではない複数のブロックで繰り返し同じIDとなることがあるようだった（詳細な発生条件は不明）。

「1つ目を設置」→「下書き保存or更新」→「編集ページ自体を再読み込み（F5）」→「2つ目を設置」のような手順でセッションをリセットしながらだと、違うIDが生成されていた。

各インラインコメントは個別のIDで管理されているので、IDが被ると同じものとして扱われる。

対策として「wpdiscuz-feedback id=”○○○○○○○○○○”」のid部分を手動で変更できる模様。IDには10桁までの文字列を使用できるらしい。

IDが被らなければいいので、10桁でランダム生成するなり、適当に連番を当てたりすればいいかもしれない。

Multiple Comment Boxes in article Showing Duplicated Questio...

Go check out that article that I linked to above. In the article, I have placed several opportunities for readers to sha...

wpdiscuz.com

reCAPTCHAについて

インラインコメントへの投稿にはreCAPTCHAが適用されない点に注意。コメントそのものの承認設定は通常通り適用される。

【wpDiscuz】コメント投稿機能のテストページ

コメント投稿機能のテストページです。 WordPressのコメント機能を拡張するプラグイン「Comments – wpDiscuz」を導入してみたので、各機能を色々とチェックしています。

tonahazana.com

2020.08.22

[wpdiscuz-feedback id=”mgdojehxcp” question=”インラインコメントのテストです！” opened=”0″]インラインコメントはこんな感じです[/wpdiscuz-feedback] ←のアイコン部分をクリックで動作します。

フォームの設定

「管理画面→wpDiscuz→Forms→Default Form（初期状態なら）→編集」からアクセス。

設定を変えたあとは「更新」ボタンクリックで変更を適用。

基本設定

フォームの入力欄

「Comment Text Field」の部分。

ドラッグ＆ドロップでラベルを移動させて並び順を変えられる。

鉛筆アイコンで内容を編集できる。初期状態だと「名前・メール」の入力が必須になっているので、「Field is required」のチェックを外すことで解除できる。

下の方の緑色のプラスボタンから設置可能な機能を表示できる。コメント投稿時の同意チェックボックスや、記事への評価ボタンを設置したりもできる。

詳しくは公式のヘルプに載っているのでチェック！

Comment Form Builder - wpDiscuz - WordPress Comment Plugin

wpDiscuz comment forms can be found and managed in Dashboard > wpDiscuz > Forms admin page. By default, there is one com...

wpdiscuz.com

フレーズの設定（日本語化）

「管理画面→wpDiscuz→Phrases」からアクセス。

サイトのフロント画面（ユーザーが見る画面）に表示される各項目の語句、通知用Eメールの文言など、大部分を変更することができる。デフォルトは英語だが、ここで日本語化が可能。

コメントフォームの入力欄やボタンの語句は、「管理画面→wpDiscuz→Form」の方で設定を変更できる。

WordPress › エラー

lv73.net

管理画面の設定項目なども含めた全体の翻訳/日本語化の場合は、別途翻訳ファイルを作成/利用する。有料販売されているものもある模様。

poEdit で翻訳ファイルを作る

翻訳ファイル作成の 3 ステップ 先日、プラグインとテーマのローカライズについて主にプラグインやテーマの開発者の視点に立って書きましたが、今度は翻訳をする人の立場で見てみたいと思います。 gettext の翻訳ファイル作成をサポートするツー...

miyoshitakayuki.com

ツールの設定

「管理画面→wpDiscuz→Tools」からアクセス。

各種設定とフレーズのインポート・エクスポート、コメントの再生成やコメントデータの最適化ができる。

備忘録・メモ

【WordPress】ページキャッシュプラグイン『LiteSpeed Cache（Version3）』の設定方法

WordPressのページキャッシュプラグイン『LiteSpeed Cache（ライトスピード キャッシュ）』のメジャーバージョン3以降の設定・使い方をまとめた備忘録＆紹介記事です。 2020年4月にメジャーバージョンが「2」から「3」に更新され、機能の追加やUIの変更があったので、設定をもう一度見直してみました。

tonahazana.com

2020.06.29

参考サイト

wpDiscuz 7 Documentation - wpDiscuz - WordPress Comment Plugin

wpDiscuz is an AJAX realtime comment system with an ability to create custom comment forms and fields. Designed to super...

wpdiscuz.com

WordPressコメント拡張プラグインDisqus VS wpDiscuzを比較検証！

WordPress, 日本語化翻訳ファイル, 無料プラグイン Wordpressコメントプラグインの比較 プラグイン名 インストール数 レビュー数 レビュー平均点 Disqus Comment

wpno.jp

wpDiscuzの日本語訳 - LV73.net

ネット上にあった日本語化のpo/moファイルは古く、設定を全て翻訳した物がなかったので記事にした。設定時の参考

lv73.net

Twitter Developer 登録からアプリケーション作成まで〜 - Qiita

Twitterで自動投稿BOTを自作したいとか考えた時に、TwitterAPIを呼ぶにはTwitterのDeveloper登録して、アプリケーションを作成して、各種トークン,APIキーを発行するという手順が必要となってきます。 今回初めて登...

qiita.com

WordPressのメール送信機能（wp_mail関数）でReturn-Pathとenvelope-fromを設定したい – mds tech blog

WordPressのContact Form 7プラグインなどでメールを送信する場合、wp_mail関数経由でPHPMailerが利用されます。 この関数は簡単にメール送信できて便利なのです...

tech.m-denkosha.co.jp

WordPressプラグイン Contact Form 7 で送信するメールに Return-Pathを設定する方法 | ウェブマガジン カミナリ | 鳥取県米子市のホームページ制作・広告代理店・デザイン

kaminarimagazine.com

まとめ

wpDiscuzは多機能で面白いのですが、設定・導入の難易度はやや高いと思いました。お手軽・簡単って感じではないですけど、色々出来て楽しい！

しかし、それもこれも記事にコメントが投稿されてこそですから、もっといい記事をたくさん投稿しないとなあ(；´∀｀)

でも、コメント機能が充実していたらコメントしてくれる読者の割合が増えるかもしれないので、その点はちょっと明るい兆しになるかも！

まだフレーズの設定もあまり出来ていないので、ぼちぼちやっていこうかと思います。

自分でもよく分かっていないところがあるので、「ここはこうした方がいいよ」とか「こんな方法もあるよ」ってのがあったら、是非教えてください！

【wpDiscuz】コメント投稿機能のテストページ

コメント投稿機能のテストページです。 WordPressのコメント機能を拡張するプラグイン「Comments – wpDiscuz」を導入してみたので、各機能を色々とチェックしています。

tonahazana.com

2020.08.22