Font Awesome 6
Поговорим про Font Awesome?
Джумла пользует во всем своем многообразии несколько версий этого значкового шрифта (включая: админпанель, шаблон, скрипты сторонних разработчиков). Джумловоды привыкли к «многообразию», «заплаткам и «костылям». Увы, бесплатный cms имеет свои особенности Есть альтернативы? Хорошо.
Не суть. Иконки Font Awesome пользовать приходится, в любом случае, многим вебмастерам. Делюсь практикой.
Новая версия (на день публикации Font Awesome 6) эстетична, практична, изящна (на мой взгляд). Резонный вопрос: Зачем? опустим. Приступим к реализации. Процесс относительно несложен.
Для подключения к сайту Джумла v. 4.x (или иной дргой cms) Font Awesome 6 производим следующие телодвижения.
- Скачать Font Awesome 6 (архив *.zip). В архиве две папки. Их необходимо залить на сервер вашего сайта в одну директорию. У меня эта директория «в корне» сайта именуется: /js/.
(ссылка бесплатная, не дергайтесь, на этом сайте нет ничего платного, совсем. Только даром.).
- В head сайта прописываем строку: <link type="text/css" rel="stylesheet" href="/js/fontawesome/all.min.css" />
Естественно, если вы пользуете папку: /js/. Залить можно куда угодно, только не забывая про url адресации. Пропишите нужный, свой. - В css шаблона надо прописать, примерно так: span[class*="fa-"], i[class*="fa-"], .fal, .fal:before, .far, .far:before, .fa, .fa:before {font-family:'Font Awesome 6 Pro'; font-weight:300; font-style:normal; font-variant:normal; line-height:1;}Не стал разбираться в изящности стиля. Все равно, по месту, будут правки. Изменяя font-weight можно получить нужный результат, 300: очень тонко. Но иногда: так и надо
- Всё. Пользуйтесь красотами Font Awesome 6
Придется прописывать отступы, размеры и иные атрибуты в css. Но оно того стоит. Как всегда.
Значки классов тупо копируем из Путеводителя Font Awesome. Типо:
Отобразится: текст ахинеи
Ну и всё? Что еще сказать. Элементарно, но не всегда очевидно «в запаре» работ.
Стоит подумать об отключении иных версий Font Awesome, если они задействованы на проекте. В меню, модулях, пр. Лишняя загрузка: снижение скорости. На некоторых проектах проставлены аж 3-и версии (было). Всякое случается.
В существующих css стоит заменить существующие стили Font Awesome на обновленные:
В принципе, совсем это и не пустяки, если внимательно просмотреть параметры тормозов от скоростного замерителя google. Первый тормоз: шрифт.
Еще: внешние подключения к импортным серверам ныне... неизвестно, как сложится. Увы, имеет значение. Сам не рад, а куда деваться.
Вопросы можно задать в комментариях. Я еще жив, отвечу . Про Смайлики не спрашивайте только, смайлики по ссылке, как всегда.
ps: да извинят меня знатоки за банальщину . Не всегда очевидное — очевидно. Если есть неточности (могут быть), уточняйте.
- #
- Sergei
- 0
- #
- san-san
- 0

Для комментирования материалов регистрация на сайте не нужна. Правила публикации: наличие здравого смысла. Комментарии проходят премодерацию и публикуются только после проверки администратором.