softsprint menu Order

Иконка домика вместо текста “Домой” в меню WordPress

July 13, 2015 in 6:55 pm | wiki

Всем привет!

Эта краткая заметка посвящена относительно популярному вопросу: как поставить иконку домика вместо текста “Домой” в навигационном меню WordPress?
Мы не изучали решения этого вопроса в сети, а просто изобрели свой велосипед, на который ушло 10 минут.
Итак:
1) идём, например, по этой ссылке: http://fortawesome.github.io/Font-Awesome/cheatsheet/
2) выбираем здесь иконку дома (код fa-home) или другую, какая нравится
3) скопированную иконку вставляем прямо в поле названия пункта меню в админке WordPress:
иконка домой
добавляем в наш файл стилей, например, такой код:

1
2
3
4
[id*=menu] > li:first-of-type {
	font-family: FontAwesome;
	font-size: 18px;
}

Где font-family: FontAwesome – название шрифта, который нужно заранее подключить.
Подключение делаем обычным способом, например, так:

1
2
3
4
@font-face {
	font-family: FontAwesome;
	src: url(fonts/FontAwesome.otf);
}

Результат на принте ниже:

иконка домой wordpress

На сегодня всё – всем спасибо за прочтение!

P.S. Иконка домика прекрасно работает с плагином qTranslate X, автоматически переключая язык домашней страницы.

Let`s discuss

softsprint heart

Our contacts

Lviv, Ukraine
моб: +380 97 551 44 55
skype: softsprint.net

Say hello!