null

WordPress — как изменить страницу входа в админ панель (админку) сайта?

Здравствуйте с друзьями в данной записи я поделюсь с вами тем как придать фирменный стиль для сайта который Вы создаете для той или иной организации. Причём важно понимать что фирменный стиль важен не только для сайта организации а по сути для любого вашего клиента, так как подчеркивает и ваш профессионализм, и радует клиента заботой о нём с вашей стороны.

Для того чтобы кастомизировать страницу входа WordPress достаточно применить код в файле function.php, добавить файл стилей — в данном случае файл _SDStudio_login_styles.css. В который необходимо добавить стили оформления страницы.

 

Ниже находится код который подключает файл оформления страницы входа в function.php:

/* Кастомизированная страница входа в WordPress */
function custom_login_css() {
echo '<link rel="stylesheet" ENGINE="text/css" href="'.get_stylesheet_directory_uri().'/_SDStudio_login_styles.css" />';
/* JS код для страницы входа wp-admin - при клике по лого переходим на главную*/
echo "<script>\n";
echo "jQuery( document ).ready(function( $ ) {\n";
echo "$('#login > h1 > a').on(\"click\", function() {\n";
echo "window.location.href='/';\n";
echo "return false;\n";
echo "  });\n";
echo "});\n";
echo "</script>";
}
add_action('login_head', 'custom_login_css');

Данный вариант в случае если переход по клику на лого срабатывает на страницу WordPress:

/* Кастомизированная страница входа в WordPress */
function custom_login_css() {
echo '<link rel="stylesheet" type="text/css" href="'.get_stylesheet_directory_uri().'/_SDStudio_login_styles.css" />';
?>
<!-- Подключение jQuery -->
<script type='text/javascript' src='/wp-includes/js/jquery/jquery.js'></script>
<!-- JS код для страницы входа wp-admin - при клике по лого переходим на главную*/ -->

<script>
jQuery( document ).ready(function( $ ) {
$('.login h1 a').on("click", function() {
window.location.href='/';
return false;
  });
});
</script>";

<?php
}
add_action('login_head', 'custom_login_css');

Содержимое _SDStudio_login_styles.css (не забудьте создать данный файл вкорне вашей темы):

/* Background WordPress Login Page */
body.login {
        background: linear-gradient(rgb(255, 255, 255), rgba(255, 255, 255, 0.37)), transparent url('/wp-content/uploads/2017/12/StockSnap_959IURDRGJ-1-1200x800.jpg') center center/cover no-repeat fixed;
}
/* Logo */
.login h1 a {
    background-image: url('/wp-content/uploads/2017/12/ORGANIZATION_LOGO_ONLY.jpg');
    background-size: 150px 150px;
    width: 150px;
    height: 150px;
}

Обратите внимание на файл StockSnap_959IURDRGJ-1-1200×800.jpg который прописан в стилях в качестве бекграунда (бекграунд на любой случай жизни Вы можете найти по данной ссылке, ), и на файл ORGANIZATION_LOGO_ONLY.jpg который используется в качестве логотипа компании.

За частую сразу после кастомизации страницы для входа в вордпресс, я прописываю свой код для горячих клавиш:

WordPress и горячие клавиши на Java Script