जब हम कोई नई blog ya website बनाते है, तो उसमे font की महत्वपूर्ण भूमिका होती है। Font की boldness, browser compatibility, readability, support आदि।
Custom font 2 भाग में रखते है ताकि आसानी से हमे समझ में आ जाये।
- Google font
- Manual font face
Contents
Google Font
Google font का मतलब google के font की लाइब्रेरी है। यहाँ से फ्री में font डाउनलोड कर सकते है। जो की डायरेक्ट WordPress, HTML, CSS में इस्तेमाल कर सकते hai।
Google font का इस्तेमाल कैसे करे ?
Step-1 :
Google font की वेबसाइट पर जाये : Google font – यहाँ से आप language, trending, categories, select करके font सर्च कर सकते है।

Step-2 :
एक प्लस का icon show हो रहा है, उस पर क्लिक कीजिये। जैसे ही आप प्लस icon पर क्लिक करेंगे तो bottom में एक तब ओपन होगा। यहाँ पर बहुत से ऑप्टिमाइजेशन के ऑप्शन मिल जायेंगे।
Example : Blod, Regular, Light, Black,
Google font को अपने वेबसाइट में 2 तरह से इस्तेमाल कर सकते है।
- Standard format
- @Import format
Standard format

Standard format में google font का stylesheet provide करता है। इस url को आप अपने वेबसाइट में head tag के अंदर paste कीजिए । CSS फाइल open करके body के selector में font family change कर दीजिये। अब साइट चेक करेंगे तो font आपकी वेबसाइट पर दिख रहा होगा।
@Import format

@import format के लिए भी google css url प्रोवाइड करता है। जिसे अपनी css फाइल में सबसे टॉप पर add कर देते है। Body selector ke अंदर हम font family चेंज कर देते है।
Also Read: डेटाबेस मैनेजमेंट सिस्टम (DBMS) क्या है?
Font face
जब हम कोई custom font या purchased font का इस्तेमाल करते है तो हमे उस font का font face बनाना पड़ता है। जो की सभी कंप्यूटर पैर शो करे। Font face बनाने के लिए कुछ वेबसाइट नीचे दी गयी है।
- https://www.fontsquirrel.com
- https://transfonter.org/
- https://everythingfonts.com
- https://www.web-font-generator.com

Go to the website : https://everythingfonts.com/
यहाँ पर font को अपलोड करके convert करे। Font face की एक zip फाइल डाउनलोड हो जाएगी। 4 तरह के फॉण्ट डाउनलोड होते है।
- eot
- woff
- ttf
- svg
अब fonts को अपने प्रोजेक्ट के फॉण्ट फोल्डर में ऐड कीजिये। Font face की css को css फाइल में और font family body में ऐड करे।
CSS
@font-face { font-family: ‘Sri-TSCRegular’; src: url(‘fonts/sri-tsc-webfont.eot’); src: url(‘fonts/sri-tsc-webfont.eot?#iefix’) format(’embedded-opentype’), url(‘fonts/sri-tsc-webfont.woff’) format(‘woff’), url(‘fonts/sri-tsc-webfont.ttf’) format(‘truetype’), url(‘fonts/sri-tsc-webfont.svg#Sri-TSCRegular’) format(‘svg’); font-weight: normal; font-style: normal; } body { font-family: “Sri-TSCRegular”, serif }
[…] आप अपनी वेबसाइट में custom font का इस्तेमाल करना चाहते है। तो आप इस plugin […]
Meri blog website pr custom font upload nhi ho rhe h mtlb main code ko html file me paste krta hu pr add krne ke bad bhi font change nhi ho rhe h pls suggest
Pahale aap font face generate karo then jo css file generate hogi use aap apane css file me paste Karo. font folder ko bhi upload kar do.
HTML me paste karane ki jaroorat nahi hai.