כיצד להכין גופן אייקון משלך

תוכן עניינים:

כיצד להכין גופן אייקון משלך
כיצד להכין גופן אייקון משלך

וִידֵאוֹ: כיצד להכין גופן אייקון משלך

וִידֵאוֹ: כיצד להכין גופן אייקון משלך
וִידֵאוֹ: התקנת פונטים בעברית לאוטוקאד 2024, מאי
Anonim

בעבר, בעת יצירת אתרים, היית צריך להשתמש בסמלי מפת סיביות. זה היה יפה, אבל לא נוח ממגוון סיבות. כיום, אייקונים וקטוריים החליפו סמלי רסטר. זהו פתרון מקורי ואלגנטי שיקשט וירענן את האתר שלכם.

דוגמה לגופן אייקון
דוגמה לגופן אייקון

הוראות

שלב 1

יש שירות אינטרנט טוב ליצירת גופנים מסמלים. קוראים לזה פונטסטיק. זה לגמרי בחינם וללא מודעות. השלב הראשון הוא הרשמה באתר השירות. היכנס לאתר fontastic.me, הזן את כתובת הדוא"ל שלך בשדות הקלט וצור סיסמה, ואז לחץ על הכפתור הצהוב הגדול "צור גופן אייקון שלך". לפעמים קורה שלא מוצג מידע המאשר הרשמה מוצלחת. אל תדאג בקשר לזה, המשך לשלב הבא.

הרשמה לשירות Fontastic
הרשמה לשירות Fontastic

שלב 2

כעת לחץ על כפתור "התחברות" הממוקם בפינה השמאלית העליונה. בדף שנפתח, הזן את הדואר האלקטרוני והסיסמה שלך שוב, לחץ על כפתור "התחברות".

לאחר המתנה של מספר שניות, החלונית ליצירת גופנים מסמלים תיפתח.

היכנס ללוח הבקרה Fontastic
היכנס ללוח הבקרה Fontastic

שלב 3

הנה מבחר גדול של אייקונים. על ידי לחיצה על הסמלים שאתה אוהב בעזרת העכבר, בחר כמה סמלים שאתה צריך. בחלק העליון, אחרי המילה "PUBLISH", מצוין מספר הסמלים שנבחרו.

בחירת סמלים וקטוריים
בחירת סמלים וקטוריים

שלב 4

אם אין לך מספיק אייקונים מהמספר שהוצג, גלול מטה לתחתית הדף ומצא את הכפתור שאומר "הוסף אייקונים נוספים". לחץ על זה.

הוספת סמלים
הוספת סמלים

שלב 5

דף עם חבילות אייקונים נוספות ייפתח. חלקם בתשלום (שכותרתו "פרימיום"), חלקם בחינם. להפעלת סמלים נוספים, לחץ על כפתור "ACTIVATE" בחבילות שנבחרו. כעת הם יופיעו ברשימה הכללית של האייקונים הזמינים כשתעבור להתחיל בלוח הבקרה על ידי לחיצה על כפתור "הבית" בתפריט העליון.

הוספת חבילות אייקונים
הוספת חבילות אייקונים

שלב 6

אם אתה צריך להוסיף סמלים משלך, ואז באותו דף בפינה השמאלית העליונה, לחץ על כפתור "ייבוא סמלים". כעת תוכל להעלות סמלים משלך. שים לב שרק פורמט SVG וקטורי נתמך.

הוסף סמלי וקטור משלנו
הוסף סמלי וקטור משלנו

שלב 7

לאחר שבחרתם את מספר הסמלים הדרוש, לחצו על כפתור "התאמה אישית". כאן תראה את כל הסמלים שנבחרו ותוכל להקצות להם שמות מחלקות שרירותיים, באמצעותם תתייחס אליהם בסגנונות CSS. לחלופין, תוכל להשאיר את שמות ברירת המחדל שהמערכת הקצתה לסמלים.

סקירה כללית של סמלי הווקטור שנבחרו
סקירה כללית של סמלי הווקטור שנבחרו

שלב 8

לחץ על כפתור "PUBLISH". כאן תוכלו להוריד את גופן סמל הווקטור שנוצר (כפתור "הורד"). הורד את ארכיב הגופנים שנוצר על ידי השירות למחשב שלך.

טוען את גופן סמל הווקטור
טוען את גופן סמל הווקטור

שלב 9

הארכיון שהורדת מכיל את הקובץ בסגנון CSS, קובץ ה- HTML עם שמות מחלקות הסמלים ותיקיית "הגופנים" עם הגופנים. ניתן להשתמש בגופן אייקון זה באתר האינטרנט שלך.

ארכיב עם גופן אייקון
ארכיב עם גופן אייקון

שלב 10

כדי להשתמש בגופן הסמל שנוצר, עליך לבצע את הפעולות הבאות:

- פרוק את תוכן הארכיון והעלה לאתר שלך בספריה עם סגנונות;

- הכנס קישור לקובץ CSS בקטע HEAD בכל דפי האתר שיעבדו עם גופן סמל זה;

- בקוד העמוד, אנו משתמשים בשם המחלקות שנוצרו בעבר כדי להשתמש בגופן הסמל החדש שנוצר.

מוּמלָץ: