سفارشی سازی صفحه ورود به پیشخوان وردپرس

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

Domain.com/wp-admin
Domain.com/wp-login.php
Domain.com/login

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

صفحه ورود به پیشخوان وردپرسی برای مدیر سایت در حالت پیشفرض بصورت زیر است:

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

غیرفعال کردن تغییر زبان در صفحه ورود به وردپرس

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

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

برای غیرفعال کردن گزینه انتخاب زبان در صفحه ورود به پیشخوان وردپرس کافی است آنها را کپی کرده و در فایل Functions.php قالب یا پوسته فرزند قالب خود قرار دهید و یا طبق روش “افزودن کد سفارشی PHP و CSS و JS به وردپرس” به راحتی از این کدها در افزونه‌هایی همچون FluentSnippets و Code Snippets و WPCode استفاده نمایید.

add_filter( 'login_display_language_dropdown', '__return_false' );

بعد از استفاده از این کد و بدون نیاز به استفاده از هیچ افزونه‌ای، خواهید دید که به راحتی این سلکتور زبان از این صفحه حذف خواهد شد.

تغییر لوگو صفحه ورود به داشبورد وردپرس

شاید برای یک سایت و بطور کلی برندینگ یک کسب و کار اصلا جالب نباشد که در صفحه ورود وردپرس لوگوی پیشفرض وردپرس نمایش داده شود. احتمالا شما هم مثل من تصمیم گرفته‌اید که لوگوی وردپرس (همان W معروف) را تغییر دهید و می‌خواهید لوگوی اصلی سایت خودتان را قرار دهید.
برای این کار می‌توانید از کد PHP زیر استفاده کنید و آن را در فایل Functions.php یا افزونه FluentSnippets قرار دهید:

