fbpx

割引特典あります→詳細はこちら

【朗報】なんとtool +がWordPress対応になり、ワンタッチ投稿できるようになりました!(3/10)

Luxeritas(ルクセリタス)でコメントしやすい環境を作る方法

前回、まとめブログ運営においてコメントの重要性はお伝えしました。まだ読んでいない方はこちらの記事を読んでください。

いかに読者がコメントをしやすい環境を作るか、WordPressでのサイトはこれが課題になります。

私が行っているコメント対策を説明します。

スポンサーリンク


当サイト限定割引特典あります→詳細はこちら

ディスカッション設定

WordPressのディスカッション設定について説明します。

コメントを承認制にしない

WordPressの初期設定でコメントは手動承認制になっています。これを変更します。

ダッシュボード→設定→ディスカッションと進みます。

コメント表示条件のチェックボックスを2つとも外します。

これでどんなコメントでも表示されるようになります。

そのうち外国人のコメント(スパム)がよく来るようになりますが、コメントブラックリストの設定をしたらこなくなります。

この場合、コメントに「a」という文字が入るとコメントが自動でゴミ箱行き。

名前とメールアドレスは不要

コメントの投稿者名とメールアドレスは不要です。

ダッシュボード→設定→ディスカッションと進み、他のコメント設定からチェックを外しましょう。

コメントへのジャンプボタンを作る

ルクセリタスはコメントまでが遠いです。

記事下にすぐあれば良いのですが、関連記事があります。(回遊率を上げるためだと思います。)

なるべく読者がコメントしやすいようにコメントまでのジャンプボタンを作りましょう。CSSを編集しますが、ルクセリタスなら私と同じようにやれば問題なく作れます。

まずはジャンプボタンのデザインを決めます。毎度おなじみのサルワカさんのサイトから探しましょう。

今回もシンプルにこのデザインにします。

子テーマの編集からスタイルシートの追記

ダッシュボード→Luxeritas→子テーマの編集→style.cssに進みます。

そして、CSSの部分をコピペします。

.btn-square {
display: inline-block;
padding: 0.5em 1em;
text-decoration: none;
background: #668ad8;/ボタン色/
color: #FFF;
border-bottom: solid 4px #627295;
border-radius: 3px;
}
.btn-square:active {
/ボタンを押したとき/
-webkit-transform: translateY(4px);
transform: translateY(4px);/下に動く/
border-bottom: none;/線を消す/
}

せっかくなので、:activeを:hoverに変更してみました。そして、コピペした結果がこれです↓

これでジャンプボタンのスタイルシートは完成しました。次は記事下にジャンプボタンを設置します。

記事下ウィジェットにジャンプボタンを設置

外観→カスタマイズ→ウィジェット→記事下ウィジェットに移動します。(記事下ウィジェットは記事ページを表示している状態じゃないと出現しません。)

そして、記事下ウィジェットにテキストを追加します。

先ほどのサルワカさんのサイトからhtmlのコードをコピペします。(テキストモードの方にコピペしてください。)

これでボタンが表示されているはずです。

こんな感じです。

あとは、href="#"をコメントへのリンクにすれば大丈夫です。

これも検証モードで調べたら簡単にわかります。

検証モードについて書いてます。

divタグが#comments.gridとなっています。divタグは位置を表すのでここに飛ぶようにします。

href="#comments“と記述します。.gridまで書くと、うまくジャンプしませんでした。

最後にBUTTONだとおかしいので、「コメントする」みたいな感じにすると良いでしょう。BUTTONを書き換えましょう。

どうでしょうか?これでジャンプボタンが設置できたはずです。

メールアドレス、ウェブサイト入力欄を消去

WordPressは初期状態で、コメント欄に名前・メールアドレス・ウェブサイトの入力欄が表示されています。

コメントする際、不要な情報は、コメントを入力するのに面倒なので、名前以外(メールアドレスとウェブサイト)は消去しましょう。

消去する部位の調べ方は、検証モードで簡単にわかります。ここでは省略します。

やり方はこちらに書いてますので、参考にどうぞ。

以下のコードを「ダッシュボードメニュー」→「Luxeritas」→「子テーマの編集」→「スタイルシート」に追記してください。

p.comment-form-email {
display: none;
}

p.comment-form-url {
display: none;
}

これでメールアドレスとウェブサイトの入力欄が消えます。(これはルクセリタスのみです。)

noneというのがCSSでは見えなくするコードです。実際は見えなくなるだけで読み込まれています。

まとめ

私が思いついたコメントのしやすい環境設定を書きました。

また何か良い施策を思い出したら追記します。

CSSの編集は、とりあえず「自分のやりたいこと」を実装できれば良いと思っているので、私のやり方は専門家からすれば多分イマイチな方法だと思います。

上記コードをコピーする際は、それをわかった上で使ってください。

割引特典あります→詳細はこちら