انتخاب دسته بندی

سلام دوستان عزیز، در این مقاله از آموزش وردپرس قصد داریم نحوه افزودن Google reCAPTCHA به وردپرس بدون افزونه بهمراه فیلم آموزشی شرح دهیم.

خیلی مواقع پیش میاد که در وب سایت های وردپرسی ما ، ربات ها با استفاده از صفحات کامنت ، لاگین یا ثبت نام اقدام به ارسال اسپم می کنند و با این کار باعث ایجاد اختلال در روند کار وب سایت می شوند، یکی از موثرترین راه های برای جلوگیری از اسپم ، استفاده از امکان reCAPTCHA که گوگل در اختیار ما قرار داده می باشد.

فیلم آموزشی افزودن Google reCAPTCHA به وردپرس

افزودن Google reCAPTCHA به وردپرس :

برای استفاده از امکان reCAPTCHA در وب سایت خود ، ابتدا باید از طریق این لینک وارد صفحه reCAPTCHA شده و سپس با اکانت گوگل خود لاگین کنید.افزودن Google reCAPTCHA به وردپرس بدونه افزونه

بعد از لاگین وارد صفحه مدیریت reCAPTCHA می شوید، در این صفحه ابتدا در بخش  Register a new site یک عنوان دلخواه در قسمت Label وارد کرده و در قسمت بعد گزینه reCAPTCHA V2 را انتخاب می کنیم ، در بخش Domains دامنه ای که قرار است reCAPTCHA از طریق آن مورد استفاده قرار گیرد را وارد میکنیم (مانند wpschool.ir) ، در قدم بعدی گزینه Accept the reCAPTCHA Terms of Service. را تیک زده و در انتها روی دکمه Register کلیک می کنیم.

نحوه افزودن Google reCAPTCHA به وردپرس بدونه افزونه

در صفحه بعدی (مانند تصویر زیر) در بخش Keys مقدار موجود در Site key کلید اختصاصی شما جهت استفاده در کدهای Html و مقدار Secret key کلید اختصاصی شما جهت برقرار ارتباط بین وب سایت شما و گوگل می باشد و باید به صورت محرمانه حفظ و نگهداری شود.

افزودن Google reCAPTCHA به وردپرس بدونه افزونه

حالا باید وب سایت خود را جهت ارتباط با گوگل پیکربندی کنیم ، برای این کار ابتدا باید کد اسکریپت reCAPTCHA را به وب سایت خود در تگ <head> اضافه کنیم ، جهت رعایت استاندارد کدنویسی در وردپرس اسکریپت مربوطه را از طریق تابع wp_enqueue_script به صفحه اضافه می کنیم ، جهت انجام این کار کدهای زیر را به فایل functions.php اضافه می کنیم:

function theme_captcha() {
    wp_enqueue_script( 'recaptcha', 'https://www.google.com/recaptcha/api.js?hl=fa');
}
add_action( 'wp_enqueue_scripts', 'theme_captcha' );

توجه : جهت استفاده از امکانات زبان فارسی در reCAPTCHA در انتهای اسکریپت مقدار ?hl=fa را اضافه کرده ایم.

پس از انجام مراحل بالا باید صفحه ای جهت به کار بردن reCAPTCHA انتخاب کنیم ، ما در این آموزش از صفحه ثبت نام که در آموزش جایگزین صفحه ثبت نام در وردپرس ، طراحی کرده بودیم استفاده خواهیم کرد. (شما می توانید در هر صفحه ای که نیاز دارید مراحل زیر را انجام دهید)

ابتدا باید در صفحه مورد نظر قبل از بسته شدن تگ <form> هر جایی که می خواهید ویجت I am not robot نمایش داده شود کد زیر را اضافه کنید و در قسمت data-sitekey کلید اختصاصی Site Key  خود را که از گوگل دریافت کرده اید، جایگزین کنید:

// مقدار data-sitekey را باکلید دریافتی از گوگل جایگزین کنید
<div class="g-recaptcha" data-sitekey="xxx_Your-Site-Key_xxx"></div>

حالا در قسمت کدهای سرور باید اعتبارسنجی لازم را با استفاده از Secret Key انجام داده و در صورت موفقیت به کاربر اجازه ادامه کار دهیم.

