مجله خبری هاست ایران » طراحی و توسعه » آموزش قدم به قدم ایجاد صفحه لاگین دلخواه در وردپرس
  • mag-telegram.jpg
  • landing96-300-420.jpg
طراحی و توسعه طراحی وب گرافیک

آموزش قدم به قدم ایجاد صفحه لاگین دلخواه در وردپرس

ایجاد صفحه لاگین دلخواه در وردپرس

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

دلایل بسیاری وجود دارد که پیشنهاد می‌شود آدرس صفحه‌ی لاگین به وردپرس را تغییر دهید. مهم‌ترین آن‌ها عبارت‌اند از:

۱- برخورداری از وب‌سایت فروشگاهی: در وب‌سایت‌های فروشگاهی معمولاً کاربران به صفحه‌ی ورود به داشبورد وردپرس یا همان ناحیه کاربری فروشگاه مراجعه می‌کنند. در واقع این مورد شامل سایت‌های ساخته شده با ووکامرس نیز می‌شود.

۲- برخورداری از وب‌سایت دارای عضویت: مشابه وب‌سایت‌های فروشگاهی، سایت‌هایی که دارای عضوگیری و ثبت‌نام و ورود کاربر هستند نیز معمولاً از صفحه‌ی لاگین برخوردارند و کاربر صفحه‌ی لاگین سایتتان را می‌بیند.

۳- برخورداری از هرگونه وب‌سایت وردپرسی: شاید مهم‌ترین دلیل برای تغییر آدرس صفحه‌ی ادمین یا همان داشبورد وردپرس، همین مورد باشد. صرف‌نظر از اینکه وب‌سایت شما فروشگاهی است یا خیر و یا حتی کاربر امکان ثبت‌نام دارد یا ندارد، پیشنهاد می‌کنیم حتماً صفحه‌ی ورود به وردپرس را ضمن شخصی‌سازی تغییر دهید. تغییر آدرس لاگین به شما کمک می‌کند که:

  • امنیت وب‌سایت بالا برود. چرا که بسیاری از کاربران و همچنین ربات‌ها از آدرس ورود به پنل ادمین اطلاع دارند و با مراجعه به آن اقدام به انجام حمله‌ی Brute-force یا Dictionary می‌کنند.
  • شخصی‌سازی صفحه‌ی لاگین به وردپرس و به‌کارگیری طرحی زیبا موجب بهبود تجربه کاربری می‌شود.
  • وردپرس سیستم مدیریت محتوای بسیار قدرتمندی است که به شما امکان برندینگ و استفاده از لوگوی کسب‌وکار خود را به جای لوگوی پیش‌فرض وردپرس می‌دهد. با تغییر ظاهر صفحه‌ی لاگین می‌توانید قدمی در راستای رضایت کاربر و تبلیغ برند خود بردارید.

ایجاد صفحه لاگین دلخواه در وردپرس

حال که اهمیت تغییر آدرس لاگین وردپرس را شرح دادیم، به بررسی روش‌های مختلف تغییر صفحه‌ی ورود وردپرس و پیشنهاد‌هایی برای بهره‌مندی از صفحه‌ی ورود بی‌نظیر می‌پردازیم:

۱- پلاگین WPS Hide Login

از ساده‌ترین کارهایی که برای شخصی‌سازی صفحه‌ی ورود انجام می‌شود، استفاده از پلاگین‌های معروف برای تغییر صفحه‌ی ورود در این زمینه است. یکی از بهترین پلاگین‌های رایگان جهت ایمن‌سازی و تغییر آدرس صفحه لاگین وردپرس، پلاگین WPS Hide Login است. این پلاگین قدرتمند و سبک، به شما این امکان را می‌دهد که بدون ایجاد تغییرات اساسی در کدهای هسته‌ی وردپرس، آدرس صفحه‌ی ورود به داشبورد یا همان ادمین وردپرس را تغییر دهید و بدین‌وسیله از آدرسی یکتا و ایمن استفاده کنید. در واقع نکته‌ی مهم اینجاست که صفحات wp-admin و wp-login.php از دسترس عموم خارج می‌شوند. این پلاگین با انواع نسخه‌های وردپرس، پوسته‌ها و افزونه‌های مختلف سازگار است؛ با این وجود همواره می‌توانید تنها با تغییر نام پوشه‌ی مربوط به آن اقدام به غیرفعال کردن آن نمایید.

