Преди това, когато създавахте сайтове, трябваше да използвате растерни икони. Беше красиво, но неудобно по различни причини. Днес векторните икони са заменили растерните икони. Това е оригинално и елегантно решение, което ще украси и освежи вашия сайт.
Инструкции
Етап 1
Има добра уеб услуга за създаване на шрифтове от икони. Нарича се Fontastic. Той е напълно безплатен и без реклами. Първата стъпка е да се регистрирате на уебсайта на услугата. Отидете на уебсайта fontastic.me, въведете имейл адреса си в полетата за въвеждане и създайте парола, след което щракнете върху големия жълт бутон „Създайте своя шрифт на иконата“. Понякога се случва да не се показва информация, потвърждаваща успешната регистрация. Не се притеснявайте за това, преминете към следващата стъпка.
Стъпка 2
Сега кликнете върху бутона "Вход", разположен в горния десен ъгъл. На страницата, която се отваря, въведете отново вашия имейл и парола, натиснете бутона "Вход".
След изчакване на няколко секунди ще се отвори панелът за създаване на шрифтове от икони.
Стъпка 3
Тук има голям избор от икони. Като щракнете върху иконите, които харесвате с мишката, изберете толкова икони, колкото са ви необходими. В горната част, след думата „ПУБЛИКУВАНЕ“, е посочен броят на избраните икони.
Стъпка 4
Ако нямате достатъчно икони от представения номер, превъртете надолу до края на страницата и намерете бутона, който казва „Добавяне на още икони“. Кликнете върху него.
Стъпка 5
Ще се отвори страница с допълнителни пакети с икони. Някои от тях са платени (с надпис „Премиум“), други са безплатни. За да активирате допълнителни икони, натиснете бутона "АКТИВИРАНЕ" на избраните пакети. Сега те ще се появят в общия списък с налични икони, когато отидете да започнете с контролния панел, като щракнете върху бутона "Начало" в горното меню.
Стъпка 6
Ако трябва да добавите свои собствени икони, тогава на същата страница горе вдясно кликнете върху бутона „ИМПОРТИРАНЕ НА ИКОНИ“. Вече можете да качвате свои собствени икони. Моля, обърнете внимание, че се поддържа само SVG векторен формат.
Стъпка 7
След като сте избрали необходимия брой икони, натиснете бутона "ПЕРСОНАЛИЗИРАНЕ". Тук ще видите всички избрани икони и можете да им присвоите произволни имена на класове, с които ще ги препращате в CSS стилове. Или можете да оставите имената по подразбиране, които системата е присвоила на иконите.
Стъпка 8
Натиснете бутона "PUBLISH". Тук можете да изтеглите създадения шрифт на векторната икона (бутон "ИЗТЕГЛЯНЕ"). Изтеглете архива на шрифтове, създаден от услугата, на вашия компютър.
Стъпка 9
Изтегленият архив съдържа CSS файла със стил, HTML файла с имената на класовете икони и папката "шрифтове" с шрифтовете. Този шрифт на иконата може да се използва на вашия уебсайт.
Стъпка 10
За да използвате създадения шрифт на иконата, трябва да направите следното:
- разопаковайте съдържанието на архива и качете на вашия сайт в директорията със стилове;
- вмъкнете връзка към CSS файл в раздела HEAD на всички страници на сайта, които ще работят с този шрифт на иконата;
- в кода на страницата използваме името на предварително създадените класове, за да използваме новосъздадения шрифт на иконата.
