ساخت فرم نام نویسی کامل در وردپرس

فرم عضویت وردپرس بدون استفاده از پلاگین

در این پست از دنیای وردپرس و برنامه نویسی، آموزشی را آماده کرده ایم تا با کمک آن به سادگی هرچه تمام تر یک فرم عضویت ساده و کامل را در سایت خود پایه ریزی کنید.
همانطور که میدانید مهمترین بخش در ساخت یک فرم نام نویسی، برقراری ارتباط با پایگاه داده است. در این آموزش ما با استفاده از تابع ()wp_insert_user قادر خواهیم بود تا اطلاعات ارسالی توسط کاربر را در پایگاه داده ثبت کنیم. (جهت مطالعه مستندات بیشتر اینجا کلیک کنید)

فرم کلی تابع wp_insert_user:

<?php wp_insert_user( $userdata ) ?>

اما پیش از استفاده از تابع بالا و کدنویسی سمت سرور، ابتدا لازم است تا یک فرم با تعدادی فیلد ورودی (input) و یک دکمه ارسال (button) بسازیم. این کار را ما به صورت زیر انجام دادیم:

<form method="post">
	<h3>آیا قبلا عضو نشده اید؟<br/> نام نویسی کنید.</h3>
	<p><label>نام</label></p>
	<p><input type="text" value="" name="first_name" id="first_name" /></p>		
	<p><label>نام خانوادگی</label></p>
	<p><input type="text" value="" name="last_name" id="last_name" /></p>
	<p><label>ایمیل</label></p>
	<p><input type="text" value="" name="email" id="email" /></p>
	<p><label>نام کاربری</label></p>
	<p><input type="text" value="" name="username" id="username" /></p>
	<p><label>رمز عبور</label></p>
	<p><input type="password" value="" name="pwd1" id="pwd1" /></p>
	<p><label>تکرار رمز عبور</label></p>
	<p><input type="password" value="" name="pwd2" id="pwd2" /></p>
	<button type="submit" name="btnregister" >بفرست!</button>
	<input type="hidden" name="task" value="register" />
</form>

پس از انجام مرحله قبل، می رسیم به مهمترین بخش کار، یعنی دریافت و پردازش اطلاعات ارسالی از فرم html بالا.
برای این منظور از قطعه کد پی اچ پی زیر استفاده میکنیم. این اسکریپت ضمن دریافت و پردازش اطلاعات با داشتن تعدادی دستور شرطی، تک تک مراحل کار را کنترل کرده و پیغام هایی را در هر شرط مشخص می کند. ( در مرحله بعد، از این پیغام ها با شرط خالی نبودن متغیرها ( مثلا: ! empty($success) ) استفاده خواهیم کرد)

<?php
	$err = '';
	$success = '';

	global $wpdb, $PasswordHash, $current_user, $user_ID;

	if(isset($_POST['task']) && $_POST['task'] == 'register' ) {

		$pwd1 = $wpdb->escape(trim($_POST['pwd1']));
		$pwd2 = $wpdb->escape(trim($_POST['pwd2']));
		$first_name = $wpdb->escape(trim($_POST['first_name']));
		$last_name = $wpdb->escape(trim($_POST['last_name']));
		$email = $wpdb->escape(trim($_POST['email']));
		$username = $wpdb->escape(trim($_POST['username']));

		if( $email == "" || $pwd1 == "" || $pwd2 == "" || $username == "" || $first_name == "" || $last_name == "") {
			$err = 'لطفا تمامی فیلدهای الزامی را تکمیل نمایید.';
		} else if(!filter_var($email, FILTER_VALIDATE_EMAIL)) {
			$err = 'آدرس ایمیل نامعتبر است!';
		} else if(email_exists($email) ) {
			$err = 'این ایمیل قبلا در سایت ثبت شده است.';
		} else if($pwd1 <> $pwd2 ){
			$err = 'کلمات عبور با یکدیگر مطابقت ندارند.';		
		} else {

			$user_id = wp_insert_user( array ('first_name' => apply_filters('pre_user_first_name', $first_name), 'last_name' => apply_filters('pre_user_last_name', $last_name), 'user_pass' => apply_filters('pre_user_user_pass', $pwd1), 'user_login' => apply_filters('pre_user_user_login', $username), 'user_email' => apply_filters('pre_user_user_email', $email), 'role' => 'subscriber' ) );
			if( is_wp_error($user_id) ) {
				$err = 'خطایی در ارسال درخواست نام نویسی شما رخ داده است!';
			} else {
				do_action('user_register', $user_id);

				$success = 'نام نویسی شما با موفقیت به اتمام رسید، از شما ممنویم.';
			}

		}

	}
	?>