برای انجام این کار تابع زیر را به فایل functions.php اضافه میکنیم و هر جا که در کدهای خود (برای مثال در کدهای لاگین ، کامنت یا ثبت نام) نیاز به اعتبارسنجی می باشد تایع check_recaptcha() را صدا زده و در صورت که مقدار برگشتی true باشد اجازه انجام کار و غیر این صورت پیام مناسب به کاربر نشان می دهیم.

function check_recaptcha(){
           $recaptcha_secret = 'xxx_YOUR-SECRET-KEY_xxx';
		$response = wp_remote_get("https://www.google.com/recaptcha/api/siteverify?secret=". $recaptcha_secret ."&response=". $_POST['g-recaptcha-response']);
		$response = json_decode($response["body"], true);
		if (true == $response["success"]) {
			return true;
		} else {
			return false;
		}
}

در صفحه ثبت نام کافیست تابع بالا را قبل از انجام عمل ثبت نام صدا زده و اعتبار سنجی را انجام دهیم ، کدهای موجود در تابع register_user به شکل زیر تغییر می کنند:

 function register_user( $email, $first_name, $last_name , $pass1 , $pass2 ) {
    $errors = new WP_Error();
// این قسمت اضافه شده است
    if ( check_recaptcha() == false ) {
        $errors->add( 'recaptcha');
        return $errors;
    }
 //
    if ( username_exists( $email ) || email_exists( $email ) ) {
        $errors->add( 'email_exists');
        return $errors;
    }
    
    if ( ! is_email( $email ) ) {
        $errors->add('email');
        return $errors;
    }
    if(empty($pass1)){
     $errors->add('password_empty');
        return $errors;
    }
    if($pass1 != $pass2){
        $errors->add( 'password_mismatch');
        return $errors;
    }
    $user_data = array(
        'user_login'    => $email,
        'user_email'    => $email,
        'user_pass'     => $pass1,
        'first_name'    => $first_name,
        'last_name'     => $last_name,
        'nickname'      => $first_name,
    );
    $user_id = wp_insert_user( $user_data );
    wp_new_user_notification( $user_id, $pass1 );
    return $user_id;
}

جهت نمایش پیام مناسب به کاربر نیز کدهای زیر را به switch..case موجود در صفحه ثبت نام (فایل custom-register.php) اضافه کنید:

case 'recaptcha':
$html_out=$html_out.'<li>'.__("روی عبارت من ربات نیستم کلیک کنید",'wpschoool-login').'</li>'; 
 break;

در صورتیکه تمام مراحل بالا را روی صفحه ثبت نام انجام داده باشید باید صفحه ای مانند تصویر زیر داشته باشید:

افزودن Google reCAPTCHA به وردپرس بدونه افزونه

توجه : جهت بدست آوردن آمار ترافیک کاربران مراجعه کننده به صفحه ثبت نام می توانید از مقاله افزودن Google Analytics به وردپرس استفاده کنید.

بروزرسانی : در صورتی  که میخواهید از Ajax جهت ارسال اطلاعات و اعتبارسنجی استفاده کنید کد زیر را به data ارسالی توسط ajax اضافه کنید :

'g-recaptcha-response': grecaptcha.getResponse()

مقاله افزودن Google reCAPTCHA به وردپرس بدون افزونه به پایان رسید اگر مشکل یا سوالی بود در قسمت کامنت های همین مطلب عنوان کنید.

موفق باشید.

کلمات کلیدی: ، ، ،