۲- پلاگین WPForms

پلاگین WPForms

WPForms یکی از معروف‌ترین پلاگین‌های ایجاد فرم به خصوص فرم تماس است. این پلاگین پریمیوم دارای یک Addon است که به‌وسیله‌ی آن می‌توانید صفحه‌ی ثبت‌نام کاربران را سفارشی کنید. با سفارشی‌سازی صفحه‌ی لاگین، دو ستون در صفحه‌ی لاگین به کاربران نمایش داده می‌شود. ستون سمت چپ دارای فرم لاگین و ستون سمت راست برای برجسته کردن تبلیغات و سایر دکمه‌های Call-to-action است. همچنین در این صفحه می‌توان از امکاناتی مانند سفارشی‌سازی برند، تصویر پس‌زمینه و رنگ‌بندی پیشرفته برند بهره برد و تجربه‌ای خاص برای کاربر ایجاد کرد.

۳- وب‌سایت Rock My Wedding

وب‌سایت Rock My Wedding

سایت Rock My Wedding این امکان را برای کاربرانش فراهم آورده است که از طریق دو فرم ورود و ثبت‌نام به‌صورت پاپ‌آپ (Popup) می‌توانند به‌راحتی وارد پرتال کاربری وب‌سایت شوند. از مزیت‌های استفاده از پاپ‌آپ این است که کاربر دیگر نیاز به ترک صفحه‌ی مورد نظر برای لاگین ندارد و با ماندن در آن صفحه می‌تواند به‌سادگی لاگین خود را انجام دهد. استفاده از این پلاگین نهایتاً منجر به ذخیره زمان و تجربه‌ی سرعتی بالاتر در دسترسی به بخش مورد نظرشان می‌شود. برای انجام این امر می‌توانید از پلاگین CSH Login و WPForms و یا OptinMonster استفاده کنید.

۴- وب‌سایت Jacquelynne Steves

Jacquelynne Steves

وب‌سایت بالا وب‌سایتی در زمینه هنر و صنایع‌دستی است که نویسنده و ادمین‌های آن با خوش‌ذوقی پست‌های در خصوص دکور و تزئین خانه، ساخت لحاف، گلدوزی، ساخت الگو و طرح‌های مختلف و انواع مسائل هنر و زیبایی منتشر می‌کنند. آن‌ها از تصویری سفارشی به‌عنوان تصویر پس زمینه‌ی صفحه‌ی لاگین استفاده می‌کنند که ظاهر آن با پوسته‌ی مورد استفاده‌ی آن‌ها در وب‌سایت همخوانی دارد و فرم لاگین در سمت راست آن صفحه قرار دارد.

۵- وب‌سایت Church Motion Graphics

وب‌سایت Church Motion Graphics

در صفحه‌ی لاگین وب‌سایت Church Motion Graphics از یک تصویر پس‌زمینه‌ی رنگارنگ استفاده شده که حرفه و کسب‌وکار این وب‌سایت را بازتاب می‌دهد. این صفحه به‌صورت مشابه از بخش هدر (سرتیتر)، فوتر (پاورقی) و منوی راهبری سایت بهره می‌برد. در واقع همان اجزای اصلی که در وب‌سایت به کار رفته را می‌توانید در صفحه‌ی ورود کاربران نیز مشاهده کنید و یکپارچگی موجود باعث ایجاد حس خوب و بهبود تجربه‌ی کاربری می‌شود. این اجزا و یکپارچگی در حالی بکار گرفته شده است که خود فرم لاگین بسیار ساده و دارای پس‌زمینه‌ای تیره است.

۶- وب‌سایت MITSLoan Management Review

وب‌سایت MITSLoan Management Review

وب‌سایت MITSLoan Management Review از صفحه‌ی لاگین پیش‌فرض وردپرس استفاده می‌کند. این صفحه دارای یک فایل CSS اختصاصی است. همچنین در صفحه‌ی لاگین، لوگوی وردپرس حذف و لوگوی اختصاصی برند جایگزین شده است.

نحوه ایجاد صفحه‌ی لاگین اختصاصی در وردپرس

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

ایجاد صفحه ورود سفارشی با استفاده از پلاگین Theme My Login

