WordPress में कस्टम फ़ॉन्ट्स जोड़ना


वर्डप्रेस में कस्टम फोंट कैसे जोड़ें


अपने वर्डप्रेस साइट के लिए सही फ़ॉन्ट चुनना वेब डिज़ाइन और वेबसाइट ब्रांडिंग का एक केंद्रीय हिस्सा है.

जैसे रंग, चित्र और अन्य तत्व, टाइपोग्राफी एक बड़ी भूमिका निभाता है कैसे आपकी साइट आगंतुकों द्वारा माना जाता है.

शुक्र है, वर्डप्रेस फोंट उन कई चीजों में से एक है जिन्हें आप स्वतंत्र रूप से अनुकूलित कर सकते हैं। आप अपनी इच्छित WordPress साइट पर किसी भी मुफ्त कस्टम फ़ॉन्ट का उपयोग कर सकते हैं.

हम आपको वर्डप्रेस फोंट के बारे में जानने की जरूरत है:

  • क) वर्डप्रेस में कस्टम फोंट कैसे जोड़ें (मैन्युअल रूप से)
  • B) वर्डप्रेस में कस्टम फॉन्ट्स कैसे जोड़ें (प्लगइन के माध्यम से)
  • वर्डप्रेस पर कस्टम फोंट का उपयोग क्यों करें
  • जहां कस्टम फ़ॉन्ट्स खोजने के लिए
  • निष्कर्ष

Contents

क) वर्डप्रेस मैन्युअल रूप से कस्टम फ़ॉन्ट्स कैसे जोड़ें

जब हाथ से वर्डप्रेस में कस्टम फोंट जोड़ने की बात आती है, तो आपके पास तीन मुख्य विकल्प हैं: एचटीएमएल, जावास्क्रिप्ट और सीएसएस। प्रत्येक विधि के लिए पेशेवरों और विपक्ष हैं और आपके लिए कौन सा सही है यह आपके सेटअप पर निर्भर करता है। चिंता न करें, हम उनमें से प्रत्येक के माध्यम से विस्तार से जाएंगे.

1. सीएसएस और का उपयोग करना @आयात

आइए कम से कम अनुशंसित विधि के साथ शुरुआत करें। यदि आप Google फ़ॉन्ट्स से कस्टम टाइपफेस स्थापित करने की योजना बनाते हैं, तो आपने देखा होगा कि इसमें एक टैब लेबल है @आयात. सेवा आपको सीएसएस कोड का एक टुकड़ा देती है.

Google फोंट में आयात टैब

आप या तो इसे ले सकते हैं और इसे अपने हेडर में डाल सकते हैं (उस पर अधिक) या इसके बिना इसे कॉपी करें >आपके विषय की शुरुआत के लिए कोष्ठक (या बेहतर अभी तक, बाल विषय) style.css फ़ाइल.

/ *
थीम नाम: बीस सत्रह बाल
थीम URI: https://wordpress.org/themes/twentyseventeen/
साँचा: बीसवें
लेखक: वर्डप्रेस टीम
लेखक यूआरआई: https://wordpress.org/
संस्करण: 1.0

* /

@import url ('https://fonts.googleapis.com/css?family=Open+SanscamRoboto');


/ * अतिरिक्त CSS यहाँ जाता है * /

ऐसा करने से स्टाइल शीट से आपकी साइट में फ़ॉन्ट लोड हो जाएगा। यह एक सरल समाधान की तरह लगता है, है ना? फिर इसकी सिफारिश क्यों की गई है?

कारण है प्रदर्शन के मुद्दे। का उपयोग करते हुए @आयात अब जाने का अनुशंसित तरीका नहीं है क्योंकि यह एक ही बार में कई स्टाइल शीट डाउनलोड करने से ब्राउज़र को रोकता है। परिणाम: धीमी पृष्ठ लोडिंग समय। हो सके तो इससे दूर रहें.

2. एक वर्डप्रेस टेम्पलेट फ़ाइल का उपयोग करना

