WordPress Site Temanıza Özel Yazı Tipleri Eklemenin 3 Farklı Yolu

Yayınlanan: 2020-05-26

WordPress web sitenizin daha benzersiz ve görsel olarak çekici görünmesini sağlamanın birçok ilginç ve özelleştirilebilir yolu vardır. Yollardan biri, WordPress sitenize özel yazı tipleri eklemektir. Rakiplerinizin web sitelerinden bazılarına göz atın. Kendi WordPress web sitenizle oluşturmayı umduğunuz aynı tonu ve stili taklit edebilirler. Yazı tipi kullanımlarına dikkat edin. Birçok başarılı site, web sitesinin tamamında tutarlı bir şekilde kullanılan, özenle seçilmiş bir avuç yazı tipini kullanma eğilimindedir.

Kendi sitenize kolayca ekleyebileceğiniz, çevrimiçi olarak ücretsiz olarak sunulan pek çok özel yazı tipi vardır. Doğru yazı tiplerini bulduktan sonra, bunları web sitenize nasıl uygulayacağınızı bilmeniz gerekecek. Bunu başarmak için deneyebileceğiniz bir dizi yöntem var.

Her şeyden önce, doğru yazı tipini bulmak; indirmeniz için binlerce ücretsiz yazı tipi sunan sayısız site var. Google Fonts, TemplateMonster, MyFonts, FontSpring, Cufonfonts, Dafont, Font Squirrel, Edge Web Fonts, 1001 Ücretsiz Font, Fonts.com'u deneyin.

Kısacası, WordPress web sitenize özel yazı tipleri eklemenin iki ana yolu vardır: manuel olarak veya eklentilerle.

İçindekiler tablosu gösterisi
  • WordPress Site Temanıza Manuel Olarak Özel Yazı Tipleri Ekleyin
  • WordPress Site Temanıza Özel Yazı Tipleri Eklemek için Eklentileri Kullanın
  • Son olarak, Temaları Kullanmayı Deneyin

WordPress Site Temanıza Manuel Olarak Özel Yazı Tipleri Ekleyin

tipografi-yazı tipleri-karakter-harf-tasarım

WordPress sitenize çok fazla eklenti yükleme riskini almak istemiyorsanız, WordPress'inize manuel olarak özel yazı tipleri eklemek faydalı olabilir. Bu, @font-face yönergesini düzenleyerek gerçekleştirilebilir. Bu, sitenize herhangi bir biçimdeki birden çok yazı tipini bağlamanıza olanak tanır.

Bu, aşağıdaki adımları içerir:

Aşama 1

Öncelikle, en yararlı bulduğunuz web sitesinden seçtiğiniz özel yazı tiplerini indirin. Dosya bilgisayarınıza kaydedildikten sonra bu .zip arşivini çıkarın.

Adım 2

Bunu takiben, bu yazı tipi dosyasını WordPress barındırma sunucunuzdaki “wp-content/themes/your-theme-folder/fonts” dizini altına yükleyebilirsiniz. Özel yazı tipleriniz için belirlenmiş bir klasör oluşturmadıysanız, bir tane oluşturun ve oraya kaydedin.

Aşama 3