ابتدا لازم است پلاگین Theme My Login را نصب و فعال نمایید. به محض فعال‌سازی، خود پلاگین آدرس یا URLهای سفارشی برای ورود، خروج، ثبت‌نام، ریست رمز عبور و فراموشی رمز عبور ایجاد خواهد کرد. البته می‌توانید URLهای این صفحات لاگین را با مراجعه به صفحه اصلی Theme My Login شخصی‌سازی کنید. در بخش تنظیمات «Slug» به سمت پایین صفحه اسکرول کنید تا URLهای ایجاد شده توسط این پلاگین را تغییر دهید.

پلاگین Theme My Login

همچنین این پلاگین این امکان را در اختیار شما می‌گذارد تا با استفاده از کدهای کوتاه، صفحه ورود و ثبت‌نام دلخواه خود را ایجاد کنید. به‌راحتی می‌توانید صفحه‌ای را ایجاد کرده و سپس صفحه slug را به آن اضافه کنید، به این ترتیب، پلاگین، کاربران را یافته و آن‌ها را به صفحه مد نظر ریدایرکت می‌کند.

در ابتدا با صفحه لاگین شروع می‌کنیم:

در بالای صفحه روی دکمه «Add New» کلیک کنید تا صفحه‌ای جدید در وردپرس ایجاد شود. برای این صفحه یک عنوان انتخاب کرده و در بخش shortcode عبارت «[theme-my-login]» را وارد کنید.

استفاده از پلاگین Theme My Login

اکنون می‌توانید صفحه لاگین خود را مشاهده و منتشر کنید.

استفاده از پلاگین Theme My Login

همین مراحل را برای ایجاد صفحات دیگر با استفاده از کدهای کوتاه زیر، ایجاد کنید:

برای فرم ثبت‌نام:

  • [theme-my-login action=”register”]

برای فراموشی رمز عبور:

  • [theme-my-login action=”lostpassword”]

برای تعیین مجدد رمز عبور:

  • [theme-my-login action=”resetpass”]

ایجاد صفحه ورود سفارشی با استفاده از پلاگین WPForms

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

WPForms پلاگینی پولی است که برای دسترسی باید یکی از پلن‌های آن را تهیه نمایید.

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

استفاده از پلاگین WPForms

پس از وارد کردن کلید، می‌توانید افزونه‌های مورد نظر خود را نیز نصب کنید. افزونه‌ها را در بخش «Addons» می‌توانید بیابید.

استفاده از پلاگین WPForms

با کلیک بر روی «Add New» و در بخش پایین این صفحه، قالب‌هایی برای ایجاد فرم لاگین قرار داده شده‌اند.

استفاده از پلاگین WPForms

این فرم با فیلدهای مورد نیاز برای شما ایجاد خواهند شد، اما در صورت نیاز با مراجعه به تب «Fields» می‌توانید موارد دلخواه خود را اضافه کنید.

استفاده از پلاگین WPForms

همچنین می‌توانید تعیین کنید که به هنگام لاگین کاربر به سایت، چه اتفاقی بیافتد. به این منظور به بخش setting و سپس تب confirmation بروید.

استفاده از پلاگین WPForms

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

استفاده از پلاگین WPForms

پس از انتخاب و تعیین تمام تنظیمات خود، روی دکمه «Save» کلیک کنید تا تمام تغییرات ذخیره شوند.

فرم لاگین خود را به یک صفحه وردپرس اضافه کنید

به‌سادگی می‌توانید با استفاده از WPForms، فرم لاگین خود را به هر صفحه‌ای از وردپرس اضافه کنید.

استفاده از پلاگین WPForms

به صفحه‌ای که از پیش در وردپرس ایجاد کرده‌اید بروید و بر روی ویرایش صفحه کلیک کنید یا اینکه صفحه‌ای جدید ایجاد کرده و بلوک WPForms را به بخش محتوای صفحه اضافه کنید. سپس فرمی را که خودتان از قبل ایجاد کرده‌اید انتخاب کنید تا به‌صورت خودکار به آن صفحه اضافه شود.

فرم لاگین خود را به یک صفحه وردپرس اضافه کنید

اکنون تنها کافی است تغییرات نهایی خود را اعمال و در نهایت صفحه را منتشر کنید.

طراحی فرم لاگین وردپرس خود را سفارشی کنید