अपनी साइट पर फोंट पाने के लिए एक दूसरी विधि फ़ॉन्ट पुस्तकालयों द्वारा प्रदान किए गए कोड को लेना और उन्हें अपने में कॉपी करना है header.php टेम्पलेट फ़ाइल। अधिकांश मानक WordPress विषयों में यह है.

सुनिश्चित करें कि इसे कहीं के बीच रखें तथा कोष्ठक। इस तरह, जब भी कोई पेज लोड होगा, आपका फॉन्ट लोड हो जाएगा.

इनपुट गूगल फोंट कोड वर्डप्रेस हेडर में

यदि आप चाइल्ड थीम का उपयोग कर रहे हैं, तो मूल विषय को कॉपी करना सुनिश्चित करें header.php चाइल्ड थीम डायरेक्टरी में फाइल करें और उसमें बदलाव करें.

कुछ थीम सेटिंग्स के साथ आती हैं जो आपको बैकएंड के माध्यम से अपने हेडर और फुटर में कस्टम कोड जोड़ने की अनुमति देती हैं। यह भी एक व्यवहार्य विकल्प है.

3. उपयोग करना @फॉन्ट फ़ेस

अब तक, हमने केवल वर्डप्रेस में कस्टम फोंट का उपयोग करने के बारे में बात की है जो कहीं और होस्ट किए गए हैं, अर्थात् Google और एडोब के सर्वर। हालाँकि, अपनी साइट पर फोंट की मेजबानी करना और उन्हें वहां से आगंतुकों के ब्राउज़रों के लिए पेश करना भी संभव है.

ऐसा करने के लिए, आपको पहले प्रश्न में फ़ॉन्ट डाउनलोड करना होगा। Google फ़ॉन्ट्स पर डाउनलोड बटन याद रखें? वह एक काम हो जाएगा। अन्य प्रदाता भी आपको फोंट डाउनलोड करने देते हैं.

जब आप ऐसा करते हैं, तो सुनिश्चित करें कि आप इसे वेब फ़ॉन्ट प्रारूप में प्राप्त करते हैं। इसका मतलब है कि TTF, OTF या WOFF। आपको इसके बारे में अधिक जानकारी मिलेगी यहाँ. यदि आपके पास सही वेब फ़ॉन्ट प्रारूप नहीं है, तो आप इसका उपयोग भी कर सकते हैं जै सेवा अपने फ़ॉन्ट को एक समर्थित में बदलने के लिए.

एक बार जब आप अपनी फ़ॉन्ट फ़ाइलें तैयार कर लेते हैं, तो आपको उन्हें FTP के माध्यम से अपनी वर्डप्रेस साइट पर अपलोड करना होगा। उन्हें संग्रहीत करने के लिए एक अच्छी जगह आपके बच्चे के नाम के एक उपनिर्देशिका में है फोंट्स (रचनात्मक, हम जानते हैं).

उसके बाद, आपको अपनी शैली शीट में फ़ॉन्ट लोड करने की आवश्यकता है @फॉन्ट फ़ेस. यहाँ यह कैसा दिखता है:

@फॉन्ट फ़ेस {
फ़ॉन्ट-परिवार: रोबोटो;
src: url (http: //localhost/wordpress/wp-content/themes/twentyseventeen-child/fonts/Roboto-Regular.ttf);
फ़ॉन्ट-वजन: सामान्य;
}

फ़ॉन्ट के नाम को बदलने के लिए याद रखें और अपनी साइट पर इसके स्थान के लिए पता करें। उसके बाद, आपका नया कस्टम फ़ॉन्ट प्रयोग करने योग्य होगा.

हालांकि, यह भी सबसे अच्छा समाधान नहीं है, विशेष रूप से प्रदर्शन-वार। Google के सर्वर संभवतः आपकी तुलना में तेज़ हैं और इसलिए वहां से कस्टम फोंट लोड करना बेहतर समाधान की संभावना है.

4. एन्क्यूइंग फ़ॉन्ट्स - "वर्डप्रेस वे"

यदि आप सही तरीके से वर्डप्रेस में कस्टम फोंट जोड़ना चाहते हैं, तो आप अपना उपयोग करेंगे functions.php फ़ाइल (आपके वर्तमान में सक्रिय विषय की निर्देशिका के अंदर) और फ़ंक्शन  wp_enqueue_script या wp_enqueue_style.

उनकी मदद से, हम फ़ॉन्ट साइटों द्वारा प्रदान किए गए कोड स्निपेट्स ले सकते हैं। हालांकि, उन्हें एक फ़ाइल में कॉपी करने के बजाय, हम उन्हें एक फ़ंक्शन के माध्यम से हेडर में जोड़ देंगे.

के बीच क्या अंतर है wp_enqueue_script तथा wp_enqueue_style? जैसा कि उनके नाम से पता चलता है, एक स्क्रिप्ट जोड़ने के लिए है, एक शैली पत्रक के लिए। कौन सा उपयोग करना सही है यह इस बात पर निर्भर करता है कि आपके कस्टम फोंट उनके स्रोत से कैसे प्रदान किए जाते हैं.

उदाहरण के लिए, Google फ़ॉन्ट्स आपको स्टाइल शीट के रूप में फ़ॉन्ट प्रदान करता है। उस स्थिति में, आप उन्हें अपनी वर्डप्रेस साइट पर इस तरह से जोड़ देंगे:

फ़ंक्शन add_google_fonts () {
wp_enqueue_style ('google_web_fonts', 'https://fonts.googleapis.com/css?family=Open+SanspgRoboto');
}

add_action ('wp_enqueue_scripts', 'add_google_fonts');

इसके विपरीत, एडोब एज वेब फोंट से फोंट जावास्क्रिप्ट के रूप में आते हैं। इसलिए, उन्हें अपनी साइट पर रखने के लिए, कोड इस तरह दिखेगा:

फ़ंक्शन add_adobe_fonts () {
wp_enqueue_script ('adobe_edge_web_fonts', '//use.edgefonts.net/open-sans.js');
}

add_action ('wp_enqueue_scripts', 'add_adobe_fonts');

क्या यह इतना मुश्किल नहीं था? साथ ही, आपको इसे वर्डप्रेस तरीके से करने के लिए अतिरिक्त अंक मिलते हैं.

5. अपनी शैली शीट में कस्टम फ़ॉन्ट्स को कॉल करें

अब जब फोंट आपकी साइट में जुड़ गए हैं, तो आप आधिकारिक तौर पर उनका उपयोग कर सकते हैं। ऐसा करने के लिए, अपनी शैली शीट में नए फ़ॉन्ट के लिए घोषणा को जोड़ना बाकी है। उदाहरण के लिए, अपने शीर्षक टैग के लिए फ़ॉन्ट बदलने के लिए, आप कुछ इस तरह का उपयोग करेंगे:

h1,
h2,
h3,
h4,
h5,
h6 {
फ़ॉन्ट-परिवार: 'रोबोटो';
}

ध्यान दें: इस बात पर ध्यान दें कि आप जिस सेवा का उपयोग कर रहे हैं वह आपके फोंट के लिए सीएसएस घोषणा को कैसे निर्दिष्ट करती है। हमारी परीक्षण साइट पर, हमें प्रतीत होता है कि उन्हें काम करने के लिए एडोब एज वेब फ़ॉन्ट्स नहीं मिले क्योंकि वे CSS के साथ ओपन संस कहते हैं खुले बिना विरोध के रूप में 'ओपन संस' Google फ़ॉन्ट्स में.

बस। अब आप जानते हैं कि वर्डप्रेस में कस्टम फोंट को मैन्युअल रूप से कैसे जोड़ा जाता है। अपने आप को बधाई दें, यह कुछ अगले स्तर का ज्ञान है! जाहिर है, प्लगइन्स के माध्यम से समान क्रियाएं संभव हैं। हम इसके बारे में आगे बात करेंगे.

बी) प्लगइन के माध्यम से वर्डप्रेस में कस्टम फ़ॉन्ट कैसे जोड़ें

वर्डप्रेस क्षेत्र में कस्टम फोंट जोड़ने के लिए कई प्लगइन समाधान नहीं हैं, तो ऐसा नहीं होगा। हम कैसे उपयोग करने के लिए आगे बढ़ेंगे आसान Google फ़ॉन्ट्स, जो इस क्षेत्र में सबसे लोकप्रिय प्लगइन्स में से एक है.

1. प्लगइन स्थापित करें

पहला कदम प्लगइन स्थापित कर रहा है। ऐसा करने के लिए, पर सिर प्लगइन्स> नया स्थापित करें. फिर, प्लगइन का नाम खोजें। खोज परिणामों में, पर क्लिक करें अभी स्थापित करें और अपनी साइट पर एक बार प्लगइन को सक्रिय करें.

2. अपनी साइट पर फ़ॉन्ट्स जोड़ें / बदलें

जब प्लगइन सक्रिय होता है, तो आपको एक नया मेनू आइटम कहा जाता है टाइपोग्राफी के अंतर्गत रूप> अनुकूलित करें.

वर्डप्रेस कस्टमाइज़र में टाइपोग्राफी मेनू

जब आप उस पर क्लिक करें और चुनें डिफ़ॉल्ट टाइपोग्राफी, आप अपने पैराग्राफ और शीर्षकों के फ़ॉन्ट को बदलने के लिए नियंत्रणों की एक सूची पाते हैं.

वर्डप्रेस कस्टमाइज़र में आसान Google फोंट सेटिंग्स

उनका उपयोग करना वास्तव में सरल है। बस ड्रॉप-डाउन मेनू पर क्लिक करें जहां यह कहता है फ़ॉन्ट संपादित करें अपनी साइट के उस हिस्से के लिए जिसे आप इसे बदलना चाहते हैं। यह आपको इस मेनू तक पहुंच प्रदान करता है:

आसान गूगल फोंट बदल फ़ॉन्ट

यहाँ, सबसे महत्वपूर्ण हिस्सा एक है फ़ॉन्ट परिवार. यहां, आप संपूर्ण Google फ़ॉन्ट लाइब्रेरी से नया फ़ॉन्ट प्रकार चुन सकते हैं (उपयोग करें स्क्रिप्ट / सबसेट फ़ॉन्ट विकल्पों को विशेष वर्णों वाले लोगों तक सीमित करने के लिए).

फोंट मानक, सेरिफ़, सैंस-सेरिफ़, डिस्प्ले, हैंडराइटिंग और मोनोस्पेस फॉन्ट द्वारा ऑर्डर किए जाते हैं। हालाँकि, आप उन्हें केवल नाम से भी खोज सकते हैं.

जब आप एक फ़ॉन्ट पर क्लिक करते हैं, तो आप दाईं ओर वास्तविक समय में परिवर्तनों का पूर्वावलोकन कर सकते हैं.

आसान गूगल फोंट में कस्टम फ़ॉन्ट बदल गया

3. फ़ॉन्ट कॉन्फ़िगर करें

एक बार जब आप एक फ़ॉन्ट चुन लेते हैं, तो आपकी टाइपोग्राफी को और अधिक अनुकूलित करने के लिए कई विकल्प होते हैं.

सबसे पहले, आप एक ही नाम के मेनू के तहत फ़ॉन्ट-वजन / शैली को बदल सकते हैं। यह अक्षरों की मोटाई को नियंत्रित करता है.

इसके अलावा, के तहत पाठ सजावट, आप अंडरलाइन, स्ट्राइकथ्रू और ओवरलाइन को जोड़ने में सक्षम हैं. पाठ रूपांतरण आपको इसे सभी कैप, सभी लोअरकेस या हर पहले अक्षर को कैपिटल करने की अनुमति देता है। के नीचे दिखावट शीर्ष पर टैब, आप फ़ॉन्ट रंग, पृष्ठभूमि रंग, फ़ॉन्ट आकार, रेखा की ऊंचाई और पत्र रिक्ति को भी नियंत्रित कर सकते हैं.

