10 шагов к созданию профессионально выглядящего администратора WordPress

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

Брендинг администратора WordPress - это не только дизайн, это может быть умный способ саморекламы также. В этой статье мы рассмотрим, как вы можете настроить панель управления WordPress и страницу входа в систему, добавить собственный логотип, удалить или изменить элементы меню, удалить ссылки, указывающие на WordPress.org, а также настроить многие другие параметры администратора с помощью помощь плагина AG Custom Admin Panel.

1. Установите плагин AG Custom Admin

Прежде всего, перейдите к Плагины> Добавить новый пункт меню администратора на панели инструментов WordPress, найдите AG Custom Admin Плагин, установите и активируйте его. Плагин размещает новое подменю под названием AG Custom Admin внутри инструменты меню и кнопка на верхней панели администратора, чтобы помочь вам быстро добраться до настроек.

2. Общие настройки

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

Первый вариант в общих настройках “Исключить администратора AGCA из настроек” где вы можете быстро включить и выключить настройки для пользователей с правами администратора. Это может быть полезно, если вы хотите, чтобы пользователи с ролью администратора видели панель управления WordPress по умолчанию.

Следующие две настройки скрыть или показать “Параметры экрана” и “Помогите” меню расположен в верхнем правом углу каждой страницы администратора (см. ниже). Слишком много вариантов может сбить с толку тех, кто разбирается в технологиях, поэтому может быть хорошей идеей избавиться от этих двух вариантов.

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

3. Скрыть или настроить панель администратора

Настройки админ-панели Вкладка поможет вам скрыть или настроить админ-панель, горизонтальное меню сверху. Вы можете полностью скрыть это из панели администратора, и показывать только стильную кнопку выхода в правом верхнем углу.

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

На скриншоте ниже я изменил заголовок блога на “Сменить вид” чтобы указать, что это место, где они могут переключаться между внешним и внутренним интерфейсом.

Я также полностью удалил логотип WordPress, но не заменил его на логотип Hongkiat, так как скорее добавлю его в вертикальное меню администратора (Шаг 7). На следующем шаге я перейду к полностью удаленной панели администратора..

4. Бренд нижнего колонтитула

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

5. Очистите приборную панель

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

В первой настройке вы можете изменить текст заголовка от слова “Приборная доска” к вашему собственному бренду, и вы также можете добавить свой собственный контент под ним.

Это может определенно помочь пользователям, если вы разместить “Больше информации” ссылка под заголовком (как я это сделал на скриншоте ниже). Таким образом, они могут легко добраться до вас. Быстрый “Добро пожаловать в нашу админку” интро также может быть полезным.

Плагин AG Custom Admin также позволяет скрыть виджеты приборной панели по одному. Я оставляю только два, чтобы сделать мой фирменный админ менее загроможденным. Если вы прячете виджеты здесь они не будут доступны для пользователей из “Параметры экрана” меню.

Моя настроенная панель управления WordPress выглядит следующим образом, все ссылки на WordPress.org исчезли, и она выглядит чище и понятнее.

6. Добавьте свой логотип на страницу входа

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

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

7. Измените меню администратора слева

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

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

Вы можете сделать не только элементы верхнего меню невидимыми, но и подменю; просто нажмите на меню верхнего уровня, и появится удобный выпадающий список. Кроме того, вы можете переименуйте ярлыки во что-то, что легче понять для мирян, так же, как я сделал это с “Приборная доска”, “Средства массовой информации”, а также “Внешность” этикетки ниже.

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

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

Я переименовал 3 пункта меню (новые “Admin Home”, “Изображений”, а также “дизайн”), удалил “Plugin” меню и добавил радиус 10px к углам всплывающих окон подменю.

Вот как это выглядит:

8. Раскрась Админа

Colorizer Вкладка позволяет оживить вашего администратора WordPress изменение цвета текста и фона основных элементов. Функция colorizer работает в режиме реального времени, поэтому, когда вы выбираете новый цвет, вы можете сразу увидеть изменение без сохранения настроек..

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

Вы можете изменить не только цвета панели администратора, но и цвет фона страницы входа..

9. Добавить свой код

Если вы опытный фронтенд-разработчик, вы можете добавьте свой собственный код CSS и JavaScript в админку также. С помощью инструментов разработчика вашего браузера вы можете легко получить CSS-селектор элемента, который вы хотите изменить.

На этом этапе я расширяю панель на странице входа в систему с помощью следующего фрагмента кода:

 #login width: 480px; максимальная ширина: 90%; поле: 0 авто; 

Как вы можете видеть, панель входа стала шире, но все еще отзывчива благодаря Максимальная ширина править. Скорее всего, это изменение обеспечит лучший опыт для большинства пользователей. Вы даже можете сохранить свой собственный код, экспортировав его в .Агджа файл, а затем импортировать его на другие сайты WordPress.

10. Установите предварительно подготовленную тему администратора

Последняя вкладка называется Администратор Темы позволяет вам установить предварительно подготовленную тему администратора поверх ваших настроек. Если вы это сделаете, вы потеряете пользовательские цвета, которые вы установили на вкладке Colorizer, но все равно сможете сохранить другие настройки..

Большинство административных тем здесь не бесплатны (вот 10 тем для WordPress), но покупка одной из них может стать отличным способом поддержать авторов этого замечательного плагина..