طراحی فرم لاگین وردپرس خود را سفارشی کنید

به‌طور پیش‌فرض، فرم لاگین موجود در وردپرس شما، از طرح تم قالب و استایل آن استفاده می‌کند. ناوبری منو، هدر، فوتر و ویجت‌های کنار صفحه از طرح تم پیروی می‌کنند.

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

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

لوگو و URL فرم لاگین وردپرس را تغییر دهید

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

تنها با استفاده از پلاگین وردپرس یا بکار بردن کدهای مورد نظر، لوگوی خود را جایگزین لوگوی وردپرس در صفحه لاگین کنید. در ادامه به بررسی این دو روش برای تغییر لوگو می‌پردازیم.

تغییر لوگو و URL لاگین وردپرس با استفاده از پلاگین

اولین کاری که در این مرحله باید انجام دهید، نصب و فعال کردن پلاگین Colorlib Login Customizer است.

پس از فعال کردن پلاگین، منوی جدیدی با برچسب Login Customizer به سایدبار وردپرس اضافه می‌شود. با کلیک بر روی این منو، پلاگین نیز راه‌اندازی خواهد شد.

طراحی فرم لاگین وردپرس خود را سفارشی کنید

این پلاگین، صفحه لاگین پیش‌فرض وردپرس را با گزینه‌هایی برای شخصی‌سازی آن برای شما بارگذاری می‌کند.

به‌منظور جایگزینی لوگوی خود با لوگوی وردپرس، روی تب «Logo Options» در سمت راست صفحه کلیک کنید. در این بخش می‌توانید لوگوی وردپرس را مخفی کرده و لوگوی خود را بارگذاری کنید و URL و متن آن را نیز تغییر دهید.

طراحی فرم لاگین وردپرس خود را سفارشی کنید

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

در واقع می‌توانید بدون تغییر URL لاگین وردپرس، صفحه لاگین مورد نظر خود را داشته باشید.

پس از پایان اعمال تغییرات، بر روی دکمه انتشار کلیک کنید.

تغییر لوگو و URL لاگین وردپرس با استفاده از پلاگین

تغییر لوگو و URL لاگین وردپرس بدون پلاگین

در این روش می‌توانید بدون نصب هیچ پلاگینی، لوگوی خود را جایگزین لوگوی وردپرس کنید.

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

سپس کدهای زیر را در فایل functions.php تم خود ذخیره کنید:

function wpb_login_logo() { ?>

<style type=”text/css”>

#login h1 a, .login h1 a {

background-image: url(https://path/to/your/custom-logo.png);

height:100px;

width:300px;

background-size: 300px 100px;

background-repeat: no-repeat;

padding-bottom: 10px;

}

</style>

<?php }

add_action( ‘login_enqueue_scripts’, ‘wpb_login_logo’ );

در اینجا باید URL تصویری که قبلاً آپلود کرده‌اید جایگزین URL فعلی کنید. همچنین می‌توانید کدهای CSS و ویژگی آن‌ها را به‌دلخواه تغییر دهید تا با تصویر شما هماهنگی داشته باشد.

تغییر لوگو و URL لاگین وردپرس با استفاده از پلاگین

تا اینجا، تنها لوگو را جایگزین کرده‌اید و باید لینک آن را نیز تغییر دهید.

با ذخیره کدهای زیر در همان فایل function.php می‌توانید به این هدف برسید.

 

function wpb_login_logo_url() {

return home_url();

}

add_filter( ‘login_headerurl’, ‘wpb_login_logo_url’ );

 

function wpb_login_logo_url_title() {

return ‘Your Site Name and Info’;

}

add_filter( ‘login_headertitle’, ‘wpb_login_logo_url_title’ );

 

البته فراموش نکنید که نام سایت و اطلاعات مربوط به آن را در «Your Site Name and Info» جایگزین کنید. اکنون، لوگوی موجود در صفحه لاگین، به صفحه اصلی سایتتان اشاره دارد.

با مطالعه این مقاله، قادر خواهید بود یکی از بهترین صفحات لاگین را برای سایت خود در نظر بگیرید. تنها کافی است معیار و ویژگی‌های مورد نظر خود را تعیین کنید.

ابزار بهینه سازی وب هاست ایران

افزودن دیدگاه

کلیک برای ثبت دیدگاه