Ardından, WordPress'in yönetici alanına gidin. Görünüm'ü seçin ve ardından Tema Düzenleyici'ye gidin. Bu noktada ekranınızda temanın style.css dosyasını göreceksiniz. Bunun altına, bu kod bölümünü eklemeniz gerekecek:

 @font-face { font-family: Aguafina Script-Regular; src: url(http://test-site.com/wp-content/themes/your-theme-folder/fonts/AguafinaScript-Regular.ttf); font-weight: normal; }

Koddaki “URL” ve “font-family”yi seçtiğiniz yazı tipine uygun değerlerle değiştirmeyi unutmayın. Ayrıca bu kod bölümünü CSS dosyasının başına, ancak tema yorumlarından sonra yapıştırmalısınız.

Adım 4

Son olarak, o önemli Dosyayı Güncelle düğmesine tıkladığınızdan emin olun. Bu, siz sayfadan ayrılmadan önce yaptığınız değişikliklerin düzgün bir şekilde kaydedilmesini sağlar.

Adım 5

Bunu takiben, yazı tipini temanızın stil sayfasında uygulamak istediğiniz başka herhangi bir yerde kolayca kullanabilirsiniz. Aşağıdaki kodu kullanarak:

 .h1 site-title { font-family: "Aguafina Script-Regular", Arial, sans-serif; }

Artık bu yazı tipi-yüz kodunu düzenlediğinize göre, birisi web sitenize her girdiğinde yazı tipi yüklenecektir. Ancak bunu henüz sayfadaki belirli bir öğeye uygulamadınız. Bunu yapmak için, az önce erişmekte olduğunuz ilgili style.css dosyasında son bir düzenleme daha yapmanız gerekir. Dosyaya aşağıdaki gibi bir kod girmeniz gerekecek:

 .site-title { font-family: "Aguafina Script-Regular", Arial, sans-serif; }
Sizin için önerilenler: Yeni Başlayanlar Kılavuzu: Bir WordPress Teması Nasıl Kurulur?

Hızlı not:

Daha önce olduğu gibi, font-family değerini kullandığınız fonta uygun olacak şekilde düzenlemeyi unutmayın.

Örneğin, Google Fonts'tan özel yazı biçimleri kullanıyorsanız, kopyalayıp temanızın style.css dosyasına yapıştırmanız için size ilgili kodu sağlayan @import adlı bir sekme olduğunu göreceksiniz. Çok fazla kodlamayla uğraşmaktan rahatsızsanız, bu, tüm süreci çok daha basit hale getirebilir.

Ancak, bu artık pek tavsiye edilen bir yöntem değildir. Tarayıcıların aynı anda birden fazla stil sayfası indirmesini engelleyen bazı performans sorunlarıyla karşılaştı. Bu, sonuçta sayfaların daha yavaş yüklenmesine neden olur. Yazı tiplerinizi ve bunları kullanma yöntemlerini seçerken bunu aklınızda bulundurun.

Öte yandan, CSS aracılığıyla manuel özel yazı tipi kurulumu, SVG, WOFF, TTF ve OTF dahil olmak üzere çeşitli biçimlerdeki yazı tiplerini bağlamanıza olanak tanır. Bu yöntem ayrıca üçüncü taraf hizmetlerine güvenmek zorunda kalmadan çalışmanıza olanak tanır. Yazı tipi dosyalarınız sunucunuzda bulunacaktır. Bu, WordPress'e özel yazı tipleri eklemenin en doğrudan yoludur.

WordPress Site Temanıza Özel Yazı Tipleri Eklemek için Eklentileri Kullanın

Photoshop Yazı Tipleri ÜCRETSİZ! Öne Çıkanlar

Pek çok kişi, özel yazı tiplerini WordPress sitelerine eklemek için eklentileri kullanmayı tercih eder, çünkü bu, birçok yönden bunu yapmanın en basit yöntemi olabilir. Bu, özellikle CSS kodlamasıyla uğraşmak istemiyorsanız geçerlidir. Google Yazı Tipleri, büyük ölçüde WordPress eklentisiyle birlikte kolayca kullanılabilmesi nedeniyle popüler bir seçimdir. Sizin için en iyi iki seçenek, Easy Google Fonts ve Google Fonts Tipografi'dir. Bu eklentilerden herhangi birini etkinleştirdikten sonra, herhangi bir karmaşık kodla uğraşmak zorunda kalmadan sayfalarınıza eklemek için tüm Google Fonts yazı tipi kataloğuna kolayca erişebileceksiniz.

Google Yazı Tiplerini kullanmak, bunu yapmanın en basit yoludur ve değişikliklerinizi ve özel yazı tiplerinizi ekranda gerçek zamanlı olarak önizleyebilirsiniz.

Hangi yazı tipi dosyalarını kullanmak istediğinize bağlı olarak ve tek bir havuz kullanmayı düşünüyorsanız, Özel Yazı Tipleri eklentisi gibi alternatif bir eklenti kullanmayı düşünebilirsiniz.

Aşama 1

Seçtiğiniz eklentiyi yükledikten ve etkinleştirdikten sonra, Görünüm'e gidin ve ardından canlı WordPress tema özelleştirici arayüz sayfasını açacak olan Özelleştirici sayfasına tıklayın. Burası, kendi özel yazı tiplerinizi uygulayabileceğiniz kendi sitenizin her bir bölümünü gösterecek olan Tipografi sekmesini göreceğiniz yerdir.

Adım 2

Bu sayfayı açtıktan sonra, sayfanın düzenlemeye başlamak istediğiniz bölümündeki Yazı Tipini Düzenle düğmesine tıklayabileceksiniz. Ardından yazı tipi stilini, boyutunu, kenar boşluğunu vb. seçerek çeşitli alt bölümler üzerinde çalışabilirsiniz – bu bölümler kullandığınız temaya göre değişiklik gösterecektir.

Temanız, web sitenizin çeşitli bölümleri için yazı tipi seçiminizi doğrudan düzenleyemeyeceğiniz anlamına da gelebilir. Bununla birlikte, bu sorun için basit bir düzeltme var: kendi yazı tipi kontrollerinizi oluşturabileceğiniz Ayarlar'a ve ardından Google Yazı Tipleri'ne gitmeniz yeterli. Bunu yapmak için, kutuya bir Kontrol Adı girin ve CSS seçicileri seçin. Bu, bu yazı tipi için hedeflemek istediğiniz herhangi bir HTML öğesini eklemenizi sağlar. Bu bilgileri girdikten sonra, ayarlarınızın tamamen güncellenmesi için Yazı Tipi Kontrolünü Kaydet düğmesine tıklayarak değişikliklerinizi kaydettiğinizden emin olun. Ardından, WordPress web sitenizin her farklı bölümü için ihtiyaç duyacağınız kadar çok özel yazı tipi kontrolü oluşturmaya devam edebilirsiniz.

Aşama 3

Bu yeni yazı tipi denetleyicilerini oluşturduktan sonra kullanmak için Görünüm bölümüne geri dönün, Özelleştirici'ye tıklayın ve ardından Tipografi sekmesine tıklayın. Bunu takiben, Tema Tipografisi etiketli seçeneği göreceksiniz - buna tıkladığınızda, istediğiniz yazı tiplerini ve bunun için istediğiniz görünümü seçebilmeniz için Düzenle düğmesini seçerek özel yazı tipi kontrollerinize erişebileceksiniz. kontrol. Bir kez daha, sitenizi güncellemek için Yayınla veya Kaydet düğmesine tıklayarak değişikliklerinizi kaydetmeyi unutmayın.

Hızlı not:

Önereceğimiz diğer bazı harika özel WordPress yazı tipi eklentileri, Özel Yazı Tipi Yükleyici ve Herhangi Bir Yazı Tipi Kullan'dır – ancak aralarından seçim yapabileceğiniz sayısız başka yazı tipi vardır, bu nedenle kullanmak istediğinize karar vermeden önce seçeneklerinizi keşfedin.

Şunlar da hoşunuza gidebilir: En Çok Satan 20 Mikro Niş WordPress Teması.

Son olarak, Temaları Kullanmayı Deneyin

WordPress Tema Şablonu Eğitimi

WordPress web sitenize özel yazı tipi ve tipografi eklemek için bu iki ana yönteme ek olarak, aralarından seçim yapabileceğiniz temalardan da yararlanabilirsiniz. Birçoğu yüklü yazı tiplerinizi özelleştirmenize izin veren yerleşik seçeneklerle gelen çok sayıda tema vardır. Bunu yapma süreci, kullandığınız temaya bağlı olarak değişecektir. Bu nedenle, temanıza uygun kılavuza baktığınızdan emin olun. Yüksek kaliteli, premium WordPress temaları ayrıca, belirli bir temaya özel yazı tipleri eklemek için yönergeler sağlayan çevrimiçi erişim için mevcut dokümanlar sunacaktır.

Görsel ve tasarım öğeleri, onu ziyaret eden herkesin dikkatini çekecek etkili bir web sitesi oluşturmanın tartışmasız en önemli faktörlerinden biridir. Bu alandaki en büyük özelliklerden biri yazı tiplerinin kullanılmasıdır. WordPress web sitenize özel yazı tipleri eklemek için hangi yolu seçerseniz seçin, tüm web sitenizin ve markanızın stili, hedef kitlesi, içeriği, teması ve tonu için en uygun yazı tiplerini bulmalı ve kullanmalısınız.

 Bu makale Beatrice Beard tarafından yazılmıştır. Beatrice, Academic Brits'te etkileyici bir dizi konu ve konu alanında uzmanlaşmış profesyonel bir metin yazarıdır. Beatrice, kişisel deneyimlerini paylaşmaya ve gerçekten satan yüksek kaliteli içerik oluşturmanın tüm zorluklarını ve tuhaflıklarını ortaya çıkaran yeni başlayan yazarlara uzman tavsiyesi vermeye her zaman açıktır.