आसान गूगल फोंट में उपस्थिति सेटिंग्स

आखिरकार, पोजिशनिंग आपको अन्य सेटिंग्स जैसे मार्जिन, पैडिंग, बॉर्डर, बॉर्डर-रेडियस और डिस्प्ले को बदलने की सुविधा देता है.

आसान गूगल फोंट में स्थिति सेटिंग

संक्षेप में, आपको अपनी साइट पर फोंट को अपनी पसंद के अनुसार पूरी तरह से अनुकूलित करने में सक्षम होना चाहिए। आसान है, क्या यह नहीं है? हिट करना न भूलें सहेजें और प्रकाशित करें शीर्ष पर जब आप अपने परिवर्तनों से संतुष्ट होते हैं.

यह काम नहीं कर रहा है, मैं क्या करूँ?

कभी-कभी आप अपनी साइट पर कुछ फोंट को बदलने में असमर्थ होते हैं। यह आमतौर पर तब होता है जब आप जिस विषय का उपयोग कर रहे हैं वह गैर-मानक सीएसएस वर्गों और चयनकर्ताओं के साथ आता है.

उदाहरण के लिए, ट्वेंटी सिक्सटीन थीम में, ब्लॉग पोस्ट शीर्षक को केवल एच 1 के रूप में परिभाषित नहीं किया गया है, बल्कि एक सीएसएस क्लास भी कहा जाता है .प्रवेश शीर्षक. उस कारण से, प्लगइन उन्हें बदलने में सक्षम नहीं है.

इस समस्या के समाधान के लिए, आपको एक तथाकथित बनाने की आवश्यकता है फ़ॉन्ट नियंत्रण के अंतर्गत सेटिंग्स> Google फ़ॉन्ट्स.

आसान Google फ़ॉन्ट में फ़ॉन्ट नियंत्रण जोड़ें

आप सीएसएस चयनकर्ताओं को नए नियंत्रण के साथ जोड़ सकते हैं और जब आवश्यक हो तो ओवरराइड कर सकते हैं। आपके द्वारा ऐसा करने के बाद, नया फ़ॉन्ट नियंत्रण वर्डप्रेस कस्टमाइज़र के तहत एक अतिरिक्त विकल्प के रूप में उपलब्ध है थीम टाइपोग्राफी. बहुत आसान.

अन्य कस्टम फ़ॉन्ट्स वर्डप्रेस प्लगइन्स

कस्टम फोंट जोड़ने के लिए अन्य वर्डप्रेस प्लगइन्स भी उपलब्ध हैं:

  • किसी भी फ़ॉन्ट का उपयोग करें - यह बिना किसी सीएसएस के अपलोड किए गए फोंट का उपयोग करने में आपकी मदद करता है। यह आपके स्वयं के सर्वर पर फोंट रखता है और फॉन्ट प्रारूपों के लिए रूपांतरण उपकरण भी प्रदान करता है.
  • वर्डप्रेस के लिए टाइपेकिट फोंट - एडोब के फोंट का उपयोग करें बहुत बढ़िया सेवा (जिसके लिए आपको साइन अप करने की आवश्यकता है)। यह आपको प्लगइन में सीधे एम्बेड कोड और कस्टम सीएसएस इनपुट करने की अनुमति देता है.
  • टीके गूगल फ़ॉन्ट्स - Google फोंट एम्बेड करने के लिए एक वैकल्पिक समाधान जो वर्डप्रेस बैकएंड में Google फोंट अनुभव को बहुत अधिक स्थानांतरित करता है। पूर्वावलोकन और कस्टम पाठ के साथ फ़ॉन्ट आज़माएं, फिर इसे वर्डप्रेस कस्टमाइज़र के अंदर बदलें.

क्यों अपनी वर्डप्रेस वेबसाइट पर कस्टम फ़ॉन्ट्स का उपयोग करें?

टाइपोग्राफी अपने आप में एक विज्ञान है और हम यहां वेब डिज़ाइन में फोंट के उपयोग पर आपको पूरा कोर्स नहीं दे पाएंगे। सब के बाद, यह न केवल फ़ॉन्ट के बारे में है, बल्कि इसके आकार, तिरछा, मोटाई और बहुत सी अन्य चीजें भी हैं। हालांकि, हम कर सकते हैं अपनी वर्डप्रेस साइट पर कस्टम फोंट का उपयोग करना क्यों एक अच्छा विचार है.

1. टाइपोग्राफी पहली छाप का हिस्सा है

सबसे पहले, आपके द्वारा उपयोग किया जाने वाला फ़ॉन्ट आपकी साइट को माना जाता है कि बहुत अधिक प्रभावित करता है। क्या आपकी साइट मज़ेदार और चंचल है? क्या आप एक व्यवसायिक पेशेवर हैं? आगंतुक इसे एक नज़र में तय करते हैं और आपकी टाइपोग्राफी उनकी धारणा में एक बड़ी भूमिका निभाती है.

2. फ़ॉन्ट्स आपको लगता है कि बहुत अधिक प्रभाव है

यह आपकी सीखने की क्षमता, ग्रंथों को याद रखने और यहां तक ​​कि आपके मूड को भी प्रभावित कर सकता है.

उदाहरण के लिए, एक में अनुसंधान, यह नोट किया गया था कि यदि आप किसी पाठ को पढ़ने में लगने वाले समय को बढ़ाना चाहते हैं, तो आपको एक सेरिफ़ फ़ॉन्ट का उपयोग करना चाहिए। हालांकि, यदि आप कम समय में अधिक पढ़ना चाहते हैं, तो आपको एक सेन्स-सेरिफ़ फ़ॉन्ट पर स्विच करना चाहिए.

एक अन्य अध्ययन ने लोगों को विभिन्न टाइपफेस में एक ही व्यायाम निर्देश दिखाया। उन्होंने तब प्रतिभागियों से यह अनुमान लगाने के लिए कहा कि उन्हें उक्त निर्देशों को पूरा करने में कितना समय लगेगा। आकर्षक रूप से, अधिक जटिल फ़ॉन्ट वाले लोगों ने अनुमान लगाया कि उन्हें सरल फ़ॉन्ट के साथ समूह की तुलना में अधिक समय लगेगा। नतीजतन, वे व्यायाम दिनचर्या का पालन करने की संभावना कम थे.

जहां कस्टम फ़ॉन्ट्स खोजने के लिए

1. कस्टम टाइपोग्राफी खोजने के लिए Google फ़ॉन्ट्स का उपयोग करें

पहली सेवा हम देखेंगे Google फ़ॉन्ट्स. जैसा कि नाम से पता चलता है, यह Google की एक सेवा है जो 800+ विभिन्न फोंट प्रदान करती है। उपयोग करने के लिए नि: शुल्क। सभी के लिए.

यहाँ इसका उपयोग कैसे किया जाता है:

2. सही फ़ॉन्ट खोजें

जब आप पहली बार Google फ़ॉन्ट्स पेज पर जाते हैं (बस Google खोज में टाइप करें), यह वही है जो आप देखेंगे:

कैसे वर्डप्रेस गूगल फोंट होमपेज में कस्टम फोंट जोड़ने के लिए

उपयोगकर्ता इंटरफ़ेस आपको अपने उद्देश्य के लिए सही फ़ॉन्ट खोजने में मदद करने के लिए बनाया गया है। यदि आपके पास पहले से ही एक फ़ॉन्ट है, तो आप बस दाईं ओर स्थित खोज फ़ील्ड में उसका नाम लिख सकते हैं.

