Меняем дизайн страницы входа в админпанель Joomla

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

Мы собираемся сделать пару модификаций, чтобы сделать его более визуально ошеломляющим. Сначала мы заменим логотип Joomla на собственный логотип компании (или что-либо еще, что вы захотите). Следуйте инструкциям ниже.

 

  • Войдите в свой бэкэнд Joomla.
  • Перейдите в Расширения> Шаблоны> Стили.
  • Переключиться на список шаблонов администратора.

Рисунок: переход к списку шаблонов администратора.

  • Откройте шаблон isis-default.
  • Нажмите на вкладку «Дополнительно» в меню.

Рисунок: вкладка «Дополнительно» меню шаблона isis-default.

  • Загрузите логотип в опцию логотипа входа. И увидеть изменения.

Рисунок: Изменение логотипа для входа.

Это результат добавления логотипа.

Рисунок: логотип входа был изменен.

Теперь мы собираемся изменить фон шаблона входа администратора, а также макет поля входа.

Зайдите по FTP в папку administrator/templates isis/css и создайте файл custom.css.
Теперь перейдите в administrator/templates/isis/images и добавьте фоновое изображение.

Теперь пришло время заняться магией CSS. Добавьте следующий CSS в custom.css и посмотрите изменения.

.view-login {
background: url('/Your Image')
no-repeat fixed 50% 50% / cover #eff0f4 !important;
}

.login.well {
background: none repeat scroll 0 0 rgba(245, 245, 245, 0.79);
}

.view-login .well hr {
border-color: transparent;
}

*Вместо Your Image вставьте адрес вашей картинки для фона

Это окончательный вид. Разве это не так круто?

Рисунок: фон страницы входа администратора и логотип были изменены.

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

*эта статья, перевод отличного руководства ребят из JoomShaper, оригинал по ссылке

Комментировать статью:

blog comments powered by Disqus
Translate
Russian English French German Italian Portuguese Spanish
Latest SocButtons
Latest SocComments
Latest Socshare