コメント欄の画像認証を設定しよう!【画像認証 編】

2018年10月29日ブログ管理Luxeritas,Luxeritas内部カスタマイズ,ブログ管理,初心者,画像認証

画像認証ヘッダー

ぐず夫
ぐず夫
今日もええ天気やな。このままどっか飛び出して行きたい気分や…。

トリ師匠
トリ師匠
現実逃避か。今日はちょっと目新しい Luxeritasコメントの画像認証の設定についてイジってみるで!
ぐず夫
ぐず夫
(ホンマ、面白ないトリやで)

ということで、今回はLuxeritasのカスタマイザー機能を使ってコメントの「画像認証」について設定をしてみたいと思います。

画像認証 機能

内部カスタマイズ選択

トリ師匠
トリ師匠
画像認証はブログのコメント欄にスパム防止用の画像認証を設置する機能じゃ。意外に簡単やでスパムに悩んでる人はオススメじゃの。なら管理画面から「Luxeritas」「カスタマイズ」を選択して、「画像認証」タブを選択じゃ!

① 画像認証の設定

画像認証に用いる種類を選択します。

【 Google reCAPTCHAによる画像認証を使用する 】
Googleが提供しているreCAPTCHAによる画像認証を使用する。

【 Securimage PHP CAPTCHAによる画像認証を使用する 】
PHPの画像認証ライブラリ「Securimage」による画像認証を使用する。

【 画像認証を使わない 】
画像認証を行わない。

トリ師匠
トリ師匠
スパムに困ってる人は導入を考えてみるとええで。ちなみにreCAPTCHAはGoogleの登録が必要で、SecurimageはLuxeritasの基本機能として使用できるで!

② Google reCAPTCHAの設定

Google reCAPTCHAを使用し画像認証を行う設定をします。

トリ師匠
トリ師匠
でもその前に、まずはreCAPTCHAの登録が必要や。持ってない人は下のEx.reCAPTCHAの登録を先にチェックしてな!

【 Site key 】
【 Secret key 】

Google reCAPTCHAから提供されたキーを設定する機能。

トリ師匠
トリ師匠
これらキーを設定するだけで使えるようになるで!
便利すぎて吐きそうやわ。

【 テーマ 】
【 サイズ 】

画像認証に関する見た目を設定します。「ダーク」は黒背景、「コンパクト」は通常より小さいサイズで表示される。

「例:テーマ(ライト)、サイズ(ノーマル)の場合」
reCAPTCHAの表示例

トリ師匠
トリ師匠
全部の画像は取らんかったけど大した違いはないで好きなの設定したってな!

【 認証タイプ 】
画像認証、音声認証を選択します。

トリ師匠
トリ師匠
「画像で指定されたものを選択する」か、「音声を聞いて文字を入力する」か選択できるで! ここはGoogle側でちょいちょい仕様変更されるで動作が変わるかもしれんから気をつけてな!

③ Securimage PHP CAPTCHAの設定

【 画像サイズ(幅:高さ) 】
画像認証に用いる画像のサイズを設定します。

【 文字数(最小-最大) 】
認証に用いる文字数を設定します。表示文字数は設定数内にてランダム表示。

【 文字種 】
認証に用いる文字の種類を設定します。

【 文字サイズ 】
認証に用いる文字のサイズを設定します。

【 画像の色 】
認証に用いる文字色と背景色を設定します。

【 文字の歪み 】
認証に用いる文字の歪みを設定します。

【 背景のノイズ 】
認証に用いる画像に含めるノイズの粗さと色を設定します。

【 見えにくくするために画像上に引く線の数 】
認証文字を読みにくくするために線を入れる機能。指定した色と本数で認証文字を隠します。

トリ師匠
トリ師匠
さすがに全パターンのせられんで、例で画像をのっけとくの。

Securimage表示例・画像サイズ 170:45
・文字数 4-6
・文字種 英数字(小文字)
・文字サイズ(バー中間)
・画像の色(文字色gray)
 (背景色navajowhite)
・文字の歪み(バー中間)
・背景のノイズ(バー中間)
・ノイズの色 gray
・線の色(3本、whitesmoke)

トリ師匠
トリ師匠
色々自由やでお好みに設定したってな!

Ex.Google reCAPTCHAの登録

reCAPTCHA取得ヘッダー

トリ師匠
トリ師匠
Google reCAPTCHAを使うには、事前の登録が必要じゃ。まずはGoogleのアカウントが必要やで、持ってへん方はアカウントを作成したってな!

◆Googleアカウントの作成はこちらを参照!

トリ師匠
トリ師匠
アカウントが作成できたら、次はreCAPTCHAの設定や。まずはこちら(外部サイト)のページへ移動するで! そしたら右上の「My reCAPTCHA」をクリックじゃ!

取得イメージ1

トリ師匠
トリ師匠
するとreCAPTCHAの新規設定画面が表示されるでの、任意の名前を「Label」に入力し、「Checkbox」(画像認証のチェックボックス)を選択して、DOMAINSの項目に、「自分の独自ドメイン」を記入じゃ!

取得イメージ2

トリ師匠
トリ師匠
次は利用規約の確認じゃ。英語が分からんでも日本語翻訳なんかを駆使してちゃんと読むんやで! OKやったら「Accept the reCAPTCHA Terms of Service(規約に同意する)」にチェックを入れて、「Register(登録)」を選択じゃ。これでreCAPTCHAを使えるようになるで!
「Send alerts to owners(オーナーにアラートを送る)」は自由に選択したってちょ。

Keyの確認

トリ師匠
トリ師匠
次は「Site key」「Secret Key」の確認じゃ。Keysの項目に2つとも表示されるで、②の設定の中に記述したってな。導入の手順はこれで終了じゃ!

画像認証の設定を終えて…

トリ師匠
トリ師匠
そろそろカスタマイザーを使った内部設定も終わるの。
ぐず夫
ぐず夫
ホンマか! それでワシは自由か!
トリ師匠
トリ師匠
でも残念。まだ管理機能も残ってるわ。
ぐず夫
ぐず夫
一旦喜ばせて落とす。鬼のやり方やで…

以上で画像認証編の内部カスタマイズを終了します。

ではまた次回!


この記事はワシが書いたで !!
ぐず夫ちゃん

誰もが簡単にサイトを作れたらええな!と思ってブログを始めたで。やり取りはふざけてるけど、中身はいたって真面目やから堪忍な! 要望はTwitterで受け付け中♪

オリジナルグッズもあるでコチラから!

Posted by ぐず夫