यदि नहीं, तो आप कई अलग-अलग तरीकों से फोंट को फ़िल्टर कर सकते हैं, उदाहरण के लिए, श्रेणी के आधार पर:

  • सेरिफ़ - टाइम्स न्यू रोमन की तरह, अंत में स्क्वीजली लाइनों के साथ फोंट अर्थ.
  • सान्स सेरिफ़ - स्क्वीगल के बिना सरल फोंट, जैसे हेल्वेटिका। इस वेबसाइट पर उपयोग किए गए फोंट उसी का एक उदाहरण हैं.
  • प्रदर्शन - ऐसे टाइपफेस जिनका उपयोग बड़े आकार में किया जा सकता है जैसे हेडलाइंस.
  • लिखावट - क्या आप चाहते हैं कि आपकी टाइपोग्राफी वैसी ही दिखे जैसी वह हाथ से लिखी गई थी? फिर यह आपकी सेटिंग है.
  • एकलस्पेस - टाइपोग्राफी जहां सभी वर्ण एक ही स्थान पर कब्जा कर लेते हैं, इस तरह.

अन्य फिल्टर में शामिल हैं:

  • छंटाई - ट्रेंडिंग, लोकप्रिय, तिथि जोड़ी या वर्णानुक्रम के बाद क्रमबद्ध फोंट.
  • बोली -अरबी, थाई या वियतनामी जैसी लैटिन वर्णमाला में नहीं लिखी जाने वाली भाषाओं के लिए अपनी फ़ॉन्ट पसंद को सीमित करें.
  • शैलियों की एक संख्या -आपको कितनी उपलब्ध शैलियों की आवश्यकता है, चुनें कि क्या एक फ़ॉन्ट विभिन्न मोटाई, इटैलिक, बोल्ड और अधिक में उपलब्ध है.
  • मोटाई - अपने फ़ॉन्ट की वांछित मोटाई चुनें.
  • तिरछा - मोटाई के समान लेकिन तिरछा के लिए। यह सीधे से लेकर लगभग क्षैतिज तक होता है.
  • चौड़ाई - उनके अक्षरों और रिक्ति की चौड़ाई से फोंट फ़िल्टर करें.

जब आप कोई फ़िल्टर लागू करते हैं, तो आपके खोज परिणाम वास्तविक समय में समायोजित हो जाते हैं। बाईं ओर, आपको अपनी श्रेणी में उपलब्ध फोंट और उदाहरण वाक्य दिखाई देंगे.

जब आप किसी फ़ॉन्ट पर होवर करते हैं, तो आप Google फ़ॉन्ट को एक उदाहरण पैराग्राफ़, संपूर्ण वर्णमाला या अंक प्रदर्शित करने के लिए शीर्ष पर ड्रॉप-डाउन मेनू का उपयोग कर सकते हैं। आप बस वाक्य फ़ील्ड पर क्लिक कर सकते हैं और जो चाहें लिख सकते हैं.

Google फोंट में नमूना पाठ संपादित करें

इसके अलावा, फ़ॉन्ट शैली और आकार बदलने के लिए विकल्प हैं। जब आप परिवर्तन करते हैं, तो आपको अपने सभी खोज परिणामों पर उन्हें लागू करने का विकल्प भी मिलता है। अंत में, फ़ॉन्ट विवरण पृष्ठ पर क्लिक करके देखें नमूना देखें.

Google फोंट में फ़ॉन्ट विवरण पृष्ठ

3. अपने संग्रह में फ़ॉन्ट्स जोड़ें

यदि आप एक विशेष फ़ॉन्ट पसंद करते हैं, तो आप इसे अपने संग्रह में जोड़ने के लिए ऊपरी दाएं कोने में लाल प्लस चिह्न का उपयोग कर सकते हैं। ऐसा करने पर नीचे एक मेनू खुलेगा जहाँ आपको अपने सभी चुने हुए फोंट दिखाई देंगे.

गूगल फोंट में चयनित फोंट

ध्यान दें कि आप एक से अधिक फ़ॉन्ट परिवार जोड़ सकते हैं। यह समझ में आता है, उदाहरण के लिए, जब आप अपने शरीर की नकल के लिए एक उठा रहे हैं और दूसरे शीर्षकों के लिए.

