Как кастомизировать страницу входа в WordPress без плагинов

Страница входа в WordPress — это первое, что видит пользователь при заходе в админ-панель. Обычный стандартный вид может выглядеть скучно и не соответствовать стилю вашего сайта или бренда. В этой статье мы подробно рассмотрим, как кастомизировать страницу входа без плагинов, используя собственные функции и стили, что поможет сделать сайт более профессиональным и уникальным.

Почему стоит кастомизировать страницу входа WordPress

Кастомизация страницы входа полезна не только с эстетической точки зрения. Она позволяет:

• Улучшить пользовательский опыт для клиентов или сотрудников;
• Повысить уровень безопасности, скрывая стандартные элементы;
• Подчеркнуть фирменный стиль и сделать интерфейс более дружелюбным;
• Избавиться от необходимости устанавливать дополнительные плагины, что уменьшает нагрузку на сайт.

Всё это можно сделать, добавляя код в файл functions.php вашей темы или в отдельный кастомный плагин, что дает полный контроль и гибкость.

Основные способы кастомизации страницы входа в WordPress

Изменение логотипа и ссылки на логотипе

По умолчанию WordPress выводит свой логотип, который ведет на wordpress.org. Мы можем заменить его на логотип вашего сайта и изменить ссылку.

function wpkey_custom_login_logo() {
    echo '<style>
        .login h1 a {
            background-image: url(' . get_stylesheet_directory_uri() . '/images/custom-logo.png) !important;
            width: 320px;
            height: 80px;
            background-size: contain;
        }
    </style>';
}
add_action('login_enqueue_scripts', 'wpkey_custom_login_logo');

function wpkey_custom_login_logo_url() {
    return home_url();
}
add_filter('login_headerurl', 'wpkey_custom_login_logo_url');

function wpkey_custom_login_logo_url_title() {
    return get_bloginfo('name');
}
add_filter('login_headertext', 'wpkey_custom_login_logo_url_title');

Замените /images/custom-logo.png на путь к вашему логотипу в теме. Этот код изменит логотип и ссылку под ним.

Кастомизация стилей страницы входа

Можно изменить фон, шрифты, цвета кнопок и другие элементы.

function wpkey_custom_login_styles() {
    echo '<style>
        body.login {
            background-color: #f0f4f8;
        }
        .login form {
            background: #ffffff;
            border: 1px solid #d1d1d1;
            padding: 26px 24px;
            box-shadow: 0 1px 3px rgba(0,0,0,0.13);
        }
        .login label {
            font-weight: 600;
            color: #333333;
        }
        .login #wp-submit {
            background-color: #0073aa;
            border-color: #006799;
            box-shadow: none;
            text-shadow: none;
        }
        .login #wp-submit:hover {
            background-color: #005177;
            border-color: #004466;
        }
    </style>';
}
add_action('login_enqueue_scripts', 'wpkey_custom_login_styles');

Этот пример придаст странице более современный и чистый вид, который легко адаптировать под ваши цвета.

Добавление собственного текста и ссылок под формой входа

Иногда нужно добавить подсказки или полезные ссылки, например, на страницу восстановления пароля или контакты поддержки.

function wpkey_custom_login_message($message) {
    if (empty($message)) {
        return '<p class="custom-login-message">Если у вас возникли проблемы с входом, обратитесь в нашу <a href="' . esc_url(home_url('/contact')) . '">службу поддержки</a>.</p>';
    } else {
        return $message;
    }
}
add_filter('login_message', 'wpkey_custom_login_message');

Замените /contact на нужный URL вашей страницы поддержки. Сообщение появится над формой входа.

Безопасность страницы входа: скрываем ошибки и меняем URL

Для повышения безопасности рекомендуется не показывать точные причины ошибок входа, чтобы злоумышленники не получали подсказок. Вот как это сделать:

function wpkey_login_error_override() {
    return 'Неверный логин или пароль.';
}
add_filter('login_errors', 'wpkey_login_error_override');

Также для защиты можно изменить стандартный URL страницы входа с /wp-login.php на кастомный с помощью плагинов или собственного кода, хотя это уже выходит за рамки чистой кастомизации без плагинов.

Полезные плагины для расширенной кастомизации страницы входа

Если вы хотите больше возможностей без программирования, обратите внимание на плагины:

• Clearfy Pro — помогает оптимизировать и защитить сайт, в том числе улучшая безопасность входа.
• My Popup — позволяет показывать пользовательские всплывающие окна, которые можно интегрировать и на страницу входа.

Однако если нужен полный контроль и минимизация нагрузки, лучше реализовать кастомизацию с помощью кода, как описано выше.

Заключение

Кастомизация страницы входа в WordPress без плагинов — это отличный способ сделать сайт уникальным и повысить удобство для пользователей, а также усилить безопасность. Используя хуки login_enqueue_scripts, login_headerurl, login_message и другие, вы сможете реализовать практически любые изменения.

Не забывайте делать резервные копии перед изменениями и тестировать изменения на тестовом сайте.