Изменение фона входа в административную панель — различия между версиями
Mad grant (обсуждение | вклад) |
Vitaliks (обсуждение | вклад) |
||
| (не показаны 2 промежуточные версии 2 участников) | |||
| Строка 1: | Строка 1: | ||
| − | |||
| − | + | '''Актуально для версии 20''' | |
| + | |||
| + | == Задача == | ||
| + | |||
| + | Иногда может возникнуть необходимость изменить стандартный фон входа в административную панель, причем не просто поменять картинку, а добавить что-то интересное. В качестве примера заменим стандартную картинку UMI.CMS на другую. | ||
| + | |||
| + | == Решение == | ||
| + | |||
| + | === Решение для Modern === | ||
| + | |||
| + | Для изменения фона страницы авторизации нужно отредактировать файл /styles/skins/modern/design/css/mainLogin.css | ||
Нас интересует следующий участок кода: | Нас интересует следующий участок кода: | ||
| − | <source lang=" | + | <source lang="css"> |
| + | body { | ||
| + | background-image: linear-gradient(transparent 70%, #082d42 100%), radial-gradient(circle farthest-side, #0077c5 0px, #045684 70%, #082d42 100%); | ||
| + | height: 100%; | ||
| + | overflow: hidden; | ||
| + | width: 100%; | ||
| + | } | ||
| + | </source> | ||
| + | |||
| + | По умолчанию фон задается при помощи CSS градиентов, можно поменять цвет или установить свое изображение для фона: | ||
| + | <source lang="css"> | ||
body { | body { | ||
| − | + | background: url(/images/cms/admin/mac/common/bg.jpg) center center; | |
| − | + | height: 100%; | |
| − | + | overflow: hidden; | |
| − | + | width: 100%; | |
| + | } | ||
</source> | </source> | ||
| − | + | ||
| + | Иногда может потребоваться убрать эффект параллакса, для этого необходимо в файле /styles/skins/modern/main_login.xsl удалить или закомментировать следующий код: | ||
<source lang="xml"> | <source lang="xml"> | ||
| − | + | <div class="bubbles" /> | |
| − | + | <div class="bubbles-front" /> | |
| − | |||
| − | |||
| − | |||
| − | |||
</source> | </source> | ||
| − | + | ||
| − | + | А так же в файле /styles/skins/modern/design/js/mainLogin.js удалить или закомментировать строку: | |
| − | <source lang=" | + | <source lang="js"> |
| − | < | + | initBubbles(); |
| − | < | + | </source> |
| + | |||
| + | === Решение для Butterfly (mac) === | ||
| + | |||
| + | Нам необходимо отредактировать файл /styles/skins/mac/main_login.xsl | ||
| + | |||
| + | Нас интересует следующий участок кода: | ||
| + | <source lang="css"> | ||
| + | body { | ||
| + | background: url(/images/cms/admin/mac/common/bg1.jpg) center center; | ||
| + | height: 100%; | ||
| + | margin: 0; | ||
| + | } | ||
</source> | </source> | ||
| − | + | Тут мы меняем стандартное изображение UMI.CMS на альтернативное: | |
| − | <source lang=" | + | <source lang="css"> |
| − | + | body { | |
| − | + | background: url(/images/cms/admin/mac/common/bg.jpg) center center; | |
| − | + | height: 100%; | |
| − | + | margin: 0; | |
| + | } | ||
</source> | </source> | ||
| − | |||
| − | + | ||
| + | Теперь при заходе в административную панель мы сможем наслаждаться новым фоном. | ||
| + | |||
| + | === Внимание === | ||
| + | |||
| + | В данный момент все внесенные изменения исчезнут после обновления системы. Чтобы это не произошло, рекомендуем воспользоваться статьей [[Добавление нового дизайна административной панели]] или документацией [http://api.docs.umi-cms.ru/razrabotka_nestandartnogo_funkcionala/peregruzka_shablonov_administrativnogo_interfejsa/ Перегрузка шаблонов административного интерфейса] | ||
[[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]] | [[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]] | ||
Текущая версия на 09:49, 8 мая 2019
Актуально для версии 20
Задача
Иногда может возникнуть необходимость изменить стандартный фон входа в административную панель, причем не просто поменять картинку, а добавить что-то интересное. В качестве примера заменим стандартную картинку UMI.CMS на другую.
Решение
Решение для Modern
Для изменения фона страницы авторизации нужно отредактировать файл /styles/skins/modern/design/css/mainLogin.css
Нас интересует следующий участок кода:
body {
background-image: linear-gradient(transparent 70%, #082d42 100%), radial-gradient(circle farthest-side, #0077c5 0px, #045684 70%, #082d42 100%);
height: 100%;
overflow: hidden;
width: 100%;
}
По умолчанию фон задается при помощи CSS градиентов, можно поменять цвет или установить свое изображение для фона:
body {
background: url(/images/cms/admin/mac/common/bg.jpg) center center;
height: 100%;
overflow: hidden;
width: 100%;
}
Иногда может потребоваться убрать эффект параллакса, для этого необходимо в файле /styles/skins/modern/main_login.xsl удалить или закомментировать следующий код:
<div class="bubbles" />
<div class="bubbles-front" />
А так же в файле /styles/skins/modern/design/js/mainLogin.js удалить или закомментировать строку:
initBubbles();
Решение для Butterfly (mac)
Нам необходимо отредактировать файл /styles/skins/mac/main_login.xsl
Нас интересует следующий участок кода:
body {
background: url(/images/cms/admin/mac/common/bg1.jpg) center center;
height: 100%;
margin: 0;
}
Тут мы меняем стандартное изображение UMI.CMS на альтернативное:
body {
background: url(/images/cms/admin/mac/common/bg.jpg) center center;
height: 100%;
margin: 0;
}
Теперь при заходе в административную панель мы сможем наслаждаться новым фоном.
Внимание
В данный момент все внесенные изменения исчезнут после обновления системы. Чтобы это не произошло, рекомендуем воспользоваться статьей Добавление нового дизайна административной панели или документацией Перегрузка шаблонов административного интерфейса
