Eklentiler olmadan WordPress’te indirilen yazı tipleri nasıl kullanılır
Google yazı tipi olağanüstü bir kaynaktır. Yaygın olmadan önce, benzersiz yazı tipleri kullanan bir web sitesi yapmak çok zahmetlidir. Ancak, şimdi, birkaç tıklama ve bir kod görüntüsü ile web siteniz Helvetetic-EH’den Helvetic-Awesome’a değişir. Peki ya sevdiğiniz yazı tipi Google Font ailesinin bir parçası değilse? İndirilen bir yazı tipini nasıl kullanacağınızı bilmeniz gerekir, çünkü sakal ruhunuzla konuşan fantastik bir hipster yazı tipi buldunuz. Web sitenizdeki indirilen yazı tiplerini kullanmak, tıklama tıknaz-yapıştırmalık kadar basit değildir. Bu zor bir süreç değil, hatırlayın ve size bir daha asla bir Helvetetic-Eh web sitesine sahip olmayacak şekilde size rehberlik edeceğim.
Şimdi, bunu bir eklenti üzerinden yapabileceğinizi göstermek istiyorum. Repo’da bazıları var. Ama neden bunu yapmak istiyoruz? Birkaç kod satırı aynı şeyi yapacağında eklentileri kullanmaktan kaçınmayı tercih eden biriyim. Fazla eklenti, gereksiz çok fazla şişkinliğe, HTTP isteklerine ve sitenizi yavaşlatır. Bu nedenle bu yazı tiplerini 90’ların sonunda el benzeri ile içe aktaracağız. Vay canına, evet. Rounup yazı tipinin yazı tipi hayranlarımı seçmek ve indirmek. Zarif tema, neyi sevdiğinizi görmek için tarayabileceğiniz çok şey var. Öyleyse bunlardan bazılarına basın ve neyi sevdiğinizi görün.
El yazısı yazı tipleri
Retro yazı tipi
Yüksek sınıf yazı tipi
Sandalye yazı tipi
Hipster yazı tipi
Eğlenceli yazı tipi
Benim için hipster koleksiyonundan aventure yazı tipini kullanıyorum.
Her FTP hesabını orada ana bilgisayar için göreceksiniz ve her bir hesabın yanındaki FTP istemci yapılandırma bağlantısını da göreceksiniz. Oraya girdiğinizde, cpanel size kimlik bilgilerinizi ayarlamak için içe aktarabileceğiniz sunucu veya filezilla (vb.) Bilgileri verir. . Kılavuz kullanıyorum, kişisel olarak, ama istediğiniz şeyi yapıyorsun. Dosyayı kullansanız bile, girmek için bir şifreye ihtiyacınız olacaktır, böylece her iki yöntem de güvenli ve garanti edilir. Şimdi ana bilgisayara FTP üzerinden girdikten sonra, siteniz için klasör /wp-content’e gidin. Bu, WordPress siteniz için bir içerik olduğu için neden oraya koymuyorsunuz? /WP-Concent /yüklemelerde bile hiçbir yere koymaktan çekinmeyin. Sen yapıyorsun. FTP’nin dosyanızı yüklemek çok kolaydır. İndirdiğiniz yazı tipi dosyasını bulun ve FileZilla’daki sağ alt panele sürükleyin. Yüklemeye başlayacak. Dizinde görmeniz için bir saniyeden fazla veya daha fazla gerekmez. Yukarıda tartıştığımız Fontsquirrel aracını kullanırsanız, bunu indirdiğiniz tüm yazı tipi dosyaları için de yaparsınız. Kaydetmek istediğiniz yere oldukça sürükleyin ve bırakın. Yazı tipinizi yazı tipinizle kullanmak CSS artık yüklenir ve sıcak ve rahat bir WP içerik battaniyesine güvenli bir şekilde kıvrılır. Temanıza gerekli CSS ithalatını eklemenin zamanı geldi. FTP istemcinizde çocuğunuzun tema dizinini açın (çocuk temasını kullanırsınız, değil mi?) Ve style.css dosyasını bulun, sağ -cüzdanı ve varsayılan metin düzenleyicinizde görüntülemek için See/Düzenle’yi seçin. Çocuk temanız yoksa, çok hızlı bir şekilde yapmak için Orbisius Çocuk Teması Yaratıcısını kullanın. Daha sonra eklentiyi silebilirsiniz. Bunu beğendim. Kullandığımız@font-yüz kodu doğrudan Fontsquirrel’den gelir (kendiniz yazabilir veya aşağıdaki örneği kopyalayabilir /ekleyebilirsiniz) ve değiştirdiğim tek şey url yükleme yolu dahil /wp-content. Diğer her şey webfont jeneratörünün sağlandığı şeydir. Tüm bu @font-face betiği, web sitenizin stil sayfası, “Hey, arkadaşım, bir ara kullanmak istiyorsanız bu yeni yazı tipini buraya koyuyorum.” Bilirsiniz, eve bir kase pastası getirdiğinizde ve sizinle yaşayan insanlara söylediğinizde. Font-Face olmadan, yazı tiplerini çağırmaya çalışırsanız: ‘Aventabold’; CSS tarafından, siteniz onu bulamayacaktır, çünkü size nerede sakladığınız söylenmediğiniz için size hiç söylenmemiş. @font-face {
yazı tipi ailesi: ‘aventabold’; Src: url (‘/wp-content/aventura-bold-webfont.eot’);
Src: url (‘/wp-content/aventura-bold-webfont.eot? #İfix’) biçimi (‘gömülü-optype’),
Url (‘/wp-content/aventura-bold-webfont.woff2’) biçimi (‘woff2’),,
Url (‘/wp-content/aventura-bold-webfont.woff’) biçimi (‘woff’),
Url (‘/wp-content/aventura-bold-webfont.ttf’) biçimi (‘truetype’),,
Url (‘/wp-content/aventura-bold-webfont.svg#aventerabold’) biçimi (‘svg’); font-weight: normal;
yazı tipi tarzı: normal;
}
Dosyayı kaydedin ve Filezilla aracılığıyla düzenlemek için açtığınız için, sunucuda olanı değiştirmek isteyip istemediğinizi soran bir iletişim kutusu alacaksınız. Cevabınız, elbette evet.
Şimdi tek yapmanız gereken Custom.css (veya Divi, Divi -> Tema seçeneği -> CSS Custom, WP kontrol paneli gezinme panelinizde gitmek.) Diğer için yaptığınız gibi CSS stilini ekleyebilirsiniz. yazı tipleri. ‘Aventabold’ ile kullandığım sadece ‘Roboto’ ve ‘exo’ adlı Google yazı tiplerini değiştirmem gerekiyor ve her şey sorunsuz çalışıyor (yukarıdaki @font-yüz ithalatı için teşekkür ederim). Body {
Yazı tipi ailesi: “Aventabold”, Arial, sans-serif;
yazı tipi boyutu: 18px;
Hat yüksekliği: 28px;
Renk: #ffffff;
Metin-Transform: büyük harf;
}
H1, H2, H3, H4, H5, H6 {
Renk: #fff;
Yazı tipi ailesi: ‘aventrabold’, sans-serif;
yazı tipi-ağırlık: 700;
Metin-Transform: büyük harf;
}
Aşağıdaki çalışma aşağıdaki görünüm:
Ve CSS’ye Aventure ekledikten sonra olan budur:
Yaşasın!Başarmak!İyi iş!Bize git!İyi görünüyor, Yüzbaşı Malcolm Reynolds gibi bir arkadaş, “İmkansız bir şey yaptık ve bu bizi güçlendiriyor” dedi.Tamam, bu nedenle yazı tiplerini yüklemek ve CSS aracılığıyla içe aktarmak imkansız şeyler yapmak için yeterli olmayabilir, ancak kesinlikle birçok WordPress kullanıcısının yapmaya cesaret edemeyeceği bir şey yaptınız: Eklentiler olmadan temel işlevsellik ekleyin.Ve bu, dostlarım seni güçlü kılıyor.Peki, Google yazı tipi olmayan web’de kullanmak için en sevdiğiniz yazı tipi nedir?Bana yorumlarda söyle! 32 piksel / shutterstock.com ile makalelerin mini resimleri
