MENU
Category

【コピペで簡単】reCAPCHAロゴを消す方法!~Google公認~

アイキャッチ

アンチスパム対策のプラグインとして、「Akismet」もしくは「Invisible reCAPCHA」を使用している方は多いと思います。

「Akisemet」を商用サイトで利用する場合は無料版を使ってはいけないのですが、

アフィリエイト連携するブログでの無料利用も規約的に怪しいです。

使っている人も多くいるけどね・・・

サイトに広告・アフィリエイトリンクがある場合、製品・サービスを販売している場合、寄付・スポンサーシップを求めている場合、何らかの形で企業、非営利団体、教育機関に関連している場合、商用サイトとみなされます。

引用元:Akismet-Frequently asked questions

上記の理由により、当サイトではAkisemetではなくInvisible reCAPCHAを使用しています。

reCAPCHAはGoogleが無料で提供しているサービスのため、アフィリエイト連携をするブログでも気兼ねなく使用することができます。

かといって、reCAPCHAは重たい

そして何より表示されるロゴが邪魔!!

邪魔!!!

reCAPCHAかぶってる

超邪魔!!!

今回は、このreCAPCHAロゴを非表示にする方法を紹介します☆

目次

そもそも非表示にしてよいのか?

結論から申し上げると、無断でreCAPTHAロゴを非表示にすると規約違反になってしまいます。

逆に言えば、Googleが提示するルールを守れば非表示にすることが可能です。

私が知る限り、reCAPTHAロゴを非表示にする方法は

  • プラグインを使う
  • function.phpにコードを追加
  • Google公認の方法

がありますが、今回はもちろんGoogle公認の方法を紹介していきます!

Google公認の方法

まずはGoogleのQ&Aサイトにアクセスし、該当の個所までスクロールします。

ざっくり訳すと、

reCAPCHAのロゴ消したいっす。いいっすか???

こいつらのコード(①)書いてくれたら消してもええで!
消すときはこのCSS(②)使ってな!!

っていう感じです。

では具体的にやっていきましょう!

GoogleのHPに記載されているコードをサイトに表示する

まず「Google指定のコード」をサイトに表示していきましょう。

指定のコードをコピーする

先程のサイトにも載っていますがますが、こちらに同じものを記載しておくのでコピーしてください。

・オリジナル(英語)版

This site is protected by reCAPTCHA and the Google
    <a href="https://policies.google.com/privacy">Privacy Policy</a> and
    <a href="https://policies.google.com/terms">Terms of Service</a> apply.

・日本語版

このサイトはreCAPTCHAによって保護されています。
   Googleの<a href="https://policies.google.com/privacy">プライバシーポリシー</a>と
   <a href="https://policies.google.com/terms">利用規約</a>が適用されます。

お問い合わせページの下に貼り付ける

コピーができたら、それをお問い合わせページに貼り付けていきます。

STEP
固定ページ > お問い合わせ > 編集
STEP
【お問い合わせ】のショートコードの下にHTMLブロックを追加する

カスタムHTMLブロックは、
  + > すべて表示 > カスタムHTML
で追加することができます。

STEP
カスタムHTMLブロックに先程のコードを貼り付ける

プレビューで確認する

しっかり表示されています!!

この時点ではreCAPCHAロゴはまだ表示されています。

追記

<center><small> 指定のコード </small></center>

というふうに挟んであげると体裁が良くなります。

・オリジナル(英語)版

<center><small>
 This site is protected by reCAPTCHA and the Google
    <a href="https://policies.google.com/privacy">Privacy Policy</a> and
    <a href="https://policies.google.com/terms">Terms of Service</a> apply.
</small></center>

・日本語版

<center><small> 
このサイトはreCAPTCHAによって保護されています。
   Googleの<a href="https://policies.google.com/privacy">プライバシーポリシー</a>と
   <a href="https://policies.google.com/terms">利用規約</a>が適用されます。
</small></center>

完成例

ロゴを非表示にするCSSをサイトに記述する

次に、実際にreCAPCHAロゴを非表示にしていきましょう。

CSSをコピーする

先程のサイトに載っていますがますが、今回もこちらに記載しておきます。

.grecaptcha-badge { visibility: hidden; }

CSSを貼り付ける

現在WordpressにCSSを書き込む場所は2種類ありますが、

今回書き込むコードは短いこともあり,カスタムCSSを使う方法をおすすめします。

うまくできなかった場合やこだわりがある方は、スタイルシートの方法も検討てみてください。

STEP
外観 > カスタマイズ
STEP
追加CSSをクリック

どのテーマでも一番下付近にあると思います。

STEP
CSSを貼り付けて公開する

もともとなにか書いてあれば、最後の行で大丈夫です。

プレビューで確認する

おお!

消えている!!

消えているぞ!!!

【reCAPCHAロゴを消す方法】まとめ!

  • GoogleのHPに記載されているHTMLコードをお問い合わせフォームに表示する
  • ロゴを非表示にするCSSをサイトに記述する

Invisible reCAPCHAを使っている方、ぜひ1度試してみてください!

アイキャッチ

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね☆
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

目次
閉じる