נתחיל בלהבין למה בכלל הוספת פונטים לאלמנטור / וורדפרס היא חשובה ואיך היא תועיל לנו. כאשר משתמש נכנס לעמוד אינטרנט מתבצעת טעינה של כל קבצי האתר הדרושים בעזרת בקשות טעינה מהשרת. הבקשות האלו יכולות להיטען מהשרת המקומי שלכם, ויכולות גם להיטען על ידי בקשות חיצוניות.
ההבדל בין טעינת קובץ בצורה חיצונית לבין פנימית הוא זמן הבקשה. בעצם, כאשר הקבצים שנטענים מגיעים מבקשה מקומית הם יטענו מהר יותר מאשר בקשה חיצונית.
אז למה זה בכלל משנה?
אז ככה, בכל הקשור לנושא שיפור מהירות אתרים בקשה חיצונית היא פקטור שמשפיע על זמן טעינת העמוד עקב בקשה מחוץ לשרת המקומי. וכאשר העמוד נטען לאט יותר כך גם נפגעת חווית המשתמש יחד עם פגיעה בקידום האורגני של האתר.
אבל אל דאגה, במדריך הזה נעבור על כל השלבים שצריך לעשות על מנת לעלות פונטים לאלמנטור בצורה מקומית ובכך לצמצם בקשות חיצוניות.
אז הפיתרון היעיל ביותר הוא להוריד פונטים מגוגל ולהעלות אותם לאתר הוורדפרס שלכם בעזרת אלמנטור. אז בואו נעבור לתכל'ס.
איך להוריד פונטים מגוגל
שלב 1: היכנסו לאתר הפונטים של גוגל, לאחר מכן חפשו את הפונט שאותו תרצו להוסיף לאלמנטור. לצורך הדוגמא בחרתי בפונט Heebo.
שלב 2: כעת תבחרו את משקל הפונט שבו אתם משתמשים כרגע באתר והוסיפו אותו ע"י לחידה על select the style לאחר שסיימתם לבחור את משקל הפונט לחצו על Download Family
שלב 3: תחלצו את כל קבצי הפונט שנמצאים בקובץ ה-zip בעזרת תוכנה כמו winrar
שלב 4: חפשו את הקובץ של משפחת הפונט. הפונטים מגוגל פונט מגיעים בפורמט TTF ולפני שנעלה את הפונט לוורדפרס נרצה להמיר אותו לפורמט WOFF בעזרת הכלי הזה.
איך להוסיף את הפונטים לוורדפרס בעזרת אלמנטור
כעת לאחר שהורדנו את קבצי הפונט הגיע הזמן להוסיף אותו לאלמנטור.
שלב 5: היכנסו ללוח הבקרה בוורדפרס ולחצו על אלמנטור ← ניהול פונטים
לאחר מכן, בעמוד למעלה לחצו על הוספת חדש
שלב 6: רשמו את השם שתרצו לתת לפונט שאתם מעלים (עדיף לבחור בשם ייחודי כדי שתוכלו למצוא אותו בשלבים הבאים) ולאחר מכן לחצו על הוספת וריאציה. לאחר מכן, העלו את הפונט שהורדתם והמרתם על ידי לחיצה על העלאה ולסיום לחצו על פרסום
אופן השימוש בפונט שנוסף לוורדפרס
כעת לאחר שהוספתם לאלמנטור את הפונטים שהורדתם מגוגל פונט הגיע הזמן להשתמש בהם.
תוכלו להוסיף את הפונט כפונט ברירת מחדל בתבנית. בלוח הבקרה של וורדפרס לחצו על עיצוב ← התאמה אישית ← גלובלי ← טיפוגרפיה
הערה: השמות והמיקומים יכולים להשתנות בין תבניות, בדוגמא אני משתמש בתבנית Astra. אם אתם משתמשים בתבנית אחרת תמצאו את הגדרות הטיפוגרפיה של התבנית.
דרך נוספת להשתמש בפונטים הם דרך העורך של אלמנטור, כאשר אתם עורכים טקסט בעזרת העורך של אלמנטור תוכלו לבחרו את הפונט שהעלתם עבור טקסט מסויים.
כאשר אתם עורכים עמוד מסויים עם אלנטור בחרו בסגנון← טיפוגרפיה
לסיכום
כעת אתם משתמשים בפונטים מותאם אישית ובזמן טעינת הדף באתר שלכם הפונטים עולים עם בקשה פנימית. ולכן, צימצתם את בקשה חיצונית של הפונטים באתר ושיפרתם (בקצת) את טעינת העמוד.
