Haftanın Blogu:Online Gitar Dersi

Son zamanlarda bir sürü müzik blogu açıldı.Bunların çoğunda müzik haberleri ve (yasal olmasa da) indirebilir müzik blogları.Müzik bloglarının %1'lik küçük bir kısmıda tanıtacağım haftanın blogunun yaptığını yapıyor:Online ve Ücretsiz Enstruman Eğitimi.Online Enstruman Eğitim Blogları henüz ülkemizde gelişmiş sayılmaz.Yurtdışına bakarsanız, normal kurslardan çok, online eğitim blogları bulursunuz.Türkiye'de de ücretsiz ve online gitar eğitimi veren bir blog var.Online Gitar Dersi'nde gitar eğitimindeki seviyelerinize göre dersler mevcut.Yani; yeni başlayanlar içinde, uzmanlar içinde dersler var.Bu blogta gitar çalan biri için her şey düşünülmüş.Gitar eğitiminin yanında menüden ulaşabileceğiniz ses eğitimi ve ders videoları mevcut.Aynı zamanda blog sahibiyle her an etkileşim içindesiniz.Blog sahibinin sosyal paylaşım sitelerindeki profilinden onunla iletişime geçebilir veya blogtaki derslerin altında bulunan "yorum yaz"dan ona soru ve görüşlerinizi iletebilirsiniz.Kısacası, Online Gitar Dersi . Blogcu Türkiye'de ücretsiz gitar öğrenmek isteyenlerin ve ya kendini geliştirmeye çalışanların mutlaka ziyaret etmesi gereken bir blog.Tebrikler haftanın blogu!

Bloga ulaşmak için:onlinegitardersi.blogcu.com

Blogger "Etiketler" Widgetini Yeniden Düzenledi

Blogger ekibi tarafından "Etiketler" widgeti düzenlenmiş ve daha kullanışlı hale getirilmiş. Bence güzel de olmuş. Blogger'da olmasını istediğim onlarca özellikten birisiydi bu. Bu sayede blogger'ımız wordpress'e daha da yakınlaşmış oluyor. Bu düzenlemeyi friendfeed'de Teknomobi sayesinde öğrendim, sanırım ülkemizde bu konu hakkında birşeyler yazan ilk blogculardan birisi Teknomobi. Beni de bilgilendirdiği için teşekkür ediyorum. Şimdi düzenlemelerden biraz bahsedeyim.

Öncelikle söyleyeyim, ben de bu hataya düştüm, widget ekle dedikten sonra yeni bir widget aramayın, düzenlemeler bizim bildiğimiz etiketler widgeti üzerinde yapılmış.

Sayfa ögelerine giriyoruz, eklemek istediğimiz yerdeki "Gadget Ekle" seçeneğine tıklıyoruz.

Açılan sayfada "Etiketler" linkine tıklıyoruz. Bundan sonra etiketler widgetimiz ile ilgili özellikler çıkıyor karşımıza. İşte Google voleyi burada vurmuş.

"Seçilen Etiketler" seçeneğinden anlayacağımız gibi, widget üzerinde sadece istediğimiz etiketlerin görüntülenmesini sağlayabiliyoruz artık. Seçilen Etiketler linkine tıkladığımızda hemen altında "düzenle" diye bir link çıkıyor. Bu linkten istediğimiz etiketleri işaretliyoruz. İstemediklerimizi almıyoruz. Daha sonra yeni gelen bir özellik olarak "Liste" veya "Bulut" seçenekleri mevcut. Yani artık etiket bulutu oluşturabilmek için bir sürü javascript koduna ihtiyacımız yok.

Bence hala etiket sisteminde arıza var. Aklıma gelen birkaç eksiği sıralayayım hemen:
1) Etiketler http://blogadresi/etiket/etiketismi/ gibi bir sayfada açılabilir.
2) Etiketlerin olduğu /search sayfasının bloglarımızın robots.txt dosyasında arama motorlarına alınması engellenmiş.
Ama yine de güzel bir adım. Bu düzenleme için Google'a teşekkür ediyorum.
İlgili Haber.

Yazı Sonuna Eklenen Resimlerden Kaynaklanan Sorun

Sevgili blogger ahalisi, bu yazıda az önce tasarım yaparken karşıma çıkan bir dandiklikten ve bunun için uyguladığım çözümden bahsedeceğim. Bu sorun şu, eğer bir yazının sonuna sağa veya sola dayalı bir resim eklerseniz, o resim blogunuzun yazıdan sonraki kısmının tasarımına zarar veriyor. Yani o yazı görüntülenirken sayfanızda türlü türlü tasarım sorunları oluşuyor. Aslında çok basit olan olay şundan ibaret, biz bir resimi yazımıza yüklediğimizde o resime sağa veya sola dayalı olarak bir ayar veriyorsak, bu ayar yazının o resimin yan tarafından akmasını istemiş olmamız anlamına geliyor. Örneğin resimi sola yasladığımızda yazılar resimin sağından akarlar. Ancak resimi yazının sonuna eklediysek, yani resimden sonra yazı yoksa, yada çok az yazı varsa, o resim sağına blogdaki diğer elemanları da alıyor. Bu durumda da aslında yazının altında olması gereken elemanlar yazının içindeymiş gibi bir görüntü sergiliyorlar. Bir resim ile açıklayacak olursak:

Gördüğünüz gibi şirin kedimizin olduğu resim sayfada yazının altında bulunması gereken turuncu kısım ile sarı kısımı kendi sağına almış.

Peki bunu nasıl düzeltebiliriz? Bunu şablonumuza yapacağımız çok kısa bir ilaveyle düzeltebiliyoruz. Yapmamız gereken blogger kontrol panelinde, Yerleşim sayfasında HTML'yi Düzenle'ye girip widget şablonlarını genişlettikten sonra şu kodu bulup:
<data:post.body/>
Altına şu kodu yerleştirmek:
<div style='clear: both;'/>
Ve şablonunuzu kaydetmek. Bir resim de bu basit işlemi yaptıktan sonrası için ekleyeyim de farkı göstermiş olayım.

Umarım anlatmak istediğimi verebilmişimdir. İyi günler dilerim :)

Son Yazılar ve Son Yorumlar Eklentileri

Olayı hiç javascript dosyalarınızı hostunuza yükleyin olaylarına girmeden anlatacağım. Çünkü blogger kullanıcılarının büyük bir çoğunluğu javascript dosyalarını yükleyebilecekleri host bulmakta zorlanıyorlar.

Blogger Son Yazılar
İlk anlatacağım şey son yazılar widgetini blogunuza eklemek. Bunun için blogunuzun "Sayfa Ögeleri" kısmında yeni widget olarak "HTML/Javascript" widgetini seçmeniz, ve onun içerisine alttaki kodu kopyalamanız yeterli.

<script style="text/javascript">
function showrecentposts(json) {
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
posttitle = posttitle.link(posturl);
var readmorelink = "(more)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdyear = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdday = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "Jun";
monthnames[7] = "Jul";
monthnames[8] = "Aug";
monthnames[9] = "Sep";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
var re = /<\S[^>]*>/g; 
postcontent = postcontent.replace(re, "");
if (!standardstyling) document.write('<div class="bbrecpost">');
if (standardstyling) document.write('<br/>');
document.write(posttitle);
document.write('<br/>');
if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
if (!standardstyling) document.write('</div><div class="bbrecpostsum">');
if (showpostsummary == true) {
if (standardstyling) document.write('<br/>');
if (postcontent.length < numchars) {
if (standardstyling) document.write('<i>');
document.write(postcontent);
if (standardstyling) document.write('</i>');}
else {
if (standardstyling) document.write('<i>');
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent + '...' + readmorelink);
if (standardstyling) document.write('</i>');}
}
if (!standardstyling) document.write('</div>');
}
}

var numposts = 10;
var showpostdate = false;
var showpostsummary = false;
var numchars = 250;
var standardstyling = false;
</script>
<script src="http://www.siteadresiniz.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script>

Kodun içerisinde kırmızı yazdığım yerleri düzenleyebilirsiniz kendinize göre. Nasıl mı? Şu şekilde:

var numposts = 10;
Yukarıdaki değişkenin karşısındaki sayı son yazılar widgetinizde kaç tane yazının gösterileceğini belirtiyor. Bu sayıyı arttırabilir veya azaltabilirsiniz.

var showpostdate = false;
Burada ise true veya false kullanarak değişkenimizi değiştiriyoruz. Son yazılar widgetinde yazıların yazılma tarihlerinin görüntülenmesini istiyorsanız true, istemiyorsanız false olarak ayarlıyorsunuz.

var showpostsummary = false;
Yukarıdaki değişken ise yazının belirli bir kısmının gösterilip gösterilmeyeceğini belirtiyor. true olarak değiştirirseniz yazının başlığının altında yazıdan belirli bir kesit sunacaktır. Eğer false olarak bırakırsanız yazılarınızın sadece başlıklarını gösterecektir.

var numchars = 250;
Eğer yazınızın içeriğinden belirli bir kesit sunmayı bir önceki adımda kabul ettiyseniz, buradaki değişken yardımıyla yazınızdan kaç karakterlik bir içerik sunacağınızı belirtmelisiniz. Burada varsayılan olarak 250 karakter belirtilmiş. Yine seçim size ait :)

Ve ayrıca kırmızı ile işaretlediğim www.siteadresiniz.com kısmını kendi blog adresiniz ile değiştirin.

Blogger Son Yorumlar
Şimdi sıra geldi son yorumlar widgetine. Bunun için de blogunuzun "Sayfa Ögeleri" kısmında Yeni widget oluşturun ve "HTML/Javascript" ögesini seçin. Daha sonra içine aşağıda yazdığım kodu yapıştırın.

<script style="text/javascript">
function showrecentcomments(json) {
  for (var i = 0; i < numcomments; i++) {
    var entry = json.feed.entry[i];
    var alturl;

    if (i == json.feed.entry.length) break;
    for (var k = 0; k < entry.link.length; k++) {
      if (entry.link[k].rel == 'alternate') {
        alturl = entry.link[k].href;
        break;
      }
    }
   alturl = alturl.replace("#", "#comment-");
   var postlink = alturl.split("#");
   postlink = postlink[0];
   var linktext = postlink.split("/");
   linktext = linktext[5];
   linktext = linktext.split(".html");
   linktext = linktext[0];
   var posttitle = linktext.replace(/-/g," ");
   posttitle = posttitle.link(postlink);
   if ("content" in entry) {
     var comment = entry.content.$t;}
   else
   if ("summary" in entry) {
     var comment = entry.summary.$t;}
   else var comment = "";
   var re = /<\S[^>]*>/g; 
   comment = comment.replace(re, "");
   if (!standardstyling) document.write('<div class="bbrecpost">');

   document.write('<a href="' + alturl + '"><b><font color="#FF0000" style="font-size: 9pt">' + entry.author[0].name.$t + '</font></b> ; ');
   if (!standardstyling) document.write('</div><div class="bbrecpostsum">');
   if (comment.length < numchars) {
         if (standardstyling) document.write('');
         document.write('<i><font style="font-size: 9pt"> ' + comment + '</font></i><br>');
         if (standardstyling) document.write('');}
   else
        { 
         if (standardstyling) document.write('');
         comment = comment.substring(0, numchars);
         var quoteEnd = comment.lastIndexOf(" ");
         comment = comment.substring(0, quoteEnd);
         document.write('<i><font style="font-size: 9pt">' + comment + ' ...)</font></i><br>');
         if (standardstyling) document.write('</a>');}
   if (!standardstyling) document.write('</div>');
   if (standardstyling) document.write('');
  }
if (!standardstyling) document.write('<div class="bbwidgetfooter">');
if (standardstyling) document.write('');
document.write();
if (!standardstyling) document.write('</div>');}
var numcomments = 10;
var numchars = 20;
var standardstyling = true;
</script>
<script src="http://www.siteadresiniz.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

Tabi, bu kodda da yapabileceğiniz birkaç ufak düzenleme var, mesela aşağıdakiler gibi. Aşağıdaki kodları yukarıda kırmızı renk ile belirttim.

var numcomments = 10;
Bu değişkenin karşısındaki sayıyı değiştirdiğimizde son yorumlar widgetimizde kaç tane yorum gösterileceğini belirlemiş oluyoruz.

var numchars = 20;
Bu değişkenin karşısındaki sayıyı değiştirdiğimizde ise her bir yorumdan kaç tane karakterin gösterileceğini belirlemiş oluyoruz.

Ve ayrıca kırmızı ile işaretlediğim www.siteadresiniz.com kısmını kendi blog adresiniz ile değiştirin.

Evet millet, javascript kodlarını widgetimizin içerisine kopyalıyoruz ki böylece bu javascript kodları için bir adet host bulmamıza gerek kalmıyor. Böyle daha rahat değil mi sizce?


Ve böylece eskiden Yasin abimin yazdığı şu yazıdaki butonların çalışmama sorununa da bir çare bulmuş olduk. Sorun şuydu; butonların bağlı olduğu linkteki site artık yoktu :)

11 ayın sultanı Ramazan ayına girmiş bulunuyoruz, bu yazıyı da ilk sene ilk sahurumu beklerken yazıyorum. Gece gece bilgisayar ekranına bön bön bakmaktan iyidir değil mi birşeyler paylaşmak? Neyse, uykusuzken yazdığım bu yazıda hatalarım olduysa affola, hepinize hayırlı ramazanlar dilerim, oruç tutanların oruçlarını Allah kabul etsin :)

Blogger'a Şablon/Tema Yüklemek

Şu sıralar bana gelen soruların büyük bir kısmı "şablon yükleyemiyorum" konusu üzerine. Bu yüzden bu konuyu anlatma ihtiyacı duydum.

İlk olarak birbirinden güzel temaların bulunduğu http://btemplates.com/ sitesini kullanmayı göstereceğim sizlere. Size tavsiyem basit, sade temaları kullanın, hareketli cafcaflı temalardan uzak durun. Çünkü tema ne kadar karmaşık olursa içerisinde o kadar javascript dosyası olur ve o dosyaları da hostunuza yüklemeniz, daha sonra da şablonda yerleştirmeniz gerekir. Uyarıyı da verdikten sonra şimdi anlatıma geçelim.

İlk olarak http://btemplates.com/ sitesine giriyorsunuz. Sağda "Categories" başlığı altında birçok tema kategorisi görebilirsiniz. Onlardan birisine tıkladığınızda karşınıza yine ana sayfadaki gibi birçok tema çıkacaktır. Şimdi o temalardan sade olarak gördüğünüz herhangi birisine tıklayın. Daha sonra açılan sayfada "Download" ve "Live Demo" şeklinde iki tane buton görürsünüz. Bunlardan "Download" butonuna tıklayarak şablonunuzu bilgisayarınıza indirebilirsiniz. "Live Demo" ise o şablonun yüklü olduğu bir blog açar size ve şablonu canlı canlı inceleme imkanı sunar. Neyse uzatmadan, "Download" butonuna basın ve şablonu masaüstünüze indirin.

Şimdi masaüstünüze inmiş olan dosyayı inceleyelim. O bir sıkıştırılmış dosyadır ve onu açmadan şablon olarak blogunuza yükleyemezsiniz. Bu dosyaya sağ tıklayıp "klasöre çıkart ...\" şeklindeki winrar komutunu seçiyoruz. Örnek olsun diye ben "Nourish" isminde bir tema indirdim masaüstüne onu gösteriyorum resimlerde:

Bu işlemi yaptıktan sonra masaüstünüzde yeni bir klasör oluşacak, klasörün ismi indirdiğiniz zipli dosyanızın ismiyle aynı olacak şekilde. O klasörün içine göz gezdirecek olursanız, bir tane "XML Belgesi" bulursunuz.

Şimdi bu dosyayı Blogger'a yüklemek kaldı geriye. Şu yolu takip edin:
Blogger yönetim panelinde Yerleşim -> HTML'yi Düzenle sayfasına giriyorsunuz.
Orada "Dosya Seç" butonuna tıklıyorsunuz. Masaüstünüzde zipi açtıktan sonra oluşan klasörün içindeki xml dosyasını  seçiyorsunuz ve "Aç" butonuna basıyorsunuz. Daha sonra da "Dosya Seç" butonunun yanındaki "Yükle" butonuna basıyorsunuz.
"Lütfen aşağıdaki widget’ların silinmesi gerektiğini doğrulayın. Tüm widget’ların yapılandırma verileri kaybolacak."
şeklinde bir uyarı alırsanız "Onayla ve Kaydet" butonuna basın ve yolunuza devam edin. Şablonunuzda bir hata yoksa yüklenecektir.

Not: Bilgisayarınıza indirdiğiniz sıkıştırılmış dosyayı açabilmek için Winrar programına ihtiyacınız olacaktır. Winrar programını indirmek için aşağıdaki linke tıklayın:
http://www.rarlab.com/rar/wrar380tr.exe

Otomatik Yazının Devamını Oku Bağlantısı

Güncelleme: Blogger'ın devamını oku özelliğini resmen devreye sokmasıyla bu tür kod ekleme işlemlerine artık gerek kalmadı. Güncel yazı için:
http://www.bloggerdestek.com/2009/10/blogger-devamini-oku-ozelligi.html

Eski "devamını oku" eklentisinin sayfasını düzenleyip kaydettiğimde besleme okuyucular bunu yeni yazılmış bir yazı kabul edmiş, bağlı olduğum sosyal ağlarda da bu yazı yeni bir yazıymış gibi yayınlanmıştı. Otomatik Devamını Oku daha iyi gibi bir de yorum alınca bu eklentinin de bloggerdestek sayfalarında bulunması gereklidir diye düşündüm.

Evet eklentiyi tanıtmak gerekirse, sizin belirlediğiniz karakter sayısından sonra yazıyı bölüyor ve devamını oku iletisi koyuyor. Ayrıca yazıya eklediğiniz ilk resimi de sizin istediğiniz boyutlara getirip sola yaslıyor ve onu da ana sayfada o şekilde görüyorsunuz.

Şimdi nasıl yapıldığına geçelim. Uzun uzadıya anlatılması gereken birşey değil. Ama biraz uzatacağım olası sorunları önlemek için.

İlk olarak blogunuzda Yerleşim kısmındaki "HTML Düzenle" sayfasında "Widget Şablonlarını Genişlet" seçeneğini işaretliyorsunuz. Daha sonra ctrl+f yardımıyla şablonda arama yaparak şu kodu buluyorsunuz: <data:post.body/>

Daha sonra bulduğunuz o kodu siliyorsunuz, yerine aşağıdaki kodu yapıştırıyorsunuz.

<script type='text/javascript'>
summary_noimg = 350;
summary_img = 250;
img_thumb_height = 80;
img_thumb_width = 80;
</script>
<script src='http://klod82.googlepages.com/summary-post.js' type='text/javascript'/>
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:right'>
<a expr:href='data:post.url'>Devamını Oku</a>
</span>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
</b:if>

Eklediniz mi? Şimdi birkaç ufak ayar yaparak bu eklentiyi kendinize göre kişiselleştiriyorsunuz. Yukarıdaki kodun en üstlerinde bulunan şu satırlarda istediğiniz düzenlemeleri yapıverin:
summary_noimg = 350; --> Resim olmadığı zaman yazının 350 karakteri gösterilir.
summary_img = 250; --> Resim olduğu zaman yazının 250 karakteri gösterilir.
img_thumb_height = 80; --> Resimin yüksekliği 80px olarak ayarlı.
img_thumb_width = 80; --> Resimin genişliği 80px olarak ayarlı.

Düzenleme:Ve ayrıca şunu düzenlemenizde fayda var; kodun 7. satırında bulunan script kodunun içerisindeki javascript dosyasını kendi bilgisayarınıza indirip kendi hostunuza kurmalı ve koddaki linki değiştirmelisiniz. Yani oradaki
http://klod82.googlepages.com/summary-post.js
linkinin yerine kendi hostunuza yüklediğiniz js dosyasının linkini yazmalısınız.

Bu satırlardaki sayıları da düzenlediyseniz şablonunuzu kaydedebilirsiniz. Olası bir problem ile karşılaşmamak için düzenlemeleri yapmadan önce şablonunuzu bilgisayarınıza kaydedin.

Kodlar: TamBirBlog

Status Message(Durum Mesajı) Bloğunu Düzenliyoruz

Blogger'da etiketlerden herhangi birisine tıklayıp etiket sayfasını açtığınızda veya arama yapıp arama sayfasını açtığınızda "Status Message" isimli bir blok belirir sayfanızda. Bu blokta gittiğiniz sayfanın özelliğiyle ilgili bilgi verir. Örnek vermek gerekirse:
- "widget etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster"
- "Sorgunuzla eşleşen kayıt yok. Tüm kayıtları göster"
- "blogger sorgusuna yönelik kayıtlar görüntüleniyor. Tüm kayıtları göster"

Şimdi bu mesajın görüntülendiği bloğu düzenleyeceğiz. Bu blok normalde css kodlarınıza ekleyeceğiniz basit birkaç kod ile düzenlenebilir ancak ben html kodlarının da üzerinde duracağım.


Status Message bloğu, blog HTML'nizde "widget şablonlarını genişlet" seçeneğinizi aktif ettiğinizde karşınıza çıkan şu kodlar ile tanımlanmıştır:

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

"Bazı Özel Kodlar" isimli yazıda anlattığım gibi b:includable kodu sadece bir nesneyi tanımlamaya yarar. O nesnenin nerede duracağını ise b:include koduyla düzenleriz. Yani üstteki kodları takiben şablonunuzda bir de b:include kodunun bulunması gerekiyor. Bu kod ise şudur:
<b:include data='top' name='status-message'/>

Evet bu kodları gösterdiğime göre düzenleme kısmına geçebilirim. Öncelikle renklendirme ve resim ekleme olayını anlatacağım. Bunu CSS aracılığıyla yapıyoruz.
Şablon HTML'mizde ctrl+f tuş kombinasyonunu kullanarak ]]></b:skin> kodunu arıyoruz, buluyoruz ve hemen üstüne şu kodları yapıştırıyoruz:

.status-msg-wrap {
width:90%;
padding:5px;
}
.status-msg-body {
font-size:80%;
text-align:left;
padding:5px 5px 5px 30px;
width:auto;
}
.status-msg-border {
border:1px solid #a19a36;
opacity:1;
}
.status-msg-bg {
background: #FFF9B3 url(http://img3.imageshack.us/img3/2228/gnomestatus5b25d.png) center left no-repeat;
opacity:1;
}

Renklerden ve biçimlendirmeden biraz bahsedecek olursam:

1) Kenarlık:
Yukarıdaki css kodlarında gördüğünüz border:1px solid #a19a36; kodu Status Message bloğunuzun kenarlıklarını belirtmek için kullanılmış. Buradaki 1px kenarlığın genişliğini, solid kenarlığın cinsini, #a19a36 ise kenarlığın rengini belirtir. 1px değerini büyüterek(2px,3px,..) kenarlığı kalınlaştırabilir, solid yerine dotted yazarak kenarlığı kesik çizgilerden oluşan bir hale getirebilir, #a19a36 yerine de başka bir renk kodu yazarak kenarlığın rengini değiştirebilirsiniz. Kenarlıkları kaldırmak için ise border:1px solid #a19a36; kodu yerine border:0; kodunu yazabilirsiniz.

2) Arkaplan Rengi
Yukarıdaki CSS kodları içerisinde gördüğünüz
background: #FFF9B3 url(http://img3.imageshack.us/img3/2228/gnomestatus5b25d.png) center left no-repeat;
kodundaki #FFF9B3 renk kodunun yerine başka bir renk kodu yazarsanız Status Message bloğunuzun rengini değiştirmiş olacaksınız.

3) Soldaki Resim
Yine bir üst maddede yazdığım kod olan
background: #FFF9B3 url(http://img3.imageshack.us/img3/2228/gnomestatus5b25d.png) center left no-repeat;
kodunun içinde soldaki resimin de kodu mevcut.
http://img3.imageshack.us/img3/2228/gnomestatus5b25d.png
Bu resim linkinin yerine kendi resim dosyanızın linkini yazdığınız zaman Status Message bloğunuzun sol tarafında o resim çıkacaktır. Burada dikkat etmeniz gereken şey ise sizin yükleyeceğiniz resimin genişliği normalde orada bulunan resimin genişliğinden fazlaysa
padding:5px 5px 5px 30px;
Kodundaki 30px değerini büyütmeniz gerekir.

4) Status Message Bloğunu Kaldırmak
Bunu uygulamak için iki tane yöntem var:

4.1) Birinci yöntem CSS kodlarıyla kaldırmak, bu yöntemi kullanırsanız, Status Message bloğu aslında blogunuzda var olacak, ancak ziyaretçiler onu göremeyecek. Yukarıdaki CSS kodlarını blogunuza yapıştırdıysanız silin, çünkü ona artık ihtiyacınız kalmadı. Şimdi ]]></b:skin> kodundan hemen önce şu kodları yapıştıracaksınız:

.status-msg-wrap {
width:0;
height:0;
display:none;
}

Bu işlemi yaptıktan sonra şablonunuzu kaydedin. Olmuş olmalı :)

4.2) İkinci yöntem ise html kodlarının arasından b:include kodunu silmek. Şablon HTML'nizde "Widget Şablonlarını Genişlet" seçeneğini aktifleştirin ve ctrl+f yardımıyla şu kodu bulun:
<b:include data='top' name='status-message'/>
Ve o kodu silin... Şablonunuzu kaydettiğinizde olmuş olmalı :)

Tarayıcı Uyumu: CSS Sıfırlama Tekniği

Bir web sayfası hazırlarken bazı etiketlerin her tarayıcıda farklı göründüğünü fark ettiniz mi hiç? Bazı html etiketleri, eğer css ile onlara belirli değerleri vermediyseniz her tarayıcıda farklı değerler alırlar. Örnek verecek olursak h1 etiketini hiçbir css tanımlaması yapmadan bir şablona yerleştirdik. Bazı tarayıcılar h1 etiketini yorumlarken yukarıdan biraz boşluk bırakırlar. Bazı tarayıcılar ise hiçbir boşluk bırakmazlar. Bu nedenle tarayıcılar arasında büyük farklar oluşabilir.

Ancak CSS Sıfırlama Tekniklerini kullandığımızda ise iş biraz değişir. Bu tekniği kullanarak web sayfamızdaki tüm html etiketlerini başlangıçta sıfırlıyoruz. Bu sayede tarayıcılar değil siz belirlemiş oluyorsunuz nasıl görüneceğini. Sıfırlama tekniği CSS kodlarınızın en başında öylece dururken siz de istediğiniz etiketleri onun altında tekrar tanımlamaya başlıyorsunuz.

Aşağıda benim en çok kullandığım ve bloggerdestek'de de kullandığım CSS Sıfırlama Tekniği olan Eric Mayer'in ürettiği "Tam Sıfırlama" tekniğinin kodları var.

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}

Sanırım en çok kullanılan sıfırlama tekniği de budur. Bu kodu CSS kodlarımızın en başına eklememiz gerekiyor. Blogger için konuşmak gerekirse:
<b:skin><![CDATA[
kodundan hemen sonra yukarıdaki kodları yapıştırabiliriz. Kodların yukarıdaki haliyle şablonunuzda çok yer kapladığını düşünecek olursanız aşağıdaki haliyle de koyabilirsiniz. Nasıl olsa sıfırlama kodu üzerinde hiçbir değişiklik yapmanız gerekmiyor. Aşağıdaki kod yukarıdaki kodun düzenlenmiş halidir. İşlevsel olarak hiçbir fark yoktur.

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
:focus {outline:0;}
body {line-height:1;color:black;background:white;}
ol, ul {list-style:none;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}

Daha fazla CSS Sıfırlama Tekniği öğrenmek isterseniz Web Deneyimleri isimli blogu ziyaret edebilirsiniz. Link:
http://webdeneyimleri.donanimhaber.com/css-sifirlama-teknigi/

Blogger'da Bazı Özel Kodlar

Blogger şablonunda belli başlı anlamlı kodlar vardır. Şablonun tamamen html veya css'den oluştuğunu sananlar yanılırlar çünkü bu kodlar html olarak tanımlı değildir. Bugün bu kodlardan ele alabildiğimce fazlasını ele almaya çalışacağım, çünkü kendi şablonunu yapmak isteyen her ferdin bilmesi gerektiğini düşünüyorum bunları. Başlıyorum.

A) Widget Şablonları Genişletilmeden
Öncelikle widget şablonlarını genişletmeden karşımıza çıkan kodlardan bahsedeyim.
Not: İçi nokta dolu parantez o kodun ortasında başka kodların var olduğu anlamına gelir. Bunu her kodda yapacağım. Parantezin solundaki kod anlatacağım kodun başlangıcı, sağındaki değer ise bitişidir. Ve parantezin yerinde de başka kodlar mevcuttur genellikle.

1) <b:skin><![CDATA[ (.....................) ]]></b:skin>
Bu kodun arasında HTML'den <style> ve </style> taglarının arasına yerleştirmeye alışık olduğumuz, şablonun CSS kodları bulunur. Bir tasarım yaparken siz ister bu kodun arasına yazın css kodlarınızı, isterseniz de yine alışık olduğunuz gibi <head> tagından sonra <style> ve </style> taglarını kopyalayın ve bu tagların arasına yazın.

2) <b:section class='....' id='....' > (....................) </b:section>
Bu kodun arasında widgetleriniz bulunur. Etiketler, blog yazıları, blog arşivi, son yazılar vs. sayfa ögelerinden eklediğiniz tüm widgetler bu kodların arasında bulunur. Bu kod sayfanızda birkaç yerde bulunabilir. Örneğin header, sidebar ve main kısımlarının içerisinde olabilir. Tagın içindeki id='....' kısmındaki noktaları silerek kendi şablonunuzda olmayan bir kelime girmeniz şartıyla bu kodu şablonda çeşitli yerlere kopyalayarak blogunuzda istediğiniz yeri widget eklenebilir hale getirebilirsiniz.

3) <b:widget id='.....' title='..........' type='.....'/>
Bunlar da eklediğiniz widgetleri gösterirler ve bu kodlar yukarıda 2. maddede verdiğim kodun arasında bulunurlar. Her widget için bu koddan bir tane çıkar ve widget şablonlarını genişlet dediğiniz zaman bu kodlar genişleyerek içlerindeki tüm html kodlarını size gösterirler. Bu kodlardan birini silmeniz demek o widgeti silmeniz demektir ve şablonu kaydederseniz geri dönüşü yoktur.

B) Widget Şablonlarını Genişlettikten Sonra
Widget şablonlarını genişlettiğimize göre widgetlerin tasarımıyla ilgili kodlarla uğraşacağız demektir.
Not: Sayfa ögeleri kısmından girip bir widgeti düzenlemek ile buradan bir widgeti düzenlemek arasında fark vardır. Buradan widgetin tasarımını düzenlerken sayfa ögelerinden widgetin içeriğini düzenlersiniz.

1) <b:includable id='............'> (...........) </b:includable>
Noktalı yerlerde belirli html kodları ve aşağıda anlatacağım birkaç özel kod daha vardır genellikle. Bu kod belirli değerleri tanımlamak için kullanılır. Mesela "Yorumlar" veya "Yazılar" ın şeklini falan tanımlamaya yarar. İçerisindeki html kodunu değiştirerek tanımladığı nesneler üzerinde değişiklik yapabilirsiniz.

2) <b:include data='......' name='.........'/>
Genellikle kapalı koddur yani kod tek tag ile oluşur kapatma tagı olmaz ve yukarıdaki gibi "/" ile biter. Neyse b:include koduna gelecek olursak, yukarıdaki b:includable koduyla tanımladığımız olayı herhangi bir yere çağırmak için kullanılır. Yani biz b:includable ile belirtilen şeyin görünmesini istediğimiz yeri b:include kodunu taşıyarak belirliyoruz. Çünkü b:includable sadece onun ne olduğunu ve nasıl olduğunu tanımlamak için kullanılırken b:include ise onun nerede olacağını belirtir.

3) <b:if cond='......'> (...............) </b:if>
Bu kod isminden de anlaşılacağı gibi eğer(if) ifadesini içeriyor. Yani belirli koşullarda belirli tepkiler verilmesini sağlıyor. Bu kodun üzerinde çok duracağım çünkü blog tasarımında çok önemli bir yeri var bence. Yerine göre kullanmasını bilen tasarımcı bu kod ile harikalar yaratabilir.

Öncelikle, bir koşullu sorgulama oluşturabilmek için elinizde bir koşulun olması gerekiyor. Bu koşulu da kodun içerisindeki cont='...' kısmında belirtmelisiniz. Şimdi örnek koşulları işleyelim.

3.1) <b:if cond='data:blog.pageType == &quot;item&quot;'> (.....) </b:if>
Bu koşulda gördüğünüz üzere eşitliğini kurmuş. Burdaki matematiksel sembollerden ve ingilizce ifadelerden de anlayabiliyoruz aslında ancak açıklayayım, data:blog.pageType == &quot;item&quot;data:blog.pageType kodu sayfanın ne sayfası olduğunu sorguluyor. item ise sayfanın yazı sayfası olduğunu belirtiyor. Arada iki tane eşittir(==) işaretinin olması da koşulun eşitlik anlamı taşıdığını gösteriyor. Burdaki koşulun anlamı şu: "eğer sayfa yazı sayfasıysa". Bu kod şu şekilde çalışır:
<b:if cond='data:blog.pageType == &quot;item&quot;'> kodu ile </b:if> kodu arasına yazdığınız kodlar sadece yazı sayfalarında çalışır. Onun harici sayfalarda çalışmaz. İki adet eşittir(=) işaretinden birincisini ünlem(!) ile değiştirerek kodu kullanırsanız kod tam tersi anlamda çalışır. Yani <b:if cond='data:blog.pageType != &quot;item&quot;'> kodu ile </b:if> kodu arasına yazdığınız kod sadece yazı sayfasında görünmez. Onun harici tüm sayfalarda görünür.

3.2) <b:if cond='data:blog.pageType == "archive"'> (.....) </b:if>
Bu kod da bir üstteki maddeyle benzer bir özelliğe sahip. Bu kodun içerisine yazdığınız kod sadece arşiv sayfalarında çalışır. Arşiv sayfasında değilseniz yani anasayfada veya yazı sayfasındaysanız bu kodu çalıştırmaz, sadece arşiv bağlantılarından birine tıkladığınızda açılan sayfada çalışır. Aynı şekilde yukarıdaki maddede olduğu gibi ünlemli(!) versiyonu da vardır. Yani arşiv sayfası olmayan sayfalarda elemanın görünmesini sağlar.

3.3) <b:if cond='data:blog.pageType == "index"'> (.....) </b:if>
Bu kodda da sayfa tipinin index, yani anasayfa olması koşulu verilmiş. Bu kodun içine yazdığınız diğer kodlar veya yazılar sadece anasayfada görünecektir. Yukarıdaki iki maddede olduğu gibi ünlemli(!) kullanımı da vardır. Yani yazıların ana sayfa harici sayfalarda görüntülenmesi koşulu. Bu kod aşağıdaki şekilde de karşınıza çıkabilir:
<b:if cond='data:blog.homepageUrl == data:blog.url'>
Bu kodun da blog ana sayfanızın adresinin şu anda açık olan sayfaya eşit olması durumunda çalışacağını koşullamış. Yani bir şeyin sadece ana sayfada görünmesi için yazılan bir kod.

3.4) <b:if cond='.........'> (.......) </b:if>
Bu kodda anlatılan şey .... olan yere yazılan şeyin doğru olduğu durumlarda çalışmasıdır. Eşittir işareti yoktur yada herhangi bir matematiksel ifade yoktur diyelim. Koşul sizin yönetim panelinden yaptıklarınıza bağlı olarak çalışır. Anlatımda tıkantım kendi kodlarımdan bir örnek veriyorum :)

<b:if cond='data:post.labels'>
Kategoriler:
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'>
<data:label.name/>
</a>
<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if></b:loop>.
</b:if>

Burada koşul olarak data:post.labels kullanılmış. Hani sayfa ögelerinde Blog Yazıları widgetini düzenlerken etiketler diye bir onay kutusu var. Bu kod o onay kutusuna tik koyarsanız çalışacak, diğer durumlarda çalışmayacaktır. İsterseniz buradaki b:if kısımlarını kaldırıp koşulu ortadan kaldırabilirsiniz. Böylece kontrol paneliyle alakayı kesmiş olacaksınız, etiketler her zaman yazıda görünecektir. Bu şekilde tek ifadeli çok sorgu vardır şablonunuzda ben burada etiketleri örnek verdim.

3.5) <b:else> kodunun <b:if> ile birlikte kullanımı:
İngilizcede "aksi halde" anlamına gelen "else" kelimesinden oluşan bu kod b:if kodunun içinde kullanılır. Biz az önce yaptığımız uygulamalarda şöyle şeyler yapmıştık, mesela bir kodu sadece ana sayfada gösteriyorduk. Ancak öyle yazdığımız bir koşulda kod sadece ana sayfada görünüyor, diğer sayfalarda görünmüyordu. b:else kullanırsak durum şöyle olacak, mesela bir yelemanı ana sayfada görünsün diye ayarlayacağız, eğer girilen sayfa ana sayfa değilse başka bir eleman görünecek. Bir örnekle pekiştirecek olursak:

<b:if cond='data:blog.homepageUrl == data:blog.url'>
Bu kısım sadece ana sayfada çıkacak
<b:else/>
Bu kısım ise ana sayfa harici sayfalarda çıkacak
</b:if>

Gördüğünüz gibi bu şekilde b:if koşulunun içerisine yazılan bir koşullamadır b:else. Yani b:if'in tamamlayıcısıdır diyebiliriz. Ama kullanmak da zorunlu değildir tabi :)

4) b:loop Tekrarlama Kodu:
Evet en sevdiğim şeye geldi sıra. Bazı olayları tekrarlama kodu. Örneğin ana sayfada yazıların alt alta listelenmesi, yazı sayfasında yorumların alt alta listelenmesi, yazının altında etiketlerin yan yana sıralanması, bağlantılar widgetinizde kaydettiğiniz linklerin alt alta sıralanması gibi peş peşe gelen listeleme işlemlerini yapar bu eleman. Etiketlerden bir örnek vermek gerekirse:

  Bu yazı şu etiketlere sahiptir:
<div id='etiketlerimiz'>
Kategoriler:
<b:loop values='data:post.labels' var='label'>
  <a expr:href='data:label.url' rel='tag'>
  <data:label.name/>
  </a>
  <b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:loop>.
</div>

Kodda gördüğünüz biçimlendirme üzerinden anlatayım. Burada b:loop kodunun içerisinde yazının etiketlerini çağıran koşullar var. Etikete tıklandığında açılacak olan sayfa falan kodlanmış. Ancak b:loop olmasaydı burada etiketlerin tamamını peş peşe çağıramazdık sayfaya. b:loop burada tek tek her etiketi temsil ediyor. b:loop kodunun içerisinde yapacağınız değişiklik etiketleri tek tek etkilerken b:loop kodunun dışında yapacağınız değişiklik etiketleri toptan etkiler. Mesela b:loop kodunun bir satır üstünde bir resim eklerseniz o resim sayfada bir tane çıkacaktır ancak b:loop kodunun içine bir resim eklemişsek, bu resim sayfada her etiketin yanında görünecektir. Yukarıdaki örnekte gördüğünüz "Kategoriler:" yazısı b:loop kodunun dışında olduğu için sadece bir kere etiketlerden önce görüntüleniyor. Eğer onu b:loop kodunun içerisine yazmak gibi bir hata etse idik her bir etiketten önce kategoriler diye bir kelime çıkacaktı.

5) <data:..../> Kodu
Bu kod belirli verileri Blogger veritabanından şablonumuza çağırmak için kullanılıyor. Örneğin <data:post.author/> kodunda post.author, yani yazının yazarı, verisini blog yazısına çağırma amacı vardır. Bu şekilde pek çok veri vardır şablonda. Örneğin yukarıdaki örneklerin birinde bulunan <data:label.name/> kodu da herhangi bir etiketin ismini çağırmak için kullanılmış.

Bugünlük bu kadar. 3 saatlik bir yazının sonunda sonuna geldim, umarım faydalı olur, eksiklerim veya hatalarım için yorum yapmayı ihmal etmeyin. İyi günler...

Blog Dergisi 1. Sayı

Blog dünyasını yakından ilgilendirecek bir olay var, Blog Dergisi isminde bir dergi piyasaya çıktı. Özgün yazılarıyla ve geniş yazar kadrosuyla online ortamda yayınlanmaya başlayan derginin 1. sayısı bu ay içerisinde çıktı.

Hemen indirip okunması gereken bir dergidir diye düşündüm, kota problemime rağmen indirdim ve yanılmadığımı anladım. Dergi öncelikle şık tasarımıyla göze hitap ediyor. Bir online dergi olmasına rağmen baskı dergiler kadar tasarımı hoş. Aceleyle hazırladıkları için iyi olmadığını söyledikleri dergi kapakları bile bence oldukça şık. Bu da bizi gelecek sayılarda daha güzel dergi kapaklarının beklediğini gösteriyor.

Gelelim dergi içeriğine. Dergi bu sayısında şu ana başlıklarda yazılar içeriyor:

-Blog

-Röportaj

-Teknoloji

-Oyun

-Sinema

-Müzik

-Mizah

Ana başlıklardan da anlaşılacağı gibi bu sadece blog ile ilgili değil, her konuyla ilgili bir dergi. Her telden yazılar var ve her türlü kitleye biraz biraz hitap ediyor. Ancak derginin girişinde de bahsedilmiş yazar eksikliği var ve bu nedenle bence konu sayısı bir dergiye göre yetersiz kalmış.

Bitirirken...

Yazıyı sonlandırırken buradan birkaç tavsiye yazmak istedim aklıma gelen şu:

- Yazar sıkıntınızı gidermek için misafir yazarlığa başvurabilirsiniz. Bir kişi sadece derginin bir sayısına istediği yazıyı gönderir, siz beğenirseniz eklersiniz, o kişinin adı soyadı blog adresiyle beraber yayınlarsınız. O sayınızda da yazar kadronuzda misafir yazarlar(konuk oyuncu gibi) diye bir başlık açar orada ismini belirtirsiniz tekrar.

- Bir blog dergisi olduğu halde blog harici konular çok ağır basıyor. Bu konular olmasın demiyorum ancak blog dergisi diye ismine bakıp açtığımızda blog ile ilgili daha çok yazı görmek istiyoruz.

Dipnot: Blogger konulu yazınızdaki kız da çok hoş olmuş orada :)

PDF uzantılı dergiyi buradan indirebilirsiniz:
http://www.mediafire.com/download.php?omoq2lzlqyh

Derginin yayınlandığı siteler:

Tam Bir Blog

BlogDergisi.com

Yazı İçerisine Kod veya Şablon İçerisine Adsense Kodu Eklemek

Bazı bloggercı arkadaşlar yazı içine kod ekleyemezler. Ya kodları içlerine tire(-) işareti koyarak yazarlar, ya koddaki karakterleri tek tek değiştirmeye çalışırlar, ya da normal yapıştırırlar ama kodlar kod olarak değil de kodun karşılığı olarak görünürler.

Bazı arkadaşlar da Blogger Şablonunun içerisinde body tagından sonra Adsense kodlarını yerleştirmeye çalışırlar ancak blogger şablonunun içerisinde body tagından sonra script tagı eklenemez. Bu nedenle şablon hata verir.

İşte bu iki neden ile Blogger'da kullanamadığımız kodları dönüştürerek yerleştirmemiz gerekiyor.

Eskiden bu şekilde kodları ekleyebilmek için kodun içindeki çoğu karakteri
(<) işaretlerinin yerine (& l t ;) (>)işaretlerinin yerine (& g t ;) ve
(") işaretlerinin yerine (& q u o t;)
olacak şekilde el ile değiştirirdik. Şimdi ise bu işi blogger kullanıcıları için işkence olmaktan kurtaracak bir kod buldum bir yerden, BloggerDestek maskesi giydirdim ve sizler için yayınladım. Buradaki linke tıklayın ve açılan Pop-Up penceredeki büyük alana kodunuzu yazın/yapıştırın. Daha sonra "Çevir" butonuna bastığınızda kodunuz sizin için blogunuza yerleştirilebilir hale gelecektir. Daha sonra o kodu ne yapacağınızı siz biliyorsunuz. Bilmeyenler için:
http://www.bloggerdestek.com/2008/03/reklamlar-yaz-iinde-yaymlansn.html
http://www.bloggerdestek.com/2008/06/reklamlariniz-yazi-icinde-yayimlansin-2.html

Artı olarak bunu sadece reklamlar için mi kullanıyoruz? Hayır! Yukarıda da belirttiğim gibi ziyaretçilerinize/okurlarınıza göstermek istediğiniz kodları yazıya koyarken de çevirdikten sonra koyuyorsunuz. Umarım sizin için hazırladığım şeyi beğenirsiniz :)

Kod Çevir!

Yeniden Doğuş

Bu yola ilk çıktığımız günlerde ne kadar ateşliydik bilirsiniz. İnsanlarla birşeyler paylaşabilmek, insanlara birşeyler öğretebilmek için yanıp tutuşurduk. Yasin abim ile beraber başladığımız bu yolda bu blogdan nice yazarlar geçti. Kimisi geldi, hiçbir şey yazmadan gitti, kimsi geldi, sessiz sakin yazılarını paylaştı ve sonra gitti, kimisi ise hala burada... Blogger dünyasında duyurulacak yenilik hiç bitmiyor. Ancak blogda en son yazılan yazının Mart 2009'da olduğunu görünce de bazı şeyleri düşünmek gerekiyor. 11 yazarı olan bir blogda 4-5 ay boyunca hiçbir şeyin yazılmaması sizce de düşündürücü değil mi?

Blog en parlak zamanlarını Ocak-Ağustos 2008 döneminde yaşadı. O tarihten sonra biliyorsunuz ki benim ÖSS çalışmalarım başladı. Ben 1 sene internetten ayrı kaldım, gelişmelerden ayrı kaldım, en önemlisi de bloglarımdan ayrı kaldım. Döndüğümde fark ettiğim ilk şeylerden birisi BloggerDestek ateşinin söndüğüydü ve çok üzücü olmuştu benim için. Çünkü sitenin başına olmadık felaketler gelmişti. Yeni bir şablon yüklenmiş, şablondaki resim dosyalarının adresleri bozuk olunca şablon neredeyse kullanılamaz hale gelmişti. Üstüne üstlük siteye yaklaşık 4000 dış bağlantı varken site google arama sonuçlarında çıkmaz olmuştu. Sanki sadece izleyicilerinin görüntüleyebileceği bir blog oluvermişti.

Bu duruma en kısa zamanda el atmak gerektiğini düşündüm ama koca bir yaz yasin abimi bekledim bu konuyu konuşmak için, ama onun üniversite işleri olduğunu ve uzun süre gelemeyeceğini anlayınca boşa beklediğimi anladım.(Not: Yasin abi sana sitem etmiyorum.)

Tek başıma bu işe girişmeyi düşündüm. Nereden başlamalı diye düşündüm. Önce blogun Google aramalarında çıkması için birkaç düzenleme yaptım(webmaster tools, meta tag ekleme vs...). Daha sonra kendimi tamamen tasarıma verdim. 3-4 gün süren yeni bir tasarım oluşturma sürecinin sonunda bu temayı oluşturdum. Tek başıma mı? Hayır, Shawn Ralf tüm tasarım süreci boyunca gerek görüşleriyle, gerek verdiği renk kodlarıyla, gerek şablon arşiviyle, gerekse manevi desteğiyle bana çok yardımcı oldu. Teşekkür etmeden de olmayacak :)

Şimdi BloggerDestek için bir yeniden doğuş söz konusu olmalı. Bu yeniden doğuş için birçok fedakarlık yaptım, oldukça fazla vaktimi harcadım. İnşallah diğer yazar arkadaşlar da bu konuda bu bloga desteklerini artık esirgemezler.

Şimdi yazıları düzenleme sürecine giriyorum. Eski, güncelliğini kaybetmiş, işe yaramaz yazıları silip, hala güncel ve işe yarar yazıları da yeniden düzenleyerek blogun görüntüsündeki bozuklukları da biraz daha azaltacağım. Bu süreç de sanırım 3-5 gün civarı sürer. Bana şans dileyin :)

Vay be. Sanırım en uzun yazılarımdan birisi oldu. Ve sanırım en çok uğraştığım şablon da bu oldu :) İnşallah kıymeti bilinir.