Меняем логотипы WordPress на свои в админке и при входе

Меняем логотипы WordPress на свои в админке и при входе

Все мы собственники, кто-то больше кто-то меньше, а иногда просто необходимо прикрыть истинные корни и выдать желаемое за действительное. К чему я это? Да к тому, что иногда либо хочется, либо нужно сменить логотипы WordPress на свои в админ-панели и при входе на сайт (страница wp-login.php). Возможно это не очень красиво по отношению к разработчикам, но разработчики WordPress сами предоставляют такую возможность, по средствам фильтров, так упрощающих настройку WordPress, без редактирования исходных файлов. Разработчики WordPress щедрые ребята и работают во имя прогресса, а не за лишнюю копеечку в свой карман, за что стоит отдать им должное. Это пожалуй одна из составляющих популярности WordPress.

Ниже я познакомлю вас с фильтрами с помощью которых, можно сменить логотипы WordPress на свои.

Меняем логотип в админ-панели

Для этого используем хук admin_head, благодаря которому пропишем своё фоновое изображение для html элемента #header-logo:

function my_admin_logo() {
   echo '
	<style type="text/css">
		#header-logo { background:url('.get_bloginfo('template_directory').'/images/favicon.png) no-repeat 0 0 !important; }
	</style>';
}
add_action('admin_head', 'my_admin_logo');

Этот код нужно вставить в файл темы functions.php

В данном примере картинка находится в папке images нашего шаблона и называется она favicon.png. Размер этой картинки для версий WordPress 3.2+ должен быть 16х16 пикселей (для ранних версий 32х32 пикселя). Картинку разумеется нужно создать заранее. В итоге получится у нас следующие:

Свой лого в админ-панели WordPress

В качестве альтернативного варианта можно использовать файл favicon.ico (иконка сайта). Я для всех своих сайтов создаю такой файл и располагаю его в папку шаблона. favicon.ico символизирует домен сайта в результатах поиска в Яндексе, показывается во вкладках/закладках в браузере и используется в различных каталогах, поэтому, мне кажется, каждый сайт должен иметь свою иконку, причем очень желательно уникальную. Для создания иконок я использую программу Icon Lover (ссылку на скачивание к сожалению не знаю), программа платная.

Чтобы выставить иконку в качестве фоновой картинки (файл лежит в папке темы), измените /images/favicon.png на /favicon.ico.

Меняем лого при входе (wp-login.php)

Следующим шагом поменяем логотип на странице входа на сайт wp-login.php. Также создаем картинку с размерами 326х67 пикселей, кладем её в папку images нашей темы и вставляем такой год в functions.php:

function my_login_logo(){
   echo '
   <style type="text/css">
		#login h1 a { background: url('. get_bloginfo('template_directory') .'/images/logo.jpg) no-repeat 0 0 !important; }
	</style>';
}
add_action('login_head', 'my_login_logo');

Вот что у нас получится:
Свой логотип на странице входа WordPress

Теперь, можно еще изменить атрибуты тега <a>: href (ссылка на сайт wordpress.org) и title (надпись: сайт работает на WordPress). Делаем это опять через фильтры:

/* Ставим ссылку с логотипа на сайт, а не на wordpress.org */
add_filter( 'login_headerurl', create_function('', 'return get_home_url();') );

/* убираем title в логотипе "сайт работает на wordpress" */
add_filter( 'login_headertitle', create_function('', 'return false;') );

Теперь, при клике по логотипу (по ссылке) нас перекинет на главную страницу сайта, а не на wordpress.org и при наведении на логотип мы не увидим надпись "Сайт работает на WordPress".

Весь код целиком

/* Меняем картинку логотипа WP в админке */
function my_admin_logo() {
   echo '<style type="text/css">#header-logo { background:url('.get_bloginfo('template_directory').'/images/favicon.png) no-repeat 0 0 !important; }</style>';
}
add_action('admin_head', 'my_admin_logo');

/* Меняем картинку логотипа WP на странице входа */
function my_login_logo(){
   echo '<style type="text/css">#login h1 a { background: url('. get_bloginfo('template_directory') .'/images/logo.png) no-repeat 0 0 !important; }</style>';
}
add_action('login_head', 'my_login_logo');
/* Ставим ссыллку с логотипа на сайт, а не на wordpress.org */
add_filter( 'login_headerurl', create_function('', 'return get_home_url();') );
/* убираем title в логотипе "сайт работает на wordpress" */
add_filter( 'login_headertitle', create_function('', 'return false;') );

