7 Kasım 2008 Cuma

Kendi Şablonumu Kendim Yaptım (Yazı Dizisi 1)

Bu yazı zaten birçok şeyi yapıp değiştiren kişiler için basit kalabilir. Ancak hiç bilmeyenler için en baştan başlamak gerekiyor. Bir yıldan fazla sürede kendi başıma okuyarak, deneyerek öğrendiğim bilgileri sizlerle paylaşacağım. Meraklı olan kişi bu bilgileri birçok yerde bulup öğrenmiştir zaten. Öncelikle bir miktar ingilizce bilgisi gerektiriyor çünkü kodlar çoğunlukla ingilizce komutlar içeriyor. Ancak ben burda her bir kodu açıklamaya çalışacağım.

Öncelikle web tasarımı temel olarak iki unsurdan oluşmaktadır. Birincisi görsel malzeme, ikincisi de yerleşimi sağlayan tablolar pencereler vs. Blogger bize sadece görsel malzemeyi değiştirmeye izin veriyor. Şablon yapısını da değiştirmek mümkün ama 2 yada 3 kolonlu şablonlar olması dışında ve bunların genişlikleri dışında bir değişiklik yapamıyoruz. Bu yüzden önce kendimize blogger'ın şablonlarından basit bir tanesini seçmekle işe başlayalım (benim değiştirmeye en uygun gördüğüm minima şablondur, genelde 2 ya da 3 kolonlu minima şablon kullanıyorum) Minima şablonun 3 kolonlu olanından google da birçok yerden bulabilirsiniz. Birçok denemeden sonra ben buna karar verdim.

Bir şablonu yeniden oluşturmak için öncelikle kullanmadığınız bir blog sitesi daha açmakta fayda var. Değişiklikleri onda yapıp son haline karar verdikten sonra kendi sitenizi değiştirin. Yani önce kendimizi güvenceye alıyoruz.

Sonra şablon tipimizi belirleyip (2 yada 3 lü) bunun üzerinden değiştirmeye başlayacağız. Kodlarda bazı değişiklikler yaptıktan sonra görsel malzemeleri ekleyeceğiz.

Sitede kullanacağımız görsel malzemeleri kendimiz de oluşturabiliriz ya da internette bir sürü kaynaktan indirebiliriz. Her iki durumda da bir fotoğraf programına ihtiyacımız olacak. Birkaç yazı önce bahzettiğim PhotoScape ve Windows paint ile bu iş kolayca yapılabilir. Temel olarak bize gerekli resimler, bir banner (sitenin en üstündeki resim), bir footer (en alta koymak için bir resim, olmayabilir de), sidebar resimleri ( yandaki gadgetlerin olduğu kısımlara koymak üzere küçük bir resim) , post resimleri (kayıt aralarına koyup yazıları ayırmak için resim) ve tarih ve başlık yanına koymak için resim. Vee yine isteğe bağlı arkaplan için bir resim. Bunların hepsini birden yapmak istemezseniz kimilerini yapıp kimilerini yapmayabilirsiniz.

Fotoğraf programlarını kullanmaya başladığımızda artık bir resmin eni ve boyunun piksel uzunluğu ile tasvir edildiğini, bir pikselin ne kadar uzun olduğunu bilmemiz gerekiyor. Kodlar içinde bu piksel değerleri çok önemli. Diğer bir konu da yükleyeceğimiz resimlerin kapladığı yerin (büyüklüğünün) çok fazla olmaması gerekiyor ki sitenin açılırken yüklenişi yavaşlamasın.

Diğer bir gerekli konu da sitede kullanacağınız resimlerin depolanması olayı. Koda ekleyeceğimiz resimleri bir url adresinden çağırmak durumundayız. Çünkü Blogger bize depolama hakkı vermiyor. Bu yüzden yine birçok seçenek var. ImageShack bunlar içinde en meşhur olanı. Ücretsiz depolama alanı veriyor ve resimlerinizi yükledikten sonra resme tıkladığızda adres çubuğunda yazan adres o resmin linki olacak kodun içersinde.

Şimdi eğer bir blog açıp, basit bir şablon yüklediyseniz, site tasarımınızda kullanacağınız renklere ve resimlere karar verme aşamasındasınızdır. Gönlünüzde yatan stilde resimler arayıp ya da kendiniz yapıp birer banner ve footer oluşturmaya başlayalım. Son zamanlarda gözümüze çok hoş gözükmeye başlayan scrapbooking kartlarını banner ve resim tasarlamada kullanabilirsiniz. Bu tarz resimleri bedava indirmek için birçok site var ancak ben bu siteyi çok beğendim. Birçoğunu da kullandım. Şimdi sizler de kendine uygun resimleri bulun indirin tasarlayın ve oluşturun.

Bir sonraki aşamada kendi başıma nasıl yapıyorsam adım adım bir şablonun değiştirilişini ve yenilenişini anlatacağım.

18 yorum:

  1. Ge-ce cim valla harika olur. Bu konuda bilgisiz biri olarak merakla bekliyorum. Sevgiler

    YanıtlaSil
  2. Benim de bazı şablon tasarımlarım var ve ben de scrapbooking kartlarını kullanmayı tercih ediyorum.Peki acaba bunları kullanıp yayınlamamız yasal mı?Biraz tereddüt ediyorum da...

    YanıtlaSil
  3. İyi ki varsın...

    Bilgilerini böyle paylaşanlara hayranım,eminim hepimizin öğreneceği şeyler olacak bu yazı dizisinde.Bir solukta okudum yazını,teşekkürler...

    YanıtlaSil
  4. sevgili ceren eğer kartlar bedava indirilmeye sunulmuş ise bunları kullanmanda sakınca yok, diğer yandan eğer tasarımcısın adının yazdığı bir resim kullanıyorsan o adını muhafaza edip, bir yere de bu resmi şurdan aldım dersen yeterli olacaktır. Sanatçı kendi resminin beğenilip koyulmasından ve kendisine link verilmesinden memnun olacaktır.

    YanıtlaSil
  5. Sevinmeye devam ediyorum :) da, ben yapabilecek miyim? diye düşünüyorum!! ama yaparsam sayende gercekten bir işi başarmanın sevincini yaşarım... eşsiz bilgilerin için teşekkür etmeyi kendime borç biliyorum...
    Sevgiler

    YanıtlaSil
  6. merak etmeyin herkes kendisi yapabilecek. ikinci yazıyı okuduktan sonra anlayacaksınız. Yalnız bazı kişiler için tüm bunlar yeni ve anlaşılması zor gelebilir. Hep beraber birbirimizle yardımlaşacağız.

    YanıtlaSil
  7. zaten kullandığım resimlerin kenarına isimlerini ekliyorum.içim rahatladı,teşekkür ederim...

    YanıtlaSil
  8. blog yazmaya başlayalı 2 seneden fazla oldu gezmediğim, araştırmadığım şablon-template ıvır zıvır sitesi kalmamıştır sanırım. ne mutlu ki, bir türk bayan çıktı da bu işlere el attı. tebrik ediyorum gececim, ellerine sağlık, anne kazın sitesi de çok hoş olmuş.

    YanıtlaSil
  9. Sevgili Ge-Ce bizleri bilgilendirdiğin için teşekkürler. Konu hakkındaki devam edecek yazılarını merakla bekliyorum, çünkü bende blogu değiştirmek istiyorum. Tam üstüne geldi bu yazı. Anne Kaz'ın bloguna bayıldım, ellerine yüreğine sağlık...

    YanıtlaSil
  10. tek taşımı kendim aldım gibi olmuş :)bende takip ediyorum bi dahaki sefere senin başını da ağrıtmam hem :)

    YanıtlaSil
  11. canım minima 2 kolonlu şablonu kullanıyorum ama yan menü uzadıkça uzadı 3 kolonlu minimayı bulamadım sağ ve sol yanda kolonu olan minima şablonunu nerden bulurum yardımcı olurmusun...teşekkürler

    YanıtlaSil
  12. Merhaba, blog'unu gezdim gercekten guzel konular islenmis tebrik ediyorum. ben yeni kullanici oldugum icin aklima takılan bir konuyu danismak istedim yardimci olursan sevinirim ..

    blogger sablonu olusturma dersleri

    ders1: genel bilgiler ..

    mesela burda genel bilgiler linkine tikladigimizda sayfa yapisi aynen kaliyor ve disari bir sayfa aciyor.. bunu yapmak istiyorum nasil yapabiliceğimi bilmiyorum.. kendi sayfamda bir konuya tiklandiginda ana sayfa yapim degismeden baska bir sayfaya yonlendirme isini nasil yapabilirim. simdiden tesekkurler ..

    YanıtlaSil
  13. gerçekten bizim gibi blog olayına yeni girenler için eşşiz bir çalışma...teşekkürler...yalnız bir sorum olacak ? sadece arkaplanı uygulayamadım ben,arka planım sürekli beyaz hatta kendi basit ayarlarından bile istediğim rengi oluşturamıyorum...Hep beyaz...Bu konuda yardımcı olabilirmisin?
    iyi akşamlar...

    YanıtlaSil
  14. çok teşekkür ediyorum size. ben standart şablonlardan birini seçip kullanıyordum, arada bir de sayfanın yani arka planın ve başlığın rengini değiştiriyordum. yazınızı okuyunca ilk işim yazı genişliği ile oynamak oldu. bu kodlarla oynamaya korkuyordum. artık korkmam...
    ilk fırsat bulduğumda sayfa düzenimi değiştireceğim öğrendiklerimle...
    sevgiler,

    YanıtlaSil
  15. Sevgili Gece,
    Günlerdir aradığım bilgileri çok tesadüfen rastladığım sitende buldum sanırım. Ben de kendi sayfam için bir şablon oluşturmayı çok istiyorum. başarabilecek miyim bilmiyorum ama yazdığın şeyleri ders gibi çalışıp uygulamaya çalışacağım :) Umaırm başarırım. Paylaşımın için çok teşekkürler.

    YanıtlaSil
  16. Blogunuzu yeni keşfettim. bende kendime yeni bir blog açtım. paylaşımlarınızı yavaş yavaş okuyup değişiklerimi yapıcam. çok teşekkürler :)

    YanıtlaSil
  17. sevgili gece merhabalar öncelikle..bu şablonla filan uğraşmak gerçekten ayrı bir mesai gerektiriyor hakkaten çok zor iş yani bilmediğim için ben öyle düşünüyorda olabilirim..benim blogum bir hobi blogu ve bunu yansıtmasını istediğim bir şablon arayışı içindeyim..kolonlar vs.çok da önemli değil benimiçin..senin bir önerin var mı bunun için..ve çekinerek şablonu nasıl değiştireceğimide sorsam çok mu olurum (yani herhangi bir şablonu indirdik mesela)..şimdiden çok teşekkür ederim arkadaşım..

    YanıtlaSil
  18. bu konuya ilgim var aşamaları takip edip bişiler deneyeceğim.oldukça detaylı anlatmışsın.teşekkür etmeden geçemedim ;)

    YanıtlaSil