حال، کار ساخت فرم و ارسال اطلاعات به پایان رسیده است. اما به عنوان آخرین مرحله و نمایش یک نمونه ی قابل آزمایش، ما از این کدها در یک تمپلیت قالب برگه (سازگار با پوسته TwentyTwelve وردپرس) استفاده کردیم.
در این بخش جدای از کدها بالا:

  • از یک استایل جهت زیبا سازی بیشتر فیلدهای ورودی.
  • برچسب ها و توابع لازم به کار رفته در پوسته ۲۰۱۲.
  • و یک دایو مربوط به چاپ پیغام های ضروری که در بالا اشاره شد.

استفاده شده است.

* البته این را هم متذکر می شویم که این تنها روش نبوده و شما می توانید از فرم بالا در هر مکان و با هر روشی استفاده نمایید.
اما اگر قصد استفاده از آن را به صورت قالب برگه در پوسته خود دارید، کافی است تا با چند ویرایش ساده در برچسب ها و نام کلاس ها یا  آی دی ها آن را با پوسته خود سازگار کنید.

<?php
/*
Template Name: فرم عضویت
*/
?>
<style>
form label {
	display: block;
	font-weight: bold;
}
form input[type="text"], form input[type="password"] {
	border: 1px solid #F0F0F0;
	border-radius: 5px;
	-moz-box-shadow: 1px 1px #FFF, 1px 1px 1px #aaa inset;
	-webkit-box-shadow: 1px 1px #FFF, 1px 1px 1px #aaa inset;
	box-shadow: 1px 1px #FFF, 1px 1px 1px #aaa inset;
	padding: 10px 7px;
	width: 50%;
	background: #FFF;
	margin-top: 5px;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 15px;
	font-weight: bold;
	color: #666;
}
</style>
<?php get_header(); ?>
<?php
	$err = '';
	$success = '';

	global $wpdb, $PasswordHash, $current_user, $user_ID;

	if(isset($_POST['task']) && $_POST['task'] == 'register' ) {

		$pwd1 = $wpdb->escape(trim($_POST['pwd1']));
		$pwd2 = $wpdb->escape(trim($_POST['pwd2']));
		$first_name = $wpdb->escape(trim($_POST['first_name']));
		$last_name = $wpdb->escape(trim($_POST['last_name']));
		$email = $wpdb->escape(trim($_POST['email']));
		$username = $wpdb->escape(trim($_POST['username']));

		if( $email == "" || $pwd1 == "" || $pwd2 == "" || $username == "" || $first_name == "" || $last_name == "") {
			$err = 'لطفا تمامی فیلدهای الزامی را تکمیل نمایید.';
		} else if(!filter_var($email, FILTER_VALIDATE_EMAIL)) {
			$err = 'آدرس ایمیل نامعتبر است!';
		} else if(email_exists($email) ) {
			$err = 'این ایمیل قبلا در سایت ثبت شده است.';
		} else if($pwd1 <> $pwd2 ){
			$err = 'کلمات عبور با یکدیگر مطابقت ندارند.';		
		} else {

			$user_id = wp_insert_user( array ('first_name' => apply_filters('pre_user_first_name', $first_name), 'last_name' => apply_filters('pre_user_last_name', $last_name), 'user_pass' => apply_filters('pre_user_user_pass', $pwd1), 'user_login' => apply_filters('pre_user_user_login', $username), 'user_email' => apply_filters('pre_user_user_email', $email), 'role' => 'subscriber' ) );
			if( is_wp_error($user_id) ) {
				$err = 'خطایی در ارسال درخواست نام نویسی شما رخ داده است!';
			} else {
				do_action('user_register', $user_id);

				$success = 'نام نویسی شما با موفقیت به اتمام رسید، از شما ممنویم.';
			}

		}

	}
	?>
<div id="primary" class="site-content">
  <div id="content" role="main">
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
	  <header class="entry-header">
		<h1 class="entry-title"><?php the_title(); ?></h1>
	  </header>
      <div class="entry-content">
        <?php the_content(); ?>
        <div id="message">
          <?php 
			if(! empty($err) ) :
				echo '<p class="error">'.$err.'</p>';
			endif;
		?>
          <?php 
			if(! empty($success) ) :
				echo '<p class="error">'.$success.'</p>';
			endif;
		?>
        </div>
        <form method="post">
          <h4>آیا قبلا عضو نشده اید؟<br/>
            نام نویسی کنید.</h4>
          <p>
            <label>نام</label>
          </p>
          <p>
            <input type="text" value="" name="first_name" id="first_name" />
          </p>
          <p>
            <label>نام خانوادگی</label>
          </p>
          <p>
            <input type="text" value="" name="last_name" id="last_name" />
          </p>
          <p>
            <label>ایمیل</label>
          </p>
          <p>
            <input type="text" value="" name="email" id="email" />
          </p>
          <p>
            <label>نام کاربری</label>
          </p>
          <p>
            <input type="text" value="" name="username" id="username" />
          </p>
          <p>
            <label>رمز عبور</label>
          </p>
          <p>
            <input type="password" value="" name="pwd1" id="pwd1" />
          </p>
          <p>
            <label>تکرار رمز عبور</label>
          </p>
          <p>
            <input type="password" value="" name="pwd2" id="pwd2" />
          </p>
          <button type="submit" name="btnregister" class="button" >بفرست!</button>
          <input type="hidden" name="task" value="register" />
        </form>
      </div>
      <footer class="entry-meta">
        <?php edit_post_link( __( 'Edit', 'twentytwelve' ), '<span class="edit-link">', '</span>' ); ?>
      </footer>
      <!-- .entry-meta --> 
    </article>
    <?php endwhile; ?>
    <?php endif; ?>
  </div>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

سورس کدها: sutanaryan.com

جهت استفاده از کد تکمیلی بالا، یک فایل php ساخته و پس از انتقال کدها آن را در پوشه اصلی قالب خود بارگذاری کنید. سپس به بخش افزودن برگه ها رفته و در تب "صفات برگه" قالب فرم عضویت را انتخاب کرده و آن را منتشر کنید.

دیدگاه کاربران در مورد این نوشته

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

    توسط صدرا پاسخ

  2. با عرض سلام
    میخواستم ازتون کمک بگیرم بنده سایتی با وردپرس طراحی کردم و میخوام فرمی داشته باشم تا کاربران سایت اطلاعاتشون رو از قبیل نام و شماره همراه و همچنین فایل آپلود شده رو دریافت کنه و بعد این ورودیها رو در صفحه اصلی سایت نمایش بدم
    من از فرم های مختلف وردپرس استفاده کردم ولی در قسمت نمایش اطلاعات با مشکل بر می خورم
    اگه پیشنهادی دارین ارزون قیمت ممنون میشم اگه مثل یه افزونه باشه با آموزش خیلی بهتره

    توسط امیر پاسخ

    1. سلام. میتونید از افزونه های فرم ساز مثل gravity forms استفاده کنید که امکانات کاملی داره. اما اگر به یک سیستم خاص نیاز دارید، میتونید جزئیاتش رو از طریق فرم تماس، برای ما بفرستید تا بررسی کنیم.

      توسط علی میرزائی پاسخ

  3. من میخوام در روی سایت گزینه ای را اضافه کنم که هر فرد بتواند مشخصات کامل خود را برای من بفرستد مانند کد ملی -نام – نام خانوادگی سن -تلفن-ادرس و….در صورت امکان مرا راهنمایی فرمائید

    توسط فروش عمده روغن خوراکی پاسخ

    1. سلام، میتونید از افزونه رایگان contact form 7 و یا افزونه پرمیوم گراویتی فرم استفاده کنید.

      توسط علی میرزائی پاسخ

  4. بنده یک قالب نیاز دارم به مانند سایت فروش اکانت کلش اف کلنز http://clashman.ir شما چه چیزی پیشنهاد میدین؟

    توسط ali_s پاسخ

    1. سلام،
      میتونید سفارش بدید تا به صورت اختصاصی براتون طراحی کنیم و یا اینکه از قالب های آماده ای مثل makery استفاده کنید.
      http://tiny.alimir.ir/W0h

      توسط علی میرزائی پاسخ

  5. سلام
    ببخشید مزاحمتون میشم
    ی راهنمایی خواستم
    در مورد اینکه چطور میشه کسی که توی سیستم وبلاگدهی وردپرس ثبت نام میکنه به عنوان کاربر سایت اصلی هم باشه ؟
    ممنون

    توسط تیموری پاسخ

  6. با سلام
    میشه آموزش تصویریشو بذارید؟
    ممنون

    توسط وحید پاسخ

  7. سلام علی آقا
    کد امنیتی رو چطور توش فراخوانی کنم ؟
    اسپم ها نابودم کردند D:

    توسط علی پاسخ

    1. سلام، پیشنهاد میکنم از گوگل ریکپچا استفاده کنید. در اولین آموزش استفاده از این سیستم رو در سایت قرار میدم.

      توسط علی میرزائی پاسخ

  8. سلام / میشه به این فرم کد امنیتی هم اضافه کرد؟؟ توضیح بدین ممنون میشم

    توسط نیما پاسخ

    1. سلام. بله، به زودی آموزش استفاده از گوگل ریکپچا رو در سایت قرار میدم.

      توسط علی میرزائی پاسخ

  9. سلام ببخشید میشه بیشتر راهنمایی بفرمایید برای اونایی که تازه کار هستن این کدا باید کجا نوشته بشه 🙁

    توسط خدیجه پاسخ

    1. سلام؛ میتونید یک فایل تمپلیت قالب در پوسته سایتتون ایجاد کنید و کدهای داده شده رو در اونجا قرار بدید. (دقیقا مشابه تمپلیت ارائه شده برای پوسته TwentyTwelve)

      توسط علی میرزائی پاسخ

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

    توسط پوریا پاسخ

    1. سلام، فیلد زندگی نامه و آدرس سایت توسط تابع wp_insert_user پشتیبانی میشه و میتونید مستنداتش رو در آدرس زیر ببینید:
      http://codex.wordpress.org/Function_Reference/wp_insert_user

      توسط علی میرزائی پاسخ

  11. ممنون خیلی عالی بود
    یه سوال بعد از فراخوانی $wpdb و کانکشن به دیتابیس چطور بعد از انجام پردازش کانکشن دیتابیسو ببندیم؟؟
    بازم تشکر

    توسط farhad پاسخ

    1. سلام، نیازی به انجام این کار نیست! در کلاس wpdb همه مسائل امنیتی لحاظ شدند، و این قبیل موارد به صورت خودکار انجام میشن.
      http://tiny.alimir.ir/5OQ

      توسط علی میرزائی پاسخ

  12. سلام
    یه سوال داشتم دوست عزیز و ممنون میشم راهنماییم کنید
    من تو سایتم یه فرمی رو گذاشتم که کاربر بیاد و اطلاعاتی رو وارد کنه
    چطور میتونم این اطلاعات رو لینک بدم به جدول کاربرا
    ینی اینجا که فرم رو پر کرد براش حساب کاربری باز بشه
    بازم ممنون

    توسط مرتضی پاسخ

    1. سلام، از گفته هاتون متوجه نوع و تنوع فیلدها نشدم!! منتها به صورت کلی، شما میتونید برای ثبت عضویت کاربران از توابعی مثل wp_insert_user , wp_create_user و یا کلاس آماده $wpdb استفاده کنید.
      برای برخی اطلاعات اضافه هم میتونید یک جدول جداگانه طراحی کنید و یا اینکه از جدول آماده usermeta (استفاده از تابع add_user_meta) استفاده کنید.

      توسط علی میرزائی پاسخ

  13. مرسی

    توسط تور کیش پاسخ

  14. خیلی متشکر از مطلب خوبتون

    توسط دوربین مدار بسته پاسخ

  15. با سلام خدمت دوست عزیر
    من میخوام در روی سایت گزینه ای را اضافه کنم که هر فرد بتواند مشخصات کامل خود را برای من بفرستد مانند کد ملی -نام – نام خانوادگی سن -تلفن-ادرس و….در صورت امکان مرا راهنمایی فرمائید

    توسط محمد پاسخ

    1. سلام محمد جان، میتونید از افزونه Contact Form 7 استفاده کنید:
      http://tiny.alimir.ir/y5

      توسط علی میرزائی پاسخ

  16. ممنون مرسی خوب بود

    توسط عکس پاسخ

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

    توسط محمد پاسخ

    1. سلام، برای ساخت فرم عضویت و فرم ورود میتونید از همین آموزش و آموزش لینک روبرو استفاده کنید: http://tiny.alimir.ir/8f
      اما اگه دنبال راحتی و امنیت بیشتر هستید، پیشنهاد میکنم از افزونه استفاده کنید. (مثل افزونه Ajax BootModal Login)

      توسط علی میرزائی پاسخ

  18. با سلام
    سپاس از مطالبتون

    توسط طراحی سایت پاسخ

  19. سلام نحوه ی فراخوانی این قالب چگونه است ممنون میشم؟؟؟؟؟؟؟؟؟؟؟

    توسط رضا پاسخ

  20. عالی بود آقا
    ممنون

    توسط ناتالي پاسخ

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