How to make an own ikonochny font

How to make an own ikonochny font

Earlier during creation of the websites it was necessary to use raster icons. It was beautiful, but inconveniently for a number of reasons. Today to the place of raster icons vector came. This original and graceful solution which will decorate and will refresh your website. Instruction 1. There is a good web service for creation of fonts from icons. It is called Fontastic. It is completely free also without advertizing. First of all we will register on the website of service. We visit the website fontastic.me, we enter the e-mail address in data entry fields and we will think up the password, further we press the big yellow button ""Create your Icon Font"". Sometimes it happens that no information confirming successful registration is displayed. Do not worry about it, you pass to the following step. 2. Now we press the Login button located in the upper right corner. On the opened page we enter the e-mail and the password again, we click ""Login"". Having waited several seconds, the panel for creation of fonts from icons will open. 3. Before you a wide choice of icons. Clicking on the pleasant icons, select so many icons how many it is necessary for you. The quantity of the selected icons is specified in the top part after the word ""PUBLISH"". 4. If with you there are not enough icons from the provided quantity, thumb through the page to a bottom and find the button with the inscription ""Add more icons"". Click it. 5. The page with additional packages of icons will open. Some of them paid (are marked with a label of ""Premium""), some free. For activation of additional icons, click ""ACTIVATE"" on the selected packages. Now they will appear in the general list of available icons when you pass into the beginning of work with the control panel, having pressed the Home button in the top menu. 6. If you need to add own icons, then on the same page press the IMPORT ICONS button at the upper right. Now you can load own icons. Pay attention that are supported only the vector SVG format. 7. Having selected the necessary quantity of icons, we click ""CUSTOMIZE"". Here you will see all selected icons, and can assign any names of classes for them on which you will contact them in CSS styles. Or you can leave names by default which were assigned to icons by a system. 8. We click ""PUBLISH"". Here it is possible to download the created vector ikonochny font (DOWNLOAD button). We download the archive with a font created by service on the computer. 9. In the downloaded archive there is a CSS file of style, the HTML-file with class names of icons and the fonts folder with fonts. This ikonochny font can be used on the website. 10. To use the created ikonochny font, it is necessary to make the following: - unpack contents of archive and upload to the site in a directory with styles; - insert the link to the CSS file into the section HEAD of all pages of the website which will work with this ikonochny font; - in the code of the page we use a name of the classes created earlier for use of just created ikonochny font.

Author: «MirrorInfo» Dream Team


Print