2026年8月13日

2026年8月13日

WordPressのTurnstile(Cloudflare)の設定方法

はじめに

Cloudflareはウェブセキュリティやパフォーマンスを向上させるためのツールを提供しています。その中でもTurnstileはCAPTCHA(キャプチャ)機能として、不正アクセスからの保護とスパムコメント対策に効果があります。WordPressサイトでTurnstileを使うことで、より高度なセキュリティを実現することができます。

症状・背景

この記事が必要になる主な場面:

  • ブログやフォーラムなどでスパムコメントが増えた場合
  • サイトへの不正アクセスやDDoS攻撃の可能性を感じた場合
  • クロール対策としてCAPTCHA機能を導入したい場合

手順・設定方法

ステップ1: CloudflareアカウントとTurnstileのセットアップ

# ログイン後、設定ページからTurnstileに移動します。
https://dash.cloudflare.com/:account_id/turnstile/

# Turnstileを有効にするには、"Enable Turnstile"ボタンをクリックします。

ステップ2: WordPressサイトへのTurnstileの統合

# WordPressテーマのfunctions.phpファイルを開きます。
nano wp-content/themes/:your-theme/functions.php

# 以下のようなコードを追加してTurnstileを有効にします。
function add_turnstile_to_forms() {
    echo '<div id="cf-turnstile" data-sitekey="YOUR_SITE_KEY"></div>';
}
add_action( 'wp_head', 'add_turnstile_to_forms' );

# TurnstileのJavaScriptファイルを読み込むコードを追加します。
echo '<script src="https://challenges.cloudflare.com/turnstile/v0/api.js?render=onload"></script>';

# sitekeyはCloudflareダッシュボードから取得した値を使用します。

ステップ3: 記事のコメントフォームへのTurnstile追加

# コメントフォームテンプレートファイルを開きます。
nano wp-content/themes/:your-theme/comments.php

# 以下のJavaScriptコードを追加して、コメントフォームにTurnstileを統合します。
echo '<script>
window.onload = function() {
    grecaptcha.ready(function() {
        grecaptcha.execute("YOUR_SITE_KEY", {action: "comment"}).then(function(token) {
            document.getElementById("comment").value += ";j" + token;
        });
    });
};
</script>';

# ここでsitekeyはCloudflareダッシュボードから取得した値を使用します。

ステップ4: Turnstileのパフォーマンスと監視

# パフォーマンスを確認するには、CloudflareのAnalyticsからアクセスログを確認します。
https://dash.cloudflare.com/:account_id/analytics/

# また、Turnstileの統計情報も確認できます。
https://dash.cloudflare.com/:account_id/turnstile/

注意事項

  • TurnstileはCAPTCHAとして機能するため、ユーザーに適切な体験を提供するためにデザインと整合性が重要です。
  • パブリックサイトではsitekeyを公開する必要があるため、他の設定とともに厳重に管理してください。
  • TurnstileのJavaScriptファイルは常に最新版を使用することを推奨します。
  • Turnstileの有効化後は、アクセスログや統計情報を定期的に確認し、不審なアクティビティがないか監視するようにしましょう。

まとめ

1. Turnstileの基本設定: CloudflareダッシュボードでTurnstileを有効にして必要な情報を取得します。

2. WordPressへの統合: functions.phpファイルとコメントフォームテンプレートにJavaScriptコードを追加してTurnstileをサイトに組み込みます。

3. パフォーマンスの監視: Cloudflareダッシュボードからアクセスログや統計情報を定期的に確認します。

4. 安全性の確保: sitekeyは公開する必要があるため、適切な管理を行いましょう。

5. ユーザー体験の改善: Turnstileのデザインとサイトとの整合性を保つことで、ユーザーに最良の体験を提供します。

関連記事:

お気軽にご相談ください

お見積りへ お問い合わせへ