Tüm Ayarlarıyla Bubsy Blogger Teması

Wordpress’ten Blogger’a BloggerReflex tarafından çevrilen Busby Blogger Teması, şık ve profesyonel görnümüyle dikkatimi çekti ve burada paylaşmak istedim.Denemek için test bloguma yüklediğimde Bloggr Şablon Tasarımcısı ile uyumlu olduğunu gördüğümde bu tema benim için daha değerli hale geldi.Bunun gibi Blogger Şablon Tasarımcısı ile uyumlu tema bulmak çok kolay olmuyor.

 

         

 

Temanın görünümü Blogger Şablon Tasarımcısından istediğiniz gibi değiştirebileceğinizi hatırlattıktan sonra kodlarda düzenlemeniz yerlere geçiyorum.

 

Twitter, RSS, Facebook Butonları

Sağ üst tarafta, blog başlığının yaında bulunan Twitter, RSS ve Facebook butonlarını düzenlemek için aşağıdaki kodları bulun ve # yerine kendi Twitter, RSS ve  Facebook adreslerinizi yazın.

 

<ul id='social'>
        <li class='twitter'><a href='#'>Twitter</a></li>
        <li class='rss'><a href='#'>RSS</a></li>
        <li class='facebook'><a href='#'>Facebook</a></li>
    </ul>

ss

 

Manşet

Manşette slayt olarak gösterilen resimleri ve başlıkları düzenlemek için aşağıdaki kodları bulun.Kodlarda ki # yerine açılmasını istediğiniz sayfanın adresini, Post Title yerine açılacak sayfanın başlığını, http://……jpg yerine ise gösterilecek resmin adresini yazın.

 

<ul>               
            <li><h2><a href='#'>Post Title</a></h2> <a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnXgtijzWh-bqbV51mNsoXY0QHveEPtfIUy4Aqu8YsW5qE78oBEkwoNntIX10pjJbTwVsGHgSan-zfp9Z03upFt6VViBvBRkqIqIxquW3EPBOszgRz5pm3MTeyr3OPOij8umHvaBy2SsY/s1600/spray-paint.jpg'/></a></li>
            <li><h2><a href='#'>Post Title 1</a></h2> <a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeK44EtPatp634Np7GNPSjqNRKJyvkUx66vK7pDnx2oVRL9faJE7c-PVgCF6OCdUCELaGCBZT-BXYfnb33hOZyjjcjing69wj8HJLzE8RytigiRbsfhRs7KNG-a90JNFCrKQIti-yOW6Q/s1600/south-bank-graffiti.jpg'/></a></li>
            <li><h2><a href='#'>Post Title 2</a></h2> <a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuZhmu-pGiLX2KrCL7FCFRzqGCiz-6JK57-OZKMK57EkdnFmkc4MN7vvBN_2M3VCy4oQIi9DyH0Sikt-cSm442qIjMOlKmsW8TQV6zcZFHwRXL4AbtoFa7gRfyf1qIU7uGDXwcowIsluI/s1600/skater.jpg'/></a></li>       
        </ul>

 

Tarih

Temayı yüklediğinizde büyük ihtimalle yazı başlıklarınınn yanında tarih gözükmesi gerekirken undefined gibi bir şey yazacaktır.Bunu düzeltmek için yapmanız gereken ayarlar şöyle:

 

1. Kumanda Paneline giriş yaptıktan sonra Ayarlar > Biçimlendirme > Tarih Başlığı Biçimini > Cuma, Şubat 10, 2012 olarak ayarlayın.

 

2. Yine aynı yerdeki Tarih Damgası Biçimini > Cuma, Şubat 10, 2012 olarak ayrlayarak kaydedin.

 

Yapılması gereken ayarlar bu kadar.Artık Busby teması kullanıma hazır.Her hangi bir sorun yaşrsanız yorum bölümünden iletebilirsiniz.

Kullandığım “Resimli Benzer Yazılar” Eklentisini Paylaşıyorum

