Наверняка вам встречались на разных сайтах одинаково красивые иконки в формате шрифтов, которые реализованы благодаря сервису Font Awesome. Вот примеры таких иконок:
Вся эта красота делается довольно просто 🙂
Шаг 1. Вы подключаете стиль этого шрифта в область <head> своего сайта:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
В данном случае вам даже не нужно загружать css-файлы на свой хостинг. Файл будет подгружаться с глобального CDN хранилища.
Если вам нужен вариант когда файлы лежат на вашем сервере, то скачать все это дело можно на официальном сайте.
Шаг 2. В том месте страницы, где вы хотите задействовать иконку добавляете html код этой иконки.
Код любой иконки можно узнать на странице со списком всех иконок шрифта. Просто кликните по выбранной иконке и у вас откроется страница, где можно взять ее код.
Вот и все теперь там где вас нужно вывести символ просто вставляйте соц.сети «Одноклассники», просто в коде страницы добавляйте такой код и получаете такой символ:
