Как подключить в Blogger шрифт Font Awesome: Как подключить иконки Font Awesome PSVS
Привет, я автор блога По Секрету Всему Свету, занимаюсь созданием и настройкой блогов на Blogger.com .
iklan banner

Как подключить в Blogger шрифт Font Awesome: Как подключить иконки Font Awesome

Как правильно добавлять значки Font Awesome в Blogger

Font Awesome предоставляет собой масштабируемые векторные значки, которые можно мгновенно настроить — размер, цвет, тень и все, что можно изменить через  CSS. Если вы хотите разнообразить внешний вид своего Blogspot блога, то использование в нем нестандартных шрифтов – достаточно неплохая идея.

Как установить шрифт Awesome

Есть два варианта того, как можно его получить: 
  1. Способ 1. Через официальный сайт
    2. Перейдите на официальный сайт Font Awesome, где вы можете скачать архив с библиотекой Font Awesome. Выбираем версию «FRE FOR WEB», как правило, бесплатной версии  достаточно. Затем выполните распаковку архива и скопируйте содержимое папок «/css» и «/webfonts» в свою веб-директорию (например, в папку /css/awesome).
 После этого добавьте следующую строку в тег <head> вашего сайта, чтобы подключить стили Awesome:
<link rel="stylesheet" href="/css/awesome/css/all.css" />
  •  Способ 2. CDN Font Awesome
Подключите Font Awesome с помощью CDN (Content Delivery Network). Это самый простой способ, и он не требует загрузки и установки файлов на вашем сервере. Для этого просто вставьте следующий код в ваш HTML-файл:
Важно! URL может меняться в зависимости от выбранной вами версии Font Awesome. Наш код подходит для  версии 6.4.4.
<link rel="stylesheet" href=" https://use.fontawesome.com/releases/v6.4.4/css/all.css">

Как добавить к нужному элементу иконки Font Awesome

Вам нужно выбрать нужную иконку на сайте Font Awesome  и скопировать ее HTML код:
<i class="fa fa-car" </i> и вставить его перед тем элементом, который хотите выделить
Добавление стилей CSS к иконке
< i class="fa fa-car"style="color: red; font-size: 28px;"</i>
Машины
   Пример использование иконок для меню сайта:
  <button style='font-size:14px'><a href="#">Главная
  <i class='fa fa-home'style='font-size:18px;color:#0ac4fc'></i></a>
   </button> 


Вы можете разместить иконки Font Awesome в любом месте, используя в имени класса префикс fa и название иконки. Font Awesome разработан так, чтобы он мог быть использован в строчных элементах  (тег  <i> ... </i>).

    Статья из Рубрики Настройка-blogger
    Показать все сообщения из рубрики Настройка-blogger
    Автор статьи: Aviator - воскресенье, 23 июня 2024 г.

    Написать комментарии к статье ✍ "Как подключить в Blogger шрифт Font Awesome: Как подключить иконки Font Awesome"

    Отправить комментарий

    Оставьте, пожалуйста, комментарий к статье!

    Читать ленту новостей