Иконки FontAwesome

59 views
Skip to first unread message

Aleksey Azarov

unread,
Aug 10, 2018, 5:58:52 AM8/10/18
to HEEG.HTML Бесплатная CMS интернет магазина
Шрифт FontAwesome подключен в движке вроде. Но как использовать иконки оттуда в тексте на страницах?

HEEG.HTML

unread,
Aug 10, 2018, 2:15:05 PM8/10/18
to he...@googlegroups.com
посмотрите как вставлен в тексте значок телефона 
<a style=' font-family: "fontawesome"; font-size:1.5em;'>&#xf232;</a>

то есть достаточно указать шрифт и код символа внутри тегов. Остальные коды иконок есть здесь https://fontawesome.com/cheatsheet?from=io
в мобильной версии иконки появляются вместо ссылок верхнего меню. Чтобы поменять иконку на свою надо в поле fontawesome
раздела указать код иконки . Например &#xf0d1; 

Третий вариант использования иконок в стилях css

например так появляется значок корзины на плитках товаров

tw.inCart::before {
    content: "\F07A";
    font-family: "FontAwesome";
    position: absolute;
    font-size: 1.5em;
    z-index: 100;
    color: #eee;
    top: 10px;
    left: 12px;
}



пятница, 10 августа 2018 г., 12:58:52 UTC+3 пользователь Aleksey Azarov написал:

Магазин Творчества

unread,
May 18, 2022, 2:24:05 PM5/18/22
to HEEG.HTML Бесплатная CMS интернет магазина
Добрый вечер! У меня почему-то так иконки не появляются чего только не пробовала: и коды вставляла, и HTML и в систем, и в стили ничего не помогает


пятница, 10 августа 2018 г. в 21:15:05 UTC+3, HEEG.HTML:

HEEG.HTML

unread,
May 19, 2022, 3:42:58 AM5/19/22
to HEEG.HTML Бесплатная CMS интернет магазина
Для иконок в меню у вас в таблице https://docs.google.com/spreadsheets/d/1L-GaDFcDqaH8CI7sizsXsqk8-fhF5vr_ODQaKx5dgBQ/edit#gid=235286795 
неправильно названа колонка      fontawesome  лишние пробелы в начале. Иконки можно вставлять только версий не больше 4.1 новые отображаться не будут.

среда, 18 мая 2022 г. в 21:24:05 UTC+3, Магазин Творчества:

Магазин Творчества

unread,
May 19, 2022, 5:33:25 PM5/19/22
to HEEG.HTML Бесплатная CMS интернет магазина
Не отображаются? Зачем же их тогда опубликовали...?

четверг, 19 мая 2022 г. в 10:42:58 UTC+3, HEEG.HTML:

HEEG.HTML

unread,
May 20, 2022, 3:15:10 AM5/20/22
to HEEG.HTML Бесплатная CMS интернет магазина
Иконки Fontawesome это по сути отдельный шрифт, который ЦЕЛИКОМ подгружается при открытии страницы. У этого шрифта с каждой новой версией увеличивается количество иконок и соответственно вес этого шрифта. Так как небольшого количества иконок достаточно, по умолчанию используется одна из первых и легких версий этого шрифта 

пятница, 20 мая 2022 г. в 00:33:25 UTC+3, Магазин Творчества:
Reply all
Reply to author
Forward
0 new messages