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: да извинят меня знатоки за банальщину . Не всегда очевидное — очевидно. Если есть неточности (могут быть), уточняйте.