Популярный фреймворк Helix Ultimate поставляется с бесплатной ограниченной версией иконочного шрифта FontAwsome 5.
Конечно в некоторых случаях вполне достаточно бесплатной версии, но FontAwsome 5 Pro содержит гораздо больше иконок, и если вы читаете эту статью, значит вам нужна именно Pro версия и вы на правильном пути!
Итак начнем.
1. Для начала нам потребуется скачать FontAwsome 5 Pro.
В архиве fontawesome-pro-5.11.2-web и fontawesome-pro-5.11.2-desktop.
Нам нужна web версия, поэтому распакуйте архив fontawesome-pro-5.11.2-web.
2. Копируем файлы шрифта на сайт
Теперь нужно скопировать файлы шрифта из папки \fontawesome-pro-5.11.2-web\webfonts
в папку шаблона вашего сайта /public_html/templates/shaper_helixultimate/fonts
3. Подключаем шрифт в шаблоне
Можете просто скопировать приложенные файлы в /shaper_helixultimate/css
Или сделайте самостоятельно так:
Содержимое файла /shaper_helixultimate/css/font-awesome.min.css в шаблоне заменить на содержимое из \fontawesome-pro-5.11.2-web\css\all.min.css
Для правильной работы шрифта После копирования содержимого all.min.css нужно еще поменять путь для файлов шрифта в конце файла: ../webfonts на ../fonts
Затем содержимое файла fa-v4-shims.css в шаблоне заменить на содержимое из \fontawesome-pro-5.11.2-web\css\v4-shims.min.css
Теперь шрифт FontAwsome 5 Pro подключен и вы можете использовать его в шаблоне.
4. И на последок останется внести небольшие правки
Так как в шаблоне везде, где используются иконки, в css указан шрифт Font Awesome 5 Free или FontAwesome, поэтому вместо иконок могут появиться квадратики.
Чтобы это исправить нужно изменить "FontAwesome" или "Font Awesome 5 Free" на "Font Awesome 5 Pro" в файлах
menu.scss
offcanvas.scss
theme.scss
template.scss
На этом все.