15 دیدگاه برای “افزودن Google reCAPTCHA به وردپرس + فیلم آموزشی“

  • محمد شیخ زاهدی
    - ۱ اسفند , ۱۳۹۶

    سلام،خیلی ممنون برای آموزش های خوبتون
    من تمامی مراحل را انجام دادم اما همیشه شرط if ( check_recaptcha() == false ) درست است و خطا به کاربر نمایش داده می شود! من می خواسم ازین آموزش در ساخت صفحه ارتباط با ما استفاده کنم
    کد زیر را در تابع wpschool_ajax_contact() قرار دادم اما خطا نمایش داده میشود
    if(check_recaptcha() == false){
    $message = ‘روی عبارت من ربات نیستم کلیک کنید’;
    $hasError = true;
    }

    • الناز
      - ۱ اسفند , ۱۳۹۶

      سلام و خسته نباشید،
      مواردی زیادی وجود داره که شما ممکنه به خطا بخوردید ، لطفا جهت راهنمایی راحت تر به آیدی تلگرام مدرسه وردپرس پیام بدید:
      https://t.me/wpschool_support
      با تشکر

  • غریب
    - ۲۵ فروردین , ۱۳۹۷

    سلام عزیز
    بنده از افزونه استفاده کردم و کامل تنظیماتش رو انجام دادم کپچای گوگل هم بدون مشکل اضافه شد و کار کرد . منتها یه مشکل هست اونم اینکه هنوز اون کپچای عددی قبلی هم هست یعنی کپچای گوگل فقط اضافه شد به بخش کامنتم جایگزین نشد با کپچای قبل مشکل چیه ؟
    افزونه تمام کارها رو ضاهرا خودکار انجام میده ولی این مورد رو نه چیکار کنم الان ممنون میشم راهنمایی کنید

    • الناز
      - ۲۵ فروردین , ۱۳۹۷

      با سلام
      برای عدم نمایش کپچای قدیمی که عددی هستش باید افزونه مربوط به اون کپچا رو غیر فعال کنید، تا دیگه نمایش داده نشه
      موفق باشید

  • mohamadaslani
    - ۱۵ خرداد , ۱۳۹۷

    سلام ببخشید من تو فرمم یه فایل دارم که باید اپلود کنم و ۴ تا چک باکس مه باید بررسی کنم ببینم کومش چک خوذده چطوری اینها رو با ajax بررسی کنم؟

    • سیروس
      - ۱۶ خرداد , ۱۳۹۷

      سلام ، باید مقدار Value هر ۴ چک باکس رو در Data ارسالی از طریق ajax به سمت سرور بفرستید و اونجا اعتبارسنجی رو انجام بدید.

  • reza
    - ۴ دی , ۱۳۹۷

    سلام
    ممکنه راهنمایی کنید که چگونه کپچا رو به فرم ورود که شما ساختید اضاف کنم.
    همچنین اگه بخام به comments اضاف کنم چه کار کنم؟
    ممکنه کدها رو برام بزارید.

    • سیروس
      - ۵ دی , ۱۳۹۷

      سلام و خسته نباشید،
      کافیه تابع check_recaptcha() به ابتدای تابع لاگین یا کامنت اضافه کنید و بررسی صحت ریکپچا رو انجام بدید.

  • reza
    - ۷ دی , ۱۳۹۷

    اقا سیروس من مبتدی هستم میشه بیشتر راهنمایی کنید کد این تابع check_recaptcha() رو بهم بدین. بررسی صحت کپچا؟ لطف می کنید توضیح بیشتر بدین

    • سیروس
      - ۹ دی , ۱۳۹۷

      سلام ، اگه آموزش افزودن Google reCAPTCHA به وردپرس رو کامل خونده باشید ، تابع check_recaptcha() رو توی این آموزش خودمون نوشتیم.
      موفق باشید

  • مهدی
    - ۷ بهمن , ۱۳۹۷

    سلام
    من می خوام Google reCAPTCHA رو به صفحه ورود و ثبت نام مشتریان در ووکامرس اضافه کنم ، می شه لطفا راهنمایی کنید که چه طور باید این کار را انجام بدم
    ممنون

    • سیروس
      - ۸ بهمن , ۱۳۹۷

      سلام دوست عزیز ، ابتدا باید صفحه ثبت نام ووکامرس رو پیدا کنید (متاسفانه من نمیدونم که این صفحه کجاست) و بعد کدهای که تو این آموزش گذاشتیم بهش اضافه کنیم.

  • محسن سلیمانی
    - ۱۸ مهر , ۱۳۹۸

    سلام
    کدهای comments.php من بسیار کم و ساده هستند. لطفا بگید این کد شرطی ریکپچا رو کجای اون بذارم؟

    • سیروس
      - ۲۲ مهر , ۱۳۹۸

      روی دکمه ثبت کامنت باید تابع کنترل کپچا صدا زده بشه

  • choobin
    - ۱ شهریور , ۱۳۹۹

    با سلام
    فک نکنم به دلیل تحریم، دیگه روی دامنه های ir بده.

دیدگاه خود را بیان کنید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

-- بارگیری کد امنیتی --