Blog tasarımı için Blogger'daki özel yazı tipleri. Blogspot, Blogger'da güzel kaligrafi yazı tipi

İyi günler sevgili okuyucular. Bugün web sitenize standart olmayan bir Kiril yazı tipi yüklemenin yollarından birinden bahsetmek istiyorum. Bu method Blogger'daki bloglar dahil her site için uygundur. Bu yöntem birçok İngilizce web sitesinde başarıyla kullanılmaktadır ve premium WordPress ve Joomla temalarında aktif olarak kullanılmaktadır.

Çünkü Okuyucularımın çoğu Blogger ve WordPress'te blog yazıyor, size bu tür bloglara nasıl özel yazı tipi yükleneceğini anlatacağım. Üstelik Blogger için açıklanan yöntem kesinlikle her site için uygundur. Ve WordPress için hazır bir eklenti var. Ancak makaleyi ilgili açıklamalara kaydırmanızı önermiyorum çünkü... Eklentiyi yapılandırmak için bu yöntemle ilgili tüm bilgilere ihtiyacınız olacak.

düşünüyorum şu an Bu, öncelikle kurulum kolaylığı ve ikinci olarak farklı tarayıcılardaki desteği nedeniyle standart olmayan bir Kiril yazı tipini bir web sitesine yüklemenin en popüler yollarından biridir.

Henüz yeterince ilginizi çekmedim mi? Ayrıntılara geçmenin zamanı geldi.

Dolayısıyla bu yönteme Cufon adı veriliyor. Tek bir geliştirici olan Simo Kinnunen tarafından icat edildi. Öncelikle siteye bağlanması gereken özel bir dosya oluşturdu. İkinci olarak, herhangi bir yazı tipini JavaScript'e dönüştüren bir oluşturucu yarattı.

Yöntemin kendisi inanılmaz derecede basittir ve bunu daha sonra göreceksiniz. Buradaki en zor şey tam olarak gerekli yazı tipini bulmaktır. Ve eminim aktif kullanıcı olmayan çoğunuz grafik editörleriörneğin PhotoShop, jeneratöre hangi yazı tipinin yüklenmesi gerektiği ve böyle bir yazı tipinin nereden alınacağı hakkında hiçbir fikirleri yok. Bu konuyu daha detaylı konuşmaya karar verdim.

Herhangi bir bilgisayarda, Word ve diğer programlar da dahil olmak üzere belirli bir yazı tipi setinin yüklü olduğu bir sır değildir. Ayrıca herhangi bir program da dahil olmak üzere bilgisayarımıza bağımsız olarak yeni yazı tipleri yükleyebiliriz. Bunu yapmak için ifadeyi herhangi bir arama motoruna yazmamız yeterlidir. Kiril yazı tiplerini indir ve bulduğumuz yazı tiplerinin .ttf formatında olduğundan emin olun.

Beğendiğiniz fontu .ttf formatında indirdikten sonra sadece açarak bilgisayarınıza kurabilirsiniz.

Veya Install komutunu seçmek için farenin sağ tuşunu kullanın. Bu işlemden sonra yazı tipi, genellikle sağlandığı bilgisayarda yüklü tüm programlarda görüntülenecektir. Onlar. başka bir işlem yapılmasına gerek yoktur. Açıklanan yöntemin Windows 7'de çalışması garanti edilir.

Kesinlikle herhangi bir Kiril yazı tipini bir web sitesine üç adımda yükleme

Böylece, standart dışı güzel bir Kiril yazı tipinin sahibi olduk ve onu web sitemize yüklemek istiyoruz. Eylemlerimiz neler?

Aşama 1

Cufon web sitesine gidiyoruz - cufon.shoqulate.com.
Menüdeki bağlantıya tıklayın – İndir. Komut dosyası içeren bir sayfa açılır. Kodun tamamını kopyalayıp not defterine yapıştırmanız ve .js uzantısıyla kaydetmeniz yeterli. Okuyucularım için hazır bir dosya hazırladım, bilgisayarınıza indirebilirsiniz.

Dikkatli olun, bu yazının yazıldığı 26 Temmuz 2011 tarihi itibariyle script sürümü 1.09i'dir. Bu, yukarıdaki bağlantıdaki sürümdür.

Scripti hostinge yükleyin. Blogunu Blogger'da çalıştıran herkes üçüncü taraf dosyasını nereye yükleyeceğini zaten bilmelidir (), bunun için Google sitelerini kullanıyorum.

Adım 2

Cufon web sitesine Jeneratör sekmesine dönüyoruz. İşte birçok ayarın bulunduğu bir sayfa. Dürüst olmak gerekirse, kesinlikle tüm ayarlara girmedim, ancak deneyler sırasında farklı ayarları denedim ve her zaman istenen sonucu aldım.

Ancak her durumda, dikkatinizi önemli noktalara çekmek için ana ayarların bulunduğu birkaç ekran görüntüsü hazırladım.

Gördüğünüz gibi her yazı tipi türü için ayrı bir yükleme penceresi vardır:

• normal yazı tipi
• kalın yazı tipi
• normal italik
• Kalın italik

Bunun neden böyle olduğunu tam olarak anlamadım, ancak tam olarak açıklamanın yazı tipimi en iyi tanımladığı yere yükledim.

Örneğin, ekran görüntüsü yüklemeyi gösteriyor el yazısı yazı tipi. Eğimli ve oldukça iyi besleniyor :).

Daha sonra lisans sözleşmesinin bulunduğu alan vurgulanır. Kutuyu işaretlemeniz ve böylece indirdiğiniz yazı tipinin, bu yazı tipinin geliştiricisi tarafından web'de kullanılmasına izin verildiğini onaylamanız gerekir. Bu hassas bir soru, ne yazık ki internetteki çok çeşitli farklı yazı tipleri arasında hangi yazı tipini kullanıp hangisini kullanamayacağımızı tam olarak bilmiyoruz. Dolayısıyla bu nokta tamamen sizin vicdanınıza kalmıştır.

Sonraki ekran görüntüsü.

İlk alanda büyük ve küçük harflerin yanı sıra sayıları ve noktalama işaretlerini de görüntülememiz gerektiğini belirtiyoruz.

İkinci alanın varsayılan olarak bir onay işareti vardır, onu kaldırmayı denemedim.

Üçüncü alanda Kiril ve Rus alfabesini seçtiğinizden emin olun.

Bir satırı mavi renkle vurguladım; WordPress için yazı tipini oluşturanların kutuyu işaretlediği yer burasıdır.
Ve son ayarlar.

İlk pencerede hiçbir şey yazmadım ancak alanın, yazı tipinin kullanılacağı alanları belirttikten sonra diğer alanlarda çalışmaması açısından yararlı olduğunu düşünüyorum.

Anladığım kadarıyla üst alanda Hakkında konuşuyoruz hangi yazı tipi boyutunun varsayılan olacağı hakkında. Ayarı kabul edebilir veya kutuyu işaretleyerek reddedebilirsiniz. Şahsen ben farklı şekillerde denedim ve her iki seçenekten de memnun kaldım. Bunun hem yazı tipinin kendisine hem de şablon tasarımcısının fikrine de bağlı olduğunu düşünüyorum. Jeneratörün kendisi, küçük bir yazı tipi boyutu kullanmanız koşuluyla, pencere 2'deki bir sonraki öğenin devre dışı bırakılmasını önerir. Mümkünse son kutuyu işaretlemeniz daha iyi olur, çünkü... Bu ayar sayesinde oluşturulan dosya daha küçüktür ve bu da şüphesiz yazı tipi yüklemesinde daha iyi bir etkiye sahip olacaktır.

Ve son şey, jeneratörün kullanım şartlarıyla ilgili bir anlaşmadır.

Sonuç olarak, barındırma sistemine de yüklediğimiz başka bir dosya alıyoruz.

Aşama 3

Geriye kalan tek şey site şablonu dosyalarında kapanış etiketinden önce aşağıdaki kodu belirtmektir:

Cufon.replace("h1");

Koddan da görebileceğiniz gibi fontu h1 başlık etiketine uyguluyoruz. Bu şekilde, Kiril yazı tipimizin görüntülenmesi için başka herhangi bir etiketi belirtebilirsiniz.

Cufon.replace("h1");
Cufon.replace("h2");
Cufon.replace("p");

Ayrıca bir etiket değil, bir tanımlayıcı da belirtebilirsiniz:

Cufon.replace("#mycufon");

Ama hepsi bu değil. Bir sitede aynı anda birkaç farklı yazı tipi kullanmak istiyorsanız, tüm yeni yazı tipleri için İkinci Adım'ı geçip hepsini belirtiriz:

Cufon.replace("h1";, ( fontFamily: "font_name_1"; ));
Cufon.replace("h2";, ( fontFamily: "font_name_2"; ));

Yazı tipinizin doğru yazılışından emin değilseniz, 2. adımdan itibaren ilgili oluşturulan dosyayı açın ve ihtiyacınız olan bilgiyi bulun.

Maviyle vurgulanan yazı tipinin adıdır.
Test bloglarımdan birinde başlangıçta durum böyleydi.

Ve şu şekilde oldu:

WordPress'e özel bir Kiril yazı tipi nasıl yüklenir

WordPress kullanıcıları için hala çok daha kolay. Elbette anlatılanların tamamını uygulayabilirsiniz ve yazı tipi de çalışacaktır, ancak All-in-One Cufon adında hazır bir eklenti de vardır. Eklentiyi geliştiricinin web sitesinden veya doğrudan blog yönetici alanından indirebilirsiniz.

Eklentiyi yükleyin. Etkinleştirelim. Eklenti ayarlarına geçelim. En üstte iki uyarı mesajı var.

İlk yapmanız gereken wp-content/plugins/ dizininde bir cufon-fonts klasörü oluşturmanızdır. Bunu yapmak için FTP üzerinden bağlanın veya barındırma kontrol paneline gidin ve eklentiler klasöründe cufon-fonts adında yeni bir klasör oluşturun. Bundan sonra ilk mesaj kaybolur.

İkinci mesaj, oluşturulan yazı tipi dosyasını, 2. Adımda aldığımız dosyanın aynısı olan oluşturulan klasöre yerleştirmeniz gerektiğini söylüyor. Dosyayı yüklüyoruz ve mesaj kayboluyor, eklentinin artık "gördüğü" yazı tipi ise ayarlarda görünüyor altında.

Şablonda kullanacağınız yazı tipinin yanındaki kutucuğu işaretlemeyi unutmayın. Ancak yazı tipi henüz çalışmıyor. Aşağıda Kiril yazı tipimizin hangi etikete uygulanması gerektiğini belirtmemiz gereken Cufon Kodu alanı bulunmaktadır. Bu durumda, başka bir tanımlama olmadan çıplak kodu belirtmeniz gerekir.

Cufon.replace("h1");

Bu arada, eğer yüklediyseniz şunu söylemeye değer: WordPress teması standart olmayan bir yazı tipine sahipse ve Kiril yazısı yoksa, ihtiyacınız olan:

Hepsi Bir Arada Cufon eklentisini yükleyin.

Oluşturulan yazı tipini yükleyin.

Aşağıdaki alana Cufon Kodunu girmenize gerek yoktur, kural olarak bu kod şablonda zaten yazılıdır. Mevcut yazı tipine ek olarak başka bir yazı tipi yüklemek istiyorsanız yukarıdaki örneklerde yazdığım gibi böyle bir giriş yapmanız gerekecektir.

Çok önemli bir not.
Şablondaki başlıkları makalelerime göre optimize ettiyseniz son derece dikkatli olmalısınız. Hatırlarsanız ana sayfa dışındaki tüm sayfalarda blog başlığı etiketinin içinde yer alıyor. (bağlantıda). Tam olarak bu etikete bir kimlik veya sınıf atamanız gerekir, örneğin:

>. Ancak her şey dikkatli yapılırsa hiçbir felaket yaşanmaz.

Bir kod satırı farklı şablonlarda farklı görünebilir. Şablonunuzda nasıl yapılacağını açıklığa kavuşturmak için makaleyi okuyun. Herhangi bir kod satırını nasıl bulacağınıza dair ayrıntılı bir video var, ardından web sitenizin şablonunda neredeyse her türlü değişikliği yapabilirsiniz. Bu beceri sizi kodları karıştırma ihtiyacından kurtaracak ve size serbestlik tanıyacaktır.

Bunu kendiniz çözemiyorsanız ve kodları anlayan iyi bir serbest çalışan bulmak istiyorsanız, o zaman makalede yararlı bağlantı bir şey olursa nereye gideceğiz.

Site başlığındaki yazı tipini değiştirme talimatları

Ve eğer çözecek vaktiniz yoksa ama daha hızlı yapmak istiyorsanız, her şey için web sitemize ve kelime programına (yazı tipini seçmek için) ihtiyacımız olacak.

Sitenizin admin paneline giriş yapın. Daha sonra sol kenar çubuğunda Konsolu buluyoruz - Dış görünüş— Editör.

Sağ tarafta Stil Listesini (style.css) bulup açıyoruz.

Sitenin başlığı h1 başlığıdır. Başlangıca yakın bir yerde bulunur. Gözlerinizle arama yapmaktan kaçınmak için Ctrl+F tuşlarına basabilirsiniz; bir arama çubuğu görünecektir. Arama yazın. Benim için bu kısım şöyle görünüyor:

Üst kare: yazı tipi değiştirme çizgisi.

Alt kare: yazı tipi boyutunu değiştirme satırı.

Daha sonra gerekirse yazı tipi boyutunu ve rengini değiştireceğiz.

Site başlığı yazı tipi nasıl değiştirilir?

Şimdi temiz olanı aç Word belgesi, kopyala ana sayfa site adını seçin ve bir Word belgesine aktarın, seçin ve farklı yazı tipleriyle oynamaya başlayın. Bulundukları yer üst panel Sol köşede. Bunu bu programda yapmak neden uygun çünkü başlığınızdaki tüm yazı tipi değişiklikleri anında görülebiliyor. Sitenizin adıyla eşleşecek bir yazı tipi seçin. Kesinlikle beğeneceğiniz bir yazı tipi. Seçildikten sonra yazı tipi adını Worde'e kopyalayın.

Sitenin yönetici paneline dönüyoruz. Yazı tipini değiştirme satırına (şekilde - üstteki mavi kare), varsayılan yazı tipi yerine seçilen yazı tipinin adını giriyoruz.

Sayfanın alt kısmındaki “Dosyayı Güncelle” seçeneğine tıklayın.

Siteye gidelim ve yazı tipinin genel bağlama uyup uymadığını görelim. Değilse, Word'e geri dönün ve başka bir tane seçin. Tüm.

Site başlığı yazı tipi boyutu nasıl değiştirilir?

Bu aynı editör şablonunda yapılır. Yukarıdaki resimde ikinci bir mavi kare var. Burada yapmanız gereken tek şey farklı sayılar koymaktır; ihtiyacınıza bağlı olarak yazı tipi büyüyecek veya küçülecektir. Değişiklikleri kaydediyoruz, siteye gidiyoruz ve her şeyin bize uygun olup olmadığına bakıyoruz.

Site başlığının yazı tipi rengi nasıl değiştirilir?

Bu orada yapılıyor. Bir sonraki blokta yazı tipinin kendisini ve boyutunu değiştirdiğimiz yerden sonra bir satır var. Şunun gibi bir şeye benziyor:

Bir renk seçmek için tema seçeneklerinden birini kullanabilirsiniz: Konsol - Görünüm - Arka Plan. “Arka Plan Rengi” satırında bir renk seçip alfanümerik değerini kopyalayıp eskisi yerine yapıştırabilirsiniz (benim durumumda #11006a). Değişiklikleri Kaydet. Hadi siteye gidelim ve hayran olalım.

Yani yazı tipini, rengini ve boyutunu değiştirmek için düzenleyicinin sadece 3 satırında değişiklik yapmanız gerekiyor. Az beceriyle çok az zaman alır.

Güzel, okunması kolay başlık

Konunun genel ruhuna uygun,

blogunuzu daha çekici ve akılda kalıcı hale getirecek.

Deney yapın, neyi beğendiğinizi seçin!

Not: Tema düzenleyici dosyalarında küçük değişiklikler bile yaptığımda, her ihtimale karşı, değiştirilen metnin tamamını Not Defteri'ne, sitemde yüklü olan temanın zip dosyasının saklandığı klasöre kopyalarım. Sitenin aniden çökmesi ve temayı yeniden yükleme ihtiyacının ortaya çıkması durumunda, tüm dosyaları kendi zevkime göre değiştirilerek kaydettim. Geriye kalan tek şey, WordPress'i veya temayı yeniden yüklerken dosyaları barındırmadaki uygun klasörlere aktarmaktır.

Aşağıdaki makalelerde, blogumu dönüştürürken, arka plan rengini, kategorilerdeki başlık yazı tiplerini, makaleleri, bağlantıların rengini - tek kelimeyle, herhangi bir öğeyi de aynı kolaylıkla değiştireceğiz