Как в Вордпрессе изменить логотип на странице входа на сайт
В этой статье я покажу, как на экране авторизации с помощью кода вы сможете заменить стандартный логотип WordPress на свой.
Итак, вы пытаетесь залогиниться на сайт через страницу wp-login.php. На экране вы видите стандартный логотип Вордпресса:
Вам он не нужен, вы хотите чтобы вместо него отображался ваш логотип. Причем, чтобы ссылка вела на ваш сайт, а не на сайт Вордпресса. Чтобы это исправить, вам нужно будет добавить следующий код в файл functions.php:
<?php
/* Это мы вставили - Начало */
function editLoginPage() { ?>
<style type="text/css">
#login h1 a {
background-image: url(https://webgolovolomki.com/wp-content/themes/golovolomka/img/icons/help.svg);
display: block;
width: 272px;
height: 92px;
background-size: auto;
}
</style>
<?php }
add_action('login_enqueue_scripts', 'editLoginPage');
function editLoginPageTitle() {
return 'Web Головоломки';
}
add_action('login_headertext', 'editLoginPageTitle');
function editLoginPageTitleUrl() {
return 'https://webgolovolomki.com';
}
add_action('login_headerurl', 'editLoginPageTitleUrl');
/* Это мы вставили - Конец */
?>Теперь наша страница входа будет выглядеть вот так:
Давайте теперь подробно разберем, что мы сделали.
Мы прописали три функции: первая функция (editLoginPage) добавляет на страницу wp-login нужные нам стили. По умолчанию логотип WordPress прописан в стилях, и мы с помощью добавления своих стилей переписываем это.
Вам нужно только поменять значение в свойстве background-image. Вставьте туда ссылку на свой логотип. Также подставьте нужные значения в height и width, в зависимости от размера вашего лого.
Далее, функция editLoginPageTitle меняет содержимое внутри ссылки. Вы можете ее и не добавлять, ведь содержимое скрывается под логотипом.
Чтобы было понятнее, откройте инспектор:
Обратите внимание на div с айдишкой login и все что внутри него. Теперь вы лучше понимаете, как отображается логотип на странице входа 🙂
И последняя, третья функция editLoginPageTitleUrl возвращает нам адрес сайта, на который будет совершен переход, когда пользователь кликнет на лого. Вставьте свое значение.
После этого мы добавляем наши функции к определенным событиям (action).
В конце статьи добавил видео. Я постарался подробно объяснить, как изменить логотип на странице входа в WordPress.
Если остались вопросы или что-то не получается — пишите в комментариях.