function wpb_login_logo() { ?>
<style type="text/css">
#login h1 a, .login h1 a {
background-image: url(http://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' );

در کد بالا به جای http://logo.png آدرس دقیق لوگوی دلخواه خود را قرار دهید. به عنوان لوگو می‌توانید هر تصویر با فرمت svg یا webp یا avif یا jpg و png و غیره را قرار دهید.
مقادیر height و background-size را می‌توانید بر حسب ابعاد و نسبت ابعادی عکس خود شخصی سازی کنید.

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

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

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

function remove_wordpress_logo_in_login() { ?>
        <style type="text/css">
            body.login div#login h1 a {
                background-image: none;
                background-size: 0 0;
                height: 0;
                margin: 0 auto 0;
                width: 0;
            }
        </style>
    <?php
    }
add_action('login_enqueue_scripts', 'remove_wordpress_logo_in_login');

تغییر لینک لوگو صفحه ورود وردپرس

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

برای این کار کافی است از کد زیر استفاده کنیم و به جای http://www.example.com آدرس دلخواه خودمان را قرار دهیم.

add_filter( 'login_headerurl', 'my_custom_login_url' );
function my_custom_login_url($url) {
    return 'http://www.example.com';
}

افزودن یک پیغام شخصی به صفحه ورود به داشبورد وردپرس

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

function custom_login_message() {
$message = '<p class="message">Welcome, if you haven\'t already read our <a href="#">terms of service</a> please do so before you register.</p><br />';
return $message;
}
add_filter('login_message', 'custom_login_message');

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

تغییر پس‌زمینه صفحه ورود به داشبورد وردپرس

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

function my_login_page_custom_bg_image() {
$bgImageUrl = 'https://cusmin-bg.jpg';
?>
<style type="text/css">
  body{
    background-image:url('<?php echo $bgImageUrl; ?>') !important;
    background-size:cover !important;
    background-position:center center !important;
  }
</style>
<?php }

add_action( 'login_enqueue_scripts', 'my_login_page_custom_bg_image' );

در نهایت در کد بالا باید به جای عبارت https://cusmin-bg.jpg آدرس دقیق عکس پس‌زمینه دلخواه خود را قرار دهید.

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

function my_custom_login() { 
    ?>
    <style>
        /* Body style */
        body {
            background: linear-gradient(0deg, #0b4182 1%, #1e88e5 100%) fixed;
        }
    </style>
    <?php
}
add_action('login_head', 'my_custom_login');

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

حذف کلمه وردپرس از عنوان صفحه ورود ادمین وردپرس

اگر به عنوان یا همان Title صفحه ورود به داشبورد وردپرس دقت کنید، می‌بینید که بصورت ورود ‹ نام سایت شما — وردپرس می‌باشد که در سورس کد این صفحه در تگ title بصورت زیر قرار دارد:

<title>ورود &lsaquo; نام سایت شما &#8212; وردپرس</title>

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

function custom_admin_login_title($admin_title, $title) {
        return get_bloginfo('name').' ⮜ '.$title;
    }
    add_filter('login_title', 'custom_admin_login_title', 10, 2);

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

نام سایت شما ⮜ ورود

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

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

برای حذف لینک رمز عبورتان را گم کرده‌اید می‌توانید از کدهای زیر استفاده کنید:

// Remove Lost Password Link
function vpsb_remove_lostpassword_text ( $text ) {
         if ($text == 'رمز عبورتان را گم کرده‌اید؟'){$text = '';}
                return $text;
         }
add_filter( 'gettext', 'vpsb_remove_lostpassword_text' );

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

http://www.example.com/wp-login.php?action=lostpassword

برای بستن دسترسی به صفحه “رمز فراموش شده” با لینک زیر می‌توانید از کد زیر استفاده نمایید:

// Disable Password Reset URL & Redirect
function vpsb_disable_lost_password() {
    if (isset( $_GET['action'] )){
        if ( in_array( $_GET['action'], array('lostpassword', 'retrievepassword') ) ) {
            wp_redirect( wp_login_url(), 301 );
            exit;
        }
    }
}
add_action( "login_init", "vpsb_disable_lost_password" );

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

حذف لینک رفتن به سایت (Go to Site) از صفحه ورود پیشخوان وردپرس

در صفحه ورود به داشبورد وردپرس یک لینک با عنوان رفتن به سایت (Go to Site) وجود دارد که هنگامی که کاربر روی آن کلیک می‌کند او را به صفحه اصلی سایت هدایت می‌کند.

برای حذف لینک رفتن به سایت (Go to Site) از صفحه ورود پیشخوان وردپرس می‌توانید از کد زیر استفاده کنید:

function remove_site_link($link) {
    return '';
}
add_filter('login_site_html_link', 'remove_site_link');

تغییر مدت اعتبار مرا به خاطر بسپار در فرم صفحه ورود به سایت وردپرس

وقتی گزینه “Remember Me” رو در صفحه ورود وردپرس انتخاب می‌کنید، یک کوکی روی کامپیوترتان ذخیره می‌شود. این کوکی حاوی اطلاعاتیه که باعث میشه وقتی دوباره به سایت برگردید، به صورت خودکار وارد حساب کاربریتون بشید.

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

به صورت پیش‌فرض، مدت اعتبار کوکی “Remember Me” بر روی 14 روز تنظیم شده است. حتی اگه مرورگرت رو ببندی یا کامپیوترت رو خاموش کنی، اگه تا 14 روز بعد به سایت برگردی، به صورت خودکار وارد حساب کاربریت می‌شی.

برای تغییر مدت اعتبار کوکی گزینه مرا به خاطر بسپار در فرم ورود به سایت می‌توانید از کد زیر استفاده نمایید:

function custom_remember_me_expiration( $expiration ) {
    return 60 * 60 * 24 * 30; // 30 days
}
add_filter( 'auth_cookie_expiration', 'custom_remember_me_expiration' );

این کد مدت اعتبار کوکی رو به 30 روز تنظیم می‌کنه. می‌تونی این مقدار رو به هر مدت زمانی که می‌خوای تغییر بدی.

گزینه “Remember Me” به صورت پیش‌فرض انتخاب نشده و تیک نخورده است، ولی اگه کاربرانی داری که فراموش‌کار هستن و این گزینه رو انتخاب نمی‌کنن، می‌تونی اون رو به صورت خودکار فعال کنی. با استفاده از کد زیر این گزینه بصورت پیش‌فرض تیک خورده میشه:

function login_checked_remember_me() {
add_filter( 'login_footer', 'rememberme_checked' );
}
add_action( 'init', 'login_checked_remember_me' );

function rememberme_checked() {
echo "<script>document.getElementById('rememberme').checked = true;</script>";
}

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