Çoğu blogcu kurulumu kolay olduğu için resimli benzer yazılar elentisi olarak LinkWithin kullanıyor.Ziyaret ettiğim blogların çoğunda LinkWithin eklentisinin kullanıldığını görünce farklı olsun diye daha önce resimsiz benzer yazılar eklentisini paylaşmıştım.

Son günlerde blogumda kullandığım resimli benzer yazılar eklentisini paylaşmamı isteyenlerin sayısı arttı.Sanırım LinkWithin kullanınca köşede çıkan LinkWithin yazısından rahatsız oldular, bu yüzden benden eklentiyi paylaşmamı rica ettiler.



Bu blogda gördüğünüz eklentinin kodlarını olduğu gibi paylaşıyorum.Kurulum 2 aşamadan gerçekleşiyor.Önce </head> </head> kodları arasına stil ve script kodlarını ekleyeceğiz, ikinci aşamada ise Yazının altına HTML kodlarını ekleyeceğiz.Kuruluma geçelim…

1.Aşama: Şablonunuzdan </head>  kodunu bulun ve bunun hemen üstüne aşağıdaki kodları ekleyin:

<!--Resimli Benzer Yazılar Eklentisi Stiller Ve Scriptler Başlangıcı-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: #F1921A;
font-family: Times New Roman;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts  a:hover {
background-color:none;
border: 1px solid #ddd
}
</style>
<script type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkOmWTGOxa07S7JBpePZdRuhHFhmCBa_7zMEGTgbHmF2v30CNzF7FQlV42GLDogsemepiWiiBmr6JEekTLWP1AF6hWeKlN4o-msJKZfr4JrPNVVdpu41QvVX4l6npYyKvAW0yaAizOCT0/s72/no-image.PNG&quot;;
var maxresults=5;
var splittercolor=&quot;#E6E7E8&quot;;
var relatedpoststitle=&quot;Benzer Yazılar:&quot;;
</script>
<script src='http://yourjavascript.com/22229111642/resimli-benzer-yazilar.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Resimli Benzer Yazılar Eklentisi Stiller Ve Scriptler Bitişi-->

2.Aşama: Şablonunuzdan <div class='post-footer'> kodunu bulun ve hemen altına aşağıdaki kodları ekleyin:

<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>

Resimli benzer yazılar eklentisinin kurulumu bu kadar.Bir sorunla karşılaşırsanız yorum bölümünden sorabilirsiniz.

İyi bloglar…

Son Zamanlarda Blogda Yaptığım Değişiklikler

Son günlerde Blog Hocam’ın temasında ufak tefek değişiklikler yapıyorum.Amacım hem daha şık bir görünüme kavuşmak , hem de blogu daha kullanışlı bir hale getirmek.Yaptığım bazı değişikliklerden bahsedip, fikirlerinizi almak istiyorum.Amacıma ne kadar ulaşmışım görmek istiyorum.İşte son zamanlarda temada yaptığım değişiklikler…

 

1.Twitter Akışı

 

 

Aslındabu temayı ilk tasarlamaya başladığımda manşetin üstünde ki bu turuncu şeride menü yerleştirmeyi düşünmüştüm.Sonra memüyü sayfanın en üstüne koymaya karar verince bu turuncu şerit boş kalmıştı.Ne koysam da oraya bir hareket katsam diye düşünürken, bir süredir takipçisi olduğum ve Blogger konusunda ki en başarılı bloglardan biri olan bloggermodifiye.com’un Twitter akışınıza hareket katın başlıklı yazısı ile karşılaştım ve bir kaç ufak değişiklikten sona turuncu şerite Twitter akışını yerleştirdim.

 

2. Yazı Başlıkları

 

 

Yazı başlıkları önceden düz siyah renkteydi.Yaptığım küçük bir değişiklik ile yine siyah olan yazı başlıklarına gri gölge efekti verdim.Daha şık göründüğünü düşünüyorum.Bu değişikliğin ilham kaynağı ise en şık tasarlanmış Blogger alt yapısına sahip bloglardan biri olan kelimelerbenim.com sitesi.

 