4. फ़ॉन्ट सेटिंग्स अनुकूलित करें

एक बार जब आप अपने संग्रह से संतुष्ट हो जाते हैं, तो नीचे मेनू पर क्लिक करें। ऐसा करने से यह स्क्रीन खुल जाएगी:

गूगल फोंट में फ़ॉन्ट सेटिंग्स

जैसा कि आप देख सकते हैं, आप अपनी साइट पर फोंट एम्बेड करने और उपयोग करने के लिए कोड के कुछ टुकड़े पा सकते हैं। यह बाद में महत्वपूर्ण हो जाएगा। अभी के लिए, उस टैब पर क्लिक करें जो कहता है अनुकूलित करें. ऐसा करना आपको इस मेनू में ले जाता है:

Google फोंट में फोंट अनुकूलित करें

यहां, आप प्रश्न में फोंट की शैलियों का चयन करने में सक्षम हैं। यह महत्वपूर्ण है यदि आप विभिन्न आकारों में फोंट का उपयोग करना चाहते हैं, जो अक्सर होता है.

हालांकि, सावधान रहें: आपकी साइट को जितनी अधिक शैलियों को लोड करना होगा, उतना ही यह धीमा हो जाएगा (Google फ़ॉन्ट्स आपको शीर्ष दाईं ओर आपके वर्तमान संग्रह के लिए लोडिंग गति का संकेत भी देता है)। इसलिए, इस बारे में सोचें कि आपको वास्तव में क्या चाहिए और केवल वही चुनें। वैसे, और भी तरीके हैं जिनसे आप वर्डप्रेस को गति दे सकते हैं.

यदि आपको मानक लैटिन वर्णमाला की तुलना में किसी अन्य भाषा की आवश्यकता है, तो इसे नीचे भी चुनें.

Google फोंट में फ़ॉन्ट भाषाओं का चयन करें

इसके अलावा, आप सभी को पता होना चाहिए कि शीर्ष पर दो तीर चिह्न हैं.

डाउनलोड और गूगल फोंट में बटन साझा करें

बाईं ओर वाला आपको अपने फ़ॉन्ट संग्रह का पूर्वावलोकन और साझा करने की अनुमति देता है। जब आप ऐसा करने के लिए चुनते हैं, तो यह एक विस्तारित पृष्ठ खोलता है जहां आप नमूना पाठ सम्मिलित कर सकते हैं और इसे एक ही बार में सभी फोंट में देख सकते हैं। यह पेज लोगों के साथ साझा करने के लिए भी अच्छा है.

अधिक महत्वपूर्ण इसके बगल में डाउनलोड बटन है। इसे क्लिक करके आप अपने डेस्कटॉप मशीन (उदाहरण के लिए, फ़ोटोशॉप में) का उपयोग करने के लिए फ़ॉन्ट फ़ाइलों को डाउनलोड कर सकते हैं। उपयोग Skyfonts उन्हें बनाए रखने के लिए.

बाद में, हम आपको इन फ़ाइलों को आपके सर्वर पर अपलोड करने और अपनी साइट पर सीधे फ़ॉन्ट होस्ट करने का एक तरीका भी दिखाएंगे। भविष्य के लिए इसे ध्यान में रखें। अभी के लिए, हम आपको एक दूसरा, समान फ़ॉन्ट लाइब्रेरी दिखाएंगे.

कस्टम फ़ॉन्ट्स के लिए अतिरिक्त स्रोत

  • 15 + वेब सुरक्षित फोंट हम सुझाते हैं

उपरोक्त के साथ, आपको अपने लिए कुछ खोजने में सक्षम होना चाहिए। एक अंतिम टिप - यदि आपको पता नहीं है कि फोंट को ठीक से कैसे संयोजित किया जाए, तो उपयोग करें फ़ॉन्ट जोड़ी जहां डिजाइनरों ने आपके लिए लेगवर्क किया है.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
Adblock
detector