Не забудьте проверить наличие картинок по адресам путь_до_шаблона/images/favicon.png и путь_до_шаблона/images/logo.png. В случае необходимости измените адреса в коде.

П.С. Логотипы использованные в примерах принадлежат их авторам.

Рубрика: Настройка WordPress | 04 августа 2011

Предыдущие записи из рубрики `Настройка WordPress`

28 комментариев

Дмитрий, 05.08.2011 в 01:40

Спасибо, проверю как нибудь.

ОтветитьОтветить
bekass, 07.08.2011 в 02:34

Благодарю, работают!

ОтветитьОтветить
Елена, 07.08.2011 в 12:43

Спасибки за пост! тут же пошла поменять лого вордпресса на наш лого :))

ОтветитьОтветить
kama, 07.08.2011 в 15:54

Елена, пожалуйста! Вроде мелочь, а приятно видеть свой логотип 🙂

ОтветитьОтветить
Артем, 12.08.2011 в 22:28

Спасибо за актуальную информацию, как раз искал про логотип в wp-login, приходилось вручную править.

ОтветитьОтветить
Bizzaro, 27.08.2011 в 22:42

Прикольно)

ОтветитьОтветить
Сталин, 10.09.2011 в 10:29

Классно!
Утрём буржуям нос!

ОтветитьОтветить
Онколог, 14.09.2011 в 09:10

Спасибо за статью. Очень помогла.
Всем респект.

ОтветитьОтветить
ANDRE, 29.09.2011 в 01:22

Не много не понятно вот это

Теперь, можно еще изменить атрибуты тега: href (ссылка на сайт wordpress.org) и title (надпись: сайт работает на WordPress). Делаем это опять через фильтры:

именно через какие фильтры???? где они?

ОтветитьОтветить
Блуждающий Ветер, 30.09.2011 в 00:47

Давно задавался вопросом можно ли сделать что-то подобное и наконец нашел за что огромнейшее спасибо=))

ОтветитьОтветить
Руслан, 30.09.2011 в 02:42

А зачем столько ненужных манипуляций. Поменять всего картинки. Первая в http://site/wp-admin/images/logo-login.png (это как раз лого при входе), вторая http://site/wp-admin/images/wp-logo.png (логотип в админ-панели).

ОтветитьОтветить
kama, 30.09.2011 в 02:51

ANDRE, Вот же, в статье: login_headerurl, login_headertitle

ОтветитьОтветить
kama, 30.09.2011 в 02:54

Руслан, можно конечно и так, только при очередном обновлении ВП как все улетит на места своя, а все что будет потом "мартышкин труд" называется.

А еще, такой подход позволяет сделать свои картинки для разных тем и для разработчиков тем - это... Ну вы поняли?

ОтветитьОтветить
Kasper, сегодня

Не работает!

ОтветитьОтветить
Николай, 09.08.2013 в 17:49

Что-то не работает!

ОтветитьОтветить
Anjali, 07.09.2013 в 11:28

Получилось! Ура=)

ОтветитьОтветить
Татьяна, 11.09.2013 в 18:49

Может подскажите в моем вопросе. У меня на сайте иконка отображается в браузере и в закладках, а вот в поисковике не отображается. Я установила ее в корень сайта и в папку imedges темы сайта, в файле заголовка прописала путь. Но почему-то в поисковике ее нет. Почему? Если можно, ответьте на электронную почту. Можите посмотреть сами http://grinapteka.ru/

ОтветитьОтветить
Сергей, 06.10.2013 в 16:58

ни чего не улетит так как этот код и логотип находятся у вас в теме, ну а при обновлении ВП обновляется только ВП но не тема. Если конечно вы не используете стандартаные темы от движка

ОтветитьОтветить
Павел, 12.10.2013 в 17:46

Тоже попользовался! Спасибо огромное!

ОтветитьОтветить
владимир, 29.10.2013 в 12:34

ОГРОМНЕЙШИЙ РЕСПЕКТ ВАМ !!!

ОтветитьОтветить

Комментировать