فرم ورود اختصاصی وردپرس؛ ایجاد فرم لاگین بدون استفاده از افزونه

در این مطلب قصد ایجاد یک فرم ورود اختصاصی وردپرس بدون استفاده از افزونه و به صورت کاملا کدنویسی را داریم.

یکی از بخش های مورد استفاده در وردپرس، بخش ورود کاربران به پنل وردپرس است. وردپرس در این صفحه از طراحی بسیار ساده ای استفاده می کند. پس ایجاد یک فرم اختصاصی و با امکانات مورد نیاز کاربردی است. یکی از دلایل دیگر ایجاد فرم ورود اختصاصی وردپرس، امکان نمایش آن در مکان مورد نیاز است. برای مثال گاهی نیاز به نمایش فرم بین مطلب، هدر و … وجود دارد. در این مطلب قصد ایجاد یک فرم ورود و نمایش آن به وسیله کد کوتاه وردپرس را داریم. قبلا در مطلب «شورت کد وردپرس چیست» به صورت مفصل درباره کد های کوتاه در وردپرس صحبت کردیم. از طرف دیگر، برای فرم امکان استفاده از هر نمونه فرم ورودی وجود دارد. اما ما در این آموزش از نمونه ساخته شده در مطلب «طراحی فرم ثبت نام» استفاده می کنیم. مشاهده این مطلب را نیز به شدت پیشنهاد می کنیم.

فرم ورود اختصاصی وردپرس

برای شروع کار یک کد کوتاه با نام tcLogin ایجاد می کنیم. با این کار برای نمایش فرم ورود اختصاصی وردپرس تنها کد کوتاه خود را فراخوانی می کنیم. برای این کار کد زیر را در فایل functions.php قالب خود قرار می دهیم:

<?php
function tcLoginForm()
{
	return 'من کد کوتاهم';
}
add_shortcode('tcLogin', 'tcLoginForm');
?>

در مرحله بعد باید کد های HTML فرم را در این تابع ایجاد کنیم. همانطور که گفته شد ما در این آموزش از فرم ویدیو طراحی فرم ثبت نام استفاده می کنیم. به شکل کلی ۳ نکته مهم باید در فرم رعایت شود. اولین مورد استفاده از متد post در فرم است. مورد دوم، نوشتن نام log برای فیلد نام کاربری و pwd برای فیلد کلمه عبور است. سومین نکته نیز ایجاد یک فیلد مخفی با نام action و مقدار مناسب، برای بررسی ثبت فرم است. با رعایت این ۳ نکته از هر فرم HTML می توان استفاده کرد. برای استفاده از استایل و کد های جاوا اسکریپت نیز می توان به سادگی فایل ها را در هدر قالب فراخوانی کنیم. خروجی کد های بخش کد کوتاه به شکل زیر می شود. البته در نسخه ویدیویی از فرم پیشرفته تری استفاده می کنیم:

<?php
function tcLoginForm()
{
	return '
	<form action="" method="post">
		<input type="text" name="log" id="username">
		<input type="password" name="pwd" id="password">
		<button id="submit">ورود</button>
		<input type="hidden" name="action" value="tc_login_action">
	</form>
	';
}
add_shortcode('tcLogin', 'tcLoginForm');
?>

در مرحله بعد سراغ بررسی ثبت اطلاعات فرم ورود اختصاصی وردپرس خود می رویم. برای این کار باید هنگام init وردپرس، کد های خود را بررسی کنیم. پس کد های زیر را نیز به فایل functions.php قالب خود اضافه می کنیم:

<?php
function tcLoginFunc()
{
	if (isset($_POST['action']) && $_POST['action'] == 'tc_login_action') {
		$result = wp_signon();

		if (is_wp_error($result)) {
			wp_die('نام کاربری یا کلمه عبور اشتباه است. <a href="' . $_SERVER['REQUEST_URI'] . '">بازگشت</a>');
		}

		header('location: ' . $_SERVER['REQUEST_URI']);
		exit;
	}
}
add_action('init', 'tcLoginFunc');
?>

در این کد ابتدا ثبت فرم را با بررسی مقدار action چک می کنیم. سپس با استفاده از تابع wp_signon وردپرس، عملیات ورود را انجام می دهیم. در خط بعدی خطای احتمالی را بررسی می کنیم. در صورت وجود خطا نیز آن را به کاربر نمایش می دهیم. خط آخر نیز در صورت صحت اطلاعات، کاربر را به صفحه قبلی هدایت می کنیم.

بررسی وضعیت ورود کاربر

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

<?php
function tcLoginForm()
{
	if (is_user_logged_in()) {
		return '
		<form action="" method="post">
			<p>شما وارد حساب خود شده اید!</p>
		</form>
		';
	} else {
		return '
		<form action="" method="post">
			<input type="text" name="log" id="username">
			<input type="password" name="pwd" id="password">
			<button id="submit">ورود</button>
			<input type="hidden" name="action" value="tc_login_action">
		</form>
		';
	}
}
add_shortcode('tcLogin', 'tcLoginForm');
?>

در این صورت کاربر وارد شده دیگر فرم ورود را نمی بیند. از طرفی جلوی بروز خطا های احتمالی را می گیریم.