Людей естественным образом привлекает внешний вид Веб-сайт WordPress, настолько, насколько их привлекает письменный контент, которым вы делитесь. На самом деле, согласно Джефф Bullas ", Статьи с изображениями имеют на 94 больше просмотров, чем статьи без изображений.
Если вы спросите меня, это огромный рост просмотров страниц.
И в чем причина именно?
Просто добавьте несколько высококачественных изображений, относящихся к статье, в свой контент.
А как насчет фотографий на вашем Веб-сайт которые выходят за рамки скриншотов и фотографий? Как насчет изображений, которые не только привлекают внимание, но и выполняют полезную функцию?
Да, я говорю об иконах. Вы знаете, те крошечные картинки, которые можно найти на веб-сайтах, чтобы побудить их делиться в социальных сетях, чтобы проиллюстрировать контактные страницы владельцев бизнеса, чтобы назвать несколько случаев использования.
Так как идея взята с этого сайта, посетителей не только привлекали изображения на веб-сайтах, но и были склонны взаимодействовать с ними, люди начали добавлять их на свои веб-сайты.
Тем не менее, по мере развития технологий, как всегда, традиционные графические иконки перестали использоваться в качестве графического решения для веб-сайтов. Это потому, что они делают страницы намного тяжелее и, следовательно, медленнее, но, прежде всего, это решение не всегда подходило для мобильных устройств.
Но есть решение: иконки шрифтов.
Сегодня я расскажу вам, что такое иконочные шрифты и о преимуществах их использования на вашем сайте WordPress. Кроме того, я покажу вам, как добавить шрифты значков на ваш сайт WordPress с помощью популярного плагина " Лучше шрифт Высокий .
Итак, начнем.
Что такое иконочные шрифты и зачем их использовать?
Иконочные шрифты - это именно то, что они говорят: шрифты полностью встроены в значки. Фактически, иконочные шрифты или " макияж значок "Может быть описан как шрифт, который отображает только символы или символы, а не буквы и цифры, с которыми связаны традиционные шрифты и текст.
Иконочные шрифты используются для отображения часто используемых символов на вашем сайте. Например, кнопки социальных сетей, ваша корзина, кнопки загрузки и кнопки навигации - это примеры значков, которые отображают крошечные интерактивные изображения на вашем сайте.
Зачем использовать иконочные шрифты?
Значки изображений в прошлом хорошо работали для многих владельцев сайтов. Однако по мере развития правил навигации, удобства использования и дизайна иконочные шрифты стали лучшим решением для отображения интерактивных изображений на веб-сайте. сайт.
Вот несколько веских причин, по которым иконочные шрифты являются лучшим выбором:
- Легко расширяется без потери качества
- Настраивается по цвету и оттенку
- 100% реагировать
- Работает как спрайты изображений CSS, но ведет себя как текст
- Facile меню utiliser
- Совместимые браузеры
- Настроить непрозрачность, поворот и т. Д.
- Размер файла меньше
- Не жертвовать скорость или производительность вашего сайта
Как видите, есть несколько причин, по которым вы можете захотеть использовать на своем веб-сайте иконочный шрифт, а не иконку изображения.
Установка иконок шрифтов на ваш сайт с помощью плагина
Better Font Awesome — это Плагин Wordpress бесплатное программное обеспечение, позволяющее автоматически интегрировать последнюю версию Font Awesome в ваш проект WordPress. Кроме того, он поставляется с CSS, шорткодами и генератором шорткодов TinyMCE.
Этот плагин имеет множество полезных функций для владельцев сайтов:
- Регулярное обновление последней версии
- Возможность переключения между версиями Font Awesome без изменения коротких кодов
- Поддержка других популярных плагинов шрифтов, включая их шорткоды.
- Выдано jsDelivr CDN
Шаг 1: установка и активация лучшего шрифта Awesome
Для начала установите и активируйте плагин «Better Font Awesome» через панель инструментов WordPress, как и любой другой плагин.
Сначала перейдите к " Плагины> Добавить И искать Лучше шрифт Высокий .
Затем выберите установить сейчас »И нажмите« активировать .
После активации плагин добавляет ссылкуЛучше шрифт ВысокийПод меню настроек вашей панели управления WordPress.
Шаг 2: настройка параметров плагина
Чтобы настроить плагин « Лучше шрифт Высокий ", Начните с нажатия на пункт меню" Лучше шрифт Высокий Под Настройки. Как только вы это сделаете, вы увидите экран, похожий на этот:
Здесь вы можете сделать следующее:
- Версия: Выберите версию «Better Font Awesome», которую вы хотите использовать.
- Используйте минимизированный CSS: Установите этот флажок, если вы хотите использовать уменьшенную версию CSS.
- Удалить существующий шрифт печати: установите этот флажок, чтобы попытаться удалить закодированные фрагменты и шорткоды, добавленные другими плагинами и темами.
- Скрыть отзывы администратора: Скрыть предупреждения администратора по умолчанию, которые появляются при возникновении ошибок API и CDN.
В дополнение к минимальному количеству параметров Better Font Awesome, есть небольшой раздел «Использование», в котором объясняется, как добавлять значки на ваш сайт.
Шаг 3. Добавление значков на ваш сайт
Есть три простых способа добавить значки на ваш сайт с помощью «Better Font Awesome» - с помощью шорткода, HTML или TinyMCE.
№1. Добавление иконок с помощью шорткода
Чтобы добавить значки на свой сайт с помощью шорткода, сначала посетите " Являются удивительными Чтобы увидеть полный список доступных значков, которые можно использовать.
Здесь вы можете найти нужный значок. Например, если вам нужен значок «электронная почта», просто найдите это ключевое слово и выберите значок, который хотите использовать, щелкнув по нему.
После нажатия на значок, который вы хотите добавить, вы увидите экран, показывающий изображение значка с его разными размерами и небольшой блок кода:
Просто скопируйте блок кода и вставьте его в любое место на своем сайте, используя вкладку «Текстовый редактор». Вот так редактор будет выглядеть на вашем сайте:
В итоге вот что посетителей увидят, когда они зайдут на ваш сайт:
# 2. Добавление иконок с помощью HTML-кода
Как мы видели в разделе " Использовать У вас есть возможность использовать HTML-код для вставки значков на свой сайт. Однако разработчики плагинов принимают во внимание, что использование HTML требует префиксов версии.
Вот почему они рекомендуют вам вместо этого использовать шорткоды. Однако, если вы хотите использовать HTML-код, в Font Awesome есть полезная информация здесь.
# 3. Добавление иконок с помощью TinyMCE
Вероятно, это самый простой способ добавить значки на ваш сайт. В режиме «Визуальный редактор» просто щелкните значок «Вставить». Оттуда прокрутите доступные варианты значков или сузьте результаты с помощью функции поиска.
Найдя нужный значок, просто щелкните по нему. Генератор шорткодов автоматически вводит необходимую информацию в ваш пост или страницу.
Если вы хотите узнать, как настроить значки на вашем сайте, обратитесь к примерам " Являются удивительными .
Установил и активировал, но в TinyMCE не появляется кнопка "Вставить значок". У кого-нибудь была эта проблема?