スポンサーリンク

[WordPress, Cocoon] コメントへのハードルを下げるコメント欄カスタマイズ方法

ブログ環境
スポンサーリンク

どうも、よっさんです( ̄▽ ̄)

先日、本ブログに初コメントをいただきテンションが上がっております!
コメントありがとうございました(*´∀`)

コメントをもらった時は、ブログ始めてよかったなぁという嬉しさと、リアルにブログ見てくれる人がおるんや!という驚きがありました(正直な気持ちです)。

何よりブログを続けていく上で超重要なモチベーションが上がりました!\(^o^)/

これまでは、コメント機能はAkismetでスパムコメントだけ制御しておけばOKくらいのたんぱくな考えでしたが、これを機にコメント機能を見直してみました。

WordPressでブログを始めたばかりの人、コメントへのハードルを下げたい人の参考になれば幸いです!

スポンサーリンク

カスタマイズの方針

改めてコメント機能を見直してみると、「コメントを書き込むボタンをクリックしないとコメント欄が出ない」ことや、「項目が多くてコメントする気が失せる」など、デフォルト設定からカスタマイズした方が良い点がいくつか見つかりました。

現状はコメント投稿するのにワンクッション必要の図(Cocoon)

もちろん、ある程度の設定はスパムコメントの自動化を防ぐ役割であることは認識していますが、今欲しいのはブログに来てくれた人からの生のコメントなのです!

なのでコメント機能のカスタマイズによりスパムコメントが増えようが、今回は関係ありません(笑)ヽ(´エ`)ノ

てことで、今回は「コメントへのハードルを下げる」ということを主にカスタマイズしていきます。

カスタマイズ後のイメージ

↓これを、

カスタマイズ前

↓このようにカスタマイズしていきます。

カスタマイズ後

カスタマイズ詳細

常時表示(Cocoon)

※本項目はCocoonテーマをお使いの方限定です。他テーマをお使いの場合はスルーしてください。

先述の「コメントを書き込むボタンをクリックしないとコメント欄が出ない」という点に関しては、コメントへのハードルを下げるために、コメント欄を最初から見えるようにします。

この機能はWordPress自体の機能ではなく、Cocoonテーマ独自の機能なので設定から変更します。

[Cocoon設定 – コメント(タブ)] からコメント入力欄表示を、「ボタンで表示切り替え」から「常に表示」に変更します。

これによって「コメントを書き込むボタン」をクリックしなくても、最初からコメント欄が表示されるようになります。

あとはお好みでコメント入力欄見出しが「コメントをどうぞ」という素っ気ない文言になっているので「\気軽にコメントください!/」のように変更しました。

必須項目の任意設定と項目名変更

WordPressのデフォルトでは、「名前」と「メール」が必須項目となっているので、任意になるよう設定します。

コメントの必須設定を任意にする

[設定 – ディスカッション] から、コメントの投稿者の名前とメールアドレスの入力を必須にするのチェックを外します

これによって「名前」と「メール」が必須項目から任意項目になります。

不要な項目を非表示

これから編集する functions.php は入力間違いがあるとブログが表示されなくなる恐れがあるので、内容をコピーして保管したり、functions.php 自体をコピーすると安心です。

ここでは、「メール」と「サイト」の項目を非表示にして、「名前」と「cookie」説明文を変更していきます。

[外観 – テーマエディタ – functions.php] から、(できれば子テーマで)comment_form_default_fieldsフィルターフックを使った以下コードを追加します。

function remove_comment_form_content($arg) {
	/* 項目 非表示 */
	//$arg['author'] = '';	// 名前
	$arg['email'] = '';	// メール
	$arg['url'] = '';	// サイト
	//$arg['cookies'] = '';	// cookie保存コメント

	/* 項目名 変更 */
	$arg['author'] = str_replace(
		'名前',
		'名前(ハンドルネーム)',
		$arg['author']
	);
	$arg['cookies'] = str_replace(
		'次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。',
		'次回のコメントで使用するため自分の名前(ハンドルネーム)を保存する。',
		$arg['cookies']
	);
	return $arg;
}
add_filter('comment_form_default_fields', 'remove_comment_form_content');
よっさん
メールアドレスやサイトURLを聞きたいくらい親密になったら、TwitterでDMしてもらえばOKかな(*´∀`)

不要な文言を非表示

ここでは、「メールアドレスが公開されることはありません。* が付いている欄は必須項目です」、または「メールアドレスが公開されることはありません。」の文言を非表示にします。

[外観 – テーマエディタ – functions.php] から、(できれば子テーマで)comment_form_defaultsフィルターフックを使った以下コードを追加します。

function change_comment_form_note($args) {
	$args['comment_notes_before'] = '';	// コメント上の注釈(cocoonでは効かないのでCSSから変更)
	$args['comment_notes_after'] = '';	// コメント下の注釈
	$args['label_submit'] = '送信';		// コメント送信ボタンのテキスト(cocoonでは効かないので設定から変更)
	return $args;
}
add_filter('comment_form_defaults', 'change_comment_form_note');

通常であれば、$args['comment_notes_before']に空文字を入れれば、文言が空になり非表示と同じことになります。

ただ、Cocoonテーマだと$args['comment_notes_before']と$args['label_submit']は効かない様子。
Cocoonで設定できる項目だったりするので上書きされるのかも?

そういう場合はCSSで文言を非表示にします。

[外観 – テーマエディタ – style.css] から、(できれば子テーマで)以下コードを追加します。

.comment-note { display: none; }

これで不要な文言を非表示にすることができました。

最後に

今回のコメント欄のカスタマイズは、ブログに来てくれた人から出来るだけコメントしやすい環境にするためのものになります。

しばらくこのまま運営してみて、実際のスパムコメントの量と相談しながら、さらにカスタマイズしていこうかと思います。

さぁこれでコメント欄は埋め尽くされるはずです(笑)

皆さんの応援コメント、お待ちしております٩(๑´3`๑)۶

ブログ書いてる人

ロングライドが好物でブルベに興味津々です。
2020年10月にブログ開設、自転車・ダイエット・IT技術などについて掲載しています。

よっさんをフォローする
ブログ環境
スポンサーリンク
\よければシェアお願いします!/
スポンサーリンク
自転車健康生活

コメント

  1. 参考になりました

  2. 参考になりました2

  3. .comment-note { display: none; }

    .comment-notes { display: none; }
    こっちで消えた。