3. “Devamını Oku” Bağlantısı

 

 

Bildiğiniz gibi blogun ana sayfasında yazıların tamamını göstermek yerine devamını oku bağlantısı kullanarak, yazıların belli bir bölümünü gösteriyorum.Önceden yazıların sağ alt köşesinde kullandığım “Devamını Oku” bağlantısını gri bir kutu içerisinde ve yeşil renkte gösteriyordum.Temaya daha uygun olacağını düşündüğüm için o kutunun rengini turuncu, bağlantının rengini ise siyah yaptım.Artık eskisi kadar gözüme batmıyor :)

 

4. Yazar Yorumları

 

 

Yorum bölümünde kendi yaptığım yorumların daha belirgin olması için yazar yorumlarını bir çerçeve içinde göstermeye başladım.

 

Söz Sizde:

Bu değişikliklerle ilgili olumlu, olumsuz yorumlarınızı merak ediyorum.Paylaşırsanız sevinirim.Ayrıca başka ne gibi değişiklikler yapabileceğim konusunda bir fikriniz varsa yazabilirsiniz.

SEO’ya Uygun Blog Yazısı Oluşturun

Bir bloğunuz varsa onu en iyi yerlerde görmek en büyük hedefinizdir. Emeklerinizin karşılığının boşa gitmesini istemiyorsanız bloğunuza vakit ayırmanızı tavsiye ederim. Ben sizlere bu yazıda bir blog yazısının arama motorlarına uygun şekilde hazırlanmasından bahsedeceğim. Eğer yazınızı seo kuralları dahilinde hazırlarsanız yayınlarınız arama motorlarında daha üst sıralara çıkacaktır.

 

 

1. İçeriğin başlığını oluştururken şunlara özen gösterin.Konuya en uygun başlığı oluşturmalısınız. Konu ile ilgili arama motorlarında hangi kelimeler arandığını analiz edin. Ayrıntılı bilgiye buradan ulaşabilirsiniz.Yayın başlığı yayın adresini belirlediğinden dolayı başlıklarınızda Türkçe karakter kullanmamaya özen gösterin. Ben başlıklarımı şöyle oluşturuyorum. Yayını hazırlarken başlıkta Türkçe karakter kullanmıyorum.Yayınladıktan sonra yayın başlığımı güncelleyerek Türkçeye uygun hale getiriyorum.

 

 

2. İçeriğin konu kısmıyla alakalı bir anahtar kelime belirleyin. Belirlediğiniz bu anahtar kelimeyi yayının başlarında yoğun olarak kullanın yayın ilerledikçe ise bu anahtar kelimeyi azaltarak içeriği oluşturun. Sonlara doğru anahtar kelimeyi tekrardan sık kullanmaya başlayabilirsiniz.

 

3. Anahtar kelimenizin eş anlamlılarını yayın içeriğinde kullanın. Çünkü kullanıcının bu eş anlamlı kelimelerle arama yapabilir. Mesela Seo yerine Arama motoru optimizasyonu şeklinde arama yapabilirler.

 

4. Kullanmış olduğunuz anahtar kelimeleri ve eş anlamlılarının bir kısmını kalın, italik ve altı çizili şekillerden birini kullanın çünkü arama motorları özellikle google bu kelimeleri anahtar kelime olarak algıladığı webmasterlar tarafından belirtiliyor.

 

5. Yayın içeriğinizi diğer yayınlarınız arasından konu ile alakalı olanlarla bağlayın. Mesela Seo ile ilgili bir yayın hazırlıyorsanız daha önce oluşturduğunuz seo ile alakalı yayınlarınızla bağlayın. Bu işlem ile sayfalarınız arasında pagerank paylaşımı yapabilirsiniz ve arama motorlarına içeriğin hangi konudan bahsettiğini anlatma yöntemlerinden biridir.

 

6. İçeriğinizde konu ile alakalı başka bir sitenin linkini paylaşın. Bu link sitenizin referansı niteliğinde olacaktır ve bu yabancı site kaliteli bir site ise yayınızın içeriği arama sonuçlarında daha üst sıralara çıkacaktır.

 

7. Dışardan link veya resim alırken bu siteye güvenmiyorsanız bu url adresini nofollow olarak etiketleyin. Nofollow bir bağlantı oluşturmak için HTML kısmına tıklayın. Link veya resmin url adresini bulun ve hemen sonuna rel=”nofollow” etiketini ekleyin. Bu işlem arama motorlarına link veya resim aldığınız siteye referans olmadığınızı göstermenin bir yoludur.

 

8. Yayın içeriğine resim yüklemek kullanıcıya kaliteli bir içerik sunmak için önemli olsa da arama motorlarının resimleri tarayamadığını bilmiyorsanız yayınınız arama motorları tarafından sevilmeye bilir. Arama motorları resimlerimizin kodlarını tarar (url adresi, boyutu vb.) bunun sonunda bir sonuca varmaya çalışır. Bundan dolayı oluşturduğunuz yayına resim eklerken her türlü özelliğini belirtmek önemlidir. Eğer karşı siteye referans olmuyorsanız nofollow olarak etiketleyin. Resmin boyutunu belirleyin çünkü google botları tarama yaparken eğer resim boyutu kod olarak girilmemiş ise ilk önce orijinal boyutunu açmaya çalışacağından bu sitenin açılış süresini uzatır. Bu da google botları tarafından negatif bir sonuç olarak gözükecek ve yayınınızın arama sonuçlarında geride kalmasına neden olabilir.

 

9. Son tavsiyem ise yazılarınızda bir konuya odaklanın makalelerinizi bir yayında sunmak yerine parçalara bölün. Eğer özgün bir içerik oluşturursanız konularınız daha üst sıralarda yer alacaktır.

 

Yazıma burada son veriyorum. Benim aklıma şuan bu bilgiler geldi benim unuttuğum şeyleri sizler yorum kısmında paylaşabilirsiniz. Umarım faydalı bir yazı olmuştur.

 

Yazar Hakkında:

Bu yazı; elektronik devreler , PIC programlama, C# gibi elektronik ve bilişim konuları ile ilgilenen Sadık Bozkurt tarafından yazılmıştır. Yazarın diğer yazılarını okumak için kişisel web sitesi olan Teknokoliker'i ziyaret edebilirsiniz.

Elite Minima: Ücretsiz Premium Blogger Teması

Custom Blogger Templates sitesinde Blogger temaları yapan Harish, yeni bir Premium Blogger teması yapmış.Bildiğiniz gibi internetten indirdiğimiz temalar Blogger Şablon Tasarımcısı ile uyumlu olmadığından dolayı bu temalarda değişiklik yapamıyoruz.İşte Elite Minima isimli bu temanın en güzel özelliği Blogger Şablon Tasarımcısı ile uyumlu olması.Bu sayede renkleri, yazı tiplerini, boyutlarını kolayca değiştirebilirsiniz.

 

          

 

Temada Türkçeleşmesi gereken birkaç yer vardı.Onları Türkçeleştirip kendi Box hesabıma upload ettim.Temayı Türkçe olarak kullanabilirsiniz.

 

Yazı başlıklarında kullanılan font Ş karakterini desteklemiyor.İsterseniz Blogger Şablon Tasarımcısı’ndan fontu değiştirebilirsiniz.

 

Temanın bazı özellikleri şöyle:

• Özelleştirilebilir, temiz, minimal arayüz.
• CSS3 ile oluşturulmuş şık arama kutusu.
• Resimli otomatik “devamını oku” eklentisi.
• 3 sütunlu footer alanı.
• Şeffaf hover efektli sosyal paylaşım butonları.
• Benzer yazılar eklentisi.

Blogger’da nasıl tema değiştirileceğini bilmiyorsanız buraya bakabilir, paylaştığım diğer Blogger temalarını ise buradan görebilirsiniz.