Blogger Ve Wordpress Tema Arşivi

Blog yazmaya yeni başlasdığımda yayınlamayı düşündüğüm yazıyı  yazdıktan sonra gönder butonuna basar ve blogumda yayınlardım.Daha sonra yazım hataları, hatalı linkler, yanlış anahtar kelimeler ve yanlış başlık seçimi gibi hatalarımı farkeder geri dönüp bunları düzeltmekle uğraşırdım.Gerçekten çok sıkıntılı ve zahmetli bir durum.

 

 

Sonunda onca zahmeti çekmektense bir blog yazısı kontrol listesi oluşturdum ve yazılarımı yayınlamadan önce bu kontrol listesindeki her maddenin yanına tik işarerti koymadan yazılarımı yayınlamamaya karar verdim.

 

Yazım Yanlışları

Blog yazımızı yazdıktan sonra yazım yanlışlarını kontrol etmek için yazıyı tekrar okumamamızın tek sebebi tembellik sanırım.Benim gibi çoğu blogcunun yaptığı bir hatadır yazıyı yayınlamadan önce tekrar okumamak.Yazıyı yazarken yorgun, uykusuz veya başka birşey düşünüyor olabilirsiniz.Bu durumda yazım hatalarından anlamsız cümle kurmaya kadar pek çok hata yapabilirsiniz.O yüzden en iyisi yazıyı bitirdikten sonra bir kez daha okumak.

 

Anahtar Kelime Araştırması

Blogların en önemli hit kaynağı Google’dır.Google aramalarından daha fazla ziyaretçi kazanmak istiyorsak mutlaka anahtar kelime araştırması yapmalıyız.Anahtar kelime araştırması yaparak hangi kelimelerin daha fazla arandığını tespit etmeli ve yazınızda o anahtar kelimeleri kullanmalıyız.Anahtar kelime araştırmasını nasıl yapacağım diye soracak olursanız Google ile anahtar kelime araştırması yapablilrsiniz.Bu arada anahtar kelimelerinizi yazınızda kullanırken SPAM olarak algılanıp ceza almamak için anahtar kelime yoğunluğuna dikkat etmelisiniz.

 

Başlık Seçimi

Yazı başlığı, ziyaretçilerin yazınızı okuyup okumama kararını etkileyen en önemli faktördür.Güçlü ve etkileyici bir başlık seçerek ziyaretçilerin blogunuzda dolaşırken başlığa tıklayıp yazıyı okumalarını salar.Ayrıca önemli trafik kaynaklarından sosyal paylaşım ve imleme sitelerinden ziyaretçi çekmenin sırrı tabiri caizse mıknatıs etkisi yapacak başlıklar seçmektir.Seçeceğimiz başlık dikkat çekici, merak uyandırıcı olmalı ve mümkünse anahtar kelimeler içermelidir.

 

Dahili Linkler

Blog yazılarınızda daha önce yazdığınız yazılara link vermek okuyucuların diğer yazılarınızı da keşfetmelerini ver okumalarını sağlamak için çok etkili bir yöntemdir.Arama motoru dostıu bir blog için site içi linklemeye mutlaka önem vermeliyiz.Doğru anchor text kullanarak diğer yazılarımıza verdiğimiz linkler arama motoru botlarının blogunuzu en mükemmel şekilde indekslemesine yardımcı olur ve Google’ın çok önem verdiği bounce rate değerinizi düşürmenize yardımcı olur.

 

Harici Linkler

Bazı blogcular nedense başka sitelere link vermekten çekinirler.Sanırım okuyucularına kaybetmekten korktuklarından.Aslında özgün ve kaliteli bir içeriğe sahip bloglarda böyle bir şey söz konusu bile olamaz.Aksine okuyucular okudukları yazıyla ilgili farklı kaynaklara link veren blogcuları daha çok takip ederler.Üstelik yazıyla ilgili diğer kaynaklara link vererek o sitelerin dikkatini çekeriz.Eğer o kaynak ta bizim yazımı beğenirse o da bize link verir bu sayede ekstradan backlink ve okuyucu kazanmış oluruz.

 

Kırık Linkler

İster dahili ister harici link olsun verdiğiniz linklerin doğru olup olmadığını kontrol edin.Google’ın en sevmediği şeylerden biri hata sayfalarıyla karşılaşmaktır.Blogumuzda ki başka bir yazıya ya da diğer bir blogdaki yazıya link verirken adresi doğru yazdığımızdan emin olmalıyız ve linki mutlaka kontrol etmeliyiz.

 

Görsel Kullanımı

Blog yazılarımızda bir konuyu daha iyi anlatmak için ya da yazıya hareket katmak için görsel öğelerden faydalanabiliriz.Üstelik yazılarımızda kullandığımız bu görselleri doğru bir şekilde optimize edersek görsel arama motorlarından da azımsanmayacak sayıda ziyaretçi kazanabiliriz.

 

“Call To Action”

Blog yazılarına daha fazla yorum almanın en etkili yollarından bir yazının sonunda okuyucuları yorum yazmaya yani aksiyona davet ettiğimiz “Call To Action” cümleler yazmaktır.Bu kısımda bazen bir soru sorar, bazen yazıya ilave bilgi ister, bazen yazıyı paylaşmalarını isteriz.Asıl amaç interaktivitedir.Yazar ile okuyucu arasındaki etkileşimi arttırmaktır.

 

Söz Sizde

Benim kontrol listem bu şekilde.Bu liste yayınlaan içeriğin ve blogun konusuna göre değişebilir.Sizden blogunuzun konusu ne olursa olsun blog yazılarınız için bir kontrol listesi oluşturmanızı ve bunu bizimle paylaşmanızı rica ediyorum.

devamı »

devamı »

devamı »

devamı »

devamı »

devamı »

devamı »

Merhaba değerli arkadaşlar. Sizlere bugün blogger eklentileri içerisinde çok iyi bir eklenti olan "Bu Yazıyı Paylaşın Eklentisi" nden bahsetmek istiyorum.



Bu eklenti sayesinde yazılarınızın hemen altında;

-Yazınızın linki,
-Site kodu,
-Forum kodu,

gelecektir. Bu şekilde yazınızı okuyup ve paylaşmak isteyen insanlar da çok kolay bir şekilde yazılarınızı paylaşabilecektir.

Bu eklentiyi kurmak içinse Html'yi düzenle kısmına gelip Widget Şablonlarını genişlet kutucuğuna tıklayın. Daha sonra <div class='post-footer-line post-footer-line-3'> kodunu bulun.


Yukarıdaki koddan hemen önce de bu kodu yazıyoruz.





Bu kodu da eklediğimiz zaman eklentimiz çalışacaktır.

Popüler bloglarda  çok sık karşılaştığım bir şey bilgilendirme çubukları.Ziyaretçilere bir şey duyurmak istediğinizde dikkat çekici olduklarından dolayı bu çubuklar çok işe yarıyor.

 

Bu yazıda Blogger’a bu tarz bir bilgi çubuğunu nasıl ekleyeceğinizi anlattım.Resimde gördüğünüz çubuk blogunuzda sabit kalır ve sayfayı aşağı – yukarı kaydırsanız bile aynı yerde sabit kalır.Çubuğun diğer önemli özellikleri şeffaf ve istenildiğini an kapatılabilmesi.

 

Bu bilgilemndirme çubuğunu blogunuza eklemek için şablonunuzdan </body> kodunu bulun ve hemen üstüne aşağıdaki kodları ekleyin.

<style type='text/css'>
#ut-sticky
{
background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLZsIiwkPUhT1JT-LRPsCG6SxPz0WvE0DACWHeH5NnhLy1z74YJy-4yCe0zB0laQ418-Xp3p67VaSm2EA9Tk93A6NmMXIbR5wwqIdS0fFh1fHqRVEDGSC94j8GOkvD8c1iAGhMeQJ2R9Dq/s1600/ut-bg.png&#39;) repeat;
color:#fff;
margin:0 auto;
border-top: 1px solid #fff;
height:28px;
font-size:13px;
position:fixed;
bottom:0;
z-index:999;
width:95%;
border-top-left-radius:15px;
border-top-right-radius:15px;
display:block;
font-weight: bold;
font-family: arial,&quot;Helvetica&quot;;
font-color:#fff;
}
#ut-sticky:hover
{background:#333;}
#ut-sticky p{line-height:5px; font-size:13px; text-align:center; width:95%; float:left;}
#ut-sticky p a{ text-decoration:underline; color:#FFFF33;}
.ut-cross{display:block; position:relative; right:15px; float:right;}
.ut-cross a{font-size:18px; font-weight:bold; font-family:&quot;Arial&quot;; color:#FF0000; line-height:30px;}
</style>
<div id='ut-sticky'>
<p>Kapatılabilir Bilgilendirme Çubuğu <a href='http://bloghocam.blogspot.com' target='_blank'>Blog Hocam</a></p>
<div class='ut-cross'><a href='javascript:hide_cross();'>X</a></div>
</div>
<script language='JavaScript'>
function hide_cross() {
crosstbox = document.getElementById(&quot;ut-sticky&quot;);
crosstbox.style.visibility = &#39;hidden&#39;;
}
</script>

Düzenlemeniz gereken yerler:

 

- Kapatılabilir Bilgilendirme Çubuğu  yazan yere kendi bilgi mesajınızı yazın.

- Blog Hocam yazan yere anchor texti yazın.Bu yazı ile istediğiniz sayfaya link vereceksiniz.

- http://bloghocam.blogspot.com yerine anchor texte tıklayınca açılmasını istediğiniz sayfanın adresini yazın.

Bayan okuyucularımdan birisi ( ismini hatırlayamadım kusura bakma ) kişisel Google Plus sayfamdan bana ulaşarak bloguna bir galeri sayfası eklemek istediğini söylemişti.Bir süredir internette böyle bir galeri ya da portföy sayfasında kullanmak için güzel bir Jquery scripti arıyordum, nihayet buldum.

 

 

Resimde gördüğünüz galeri sayfasının nasıl çalıştığını görmek için aşağıdaki videoyu izleyebilirsiniz.

 

 

Bunun gibi bir galeri sayfası oluşturmak için;

 

1.Adım: ]]></b:skin> kodundan önce aşağıdaki kodları ekleyin.

 

/* Blogger Zoom Gallery  */
ul.thumb {
float: left;
list-style: none;
margin: 0; padding: 10px;
width: 360px;
}
ul.thumb li {
margin: 0; padding: 5px;
float: left;
position: relative;  /* Set the absolute positioning base coordinate */
width: 110px;
height: 110px;
}
ul.thumb li img {
width: 100px; height: 100px; /* Set the small thumbnail size */
-ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */
border: 1px solid #ddd;
padding: 5px;
background: #f0f0f0;
position: absolute;
left: 0; top: 0;
}
ul.thumb li img.hover {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwVUVwBaDPNJfC1AFBbGDFSxuuYJP0ZT4-xQTxPOvjPKhJpYJroQfTl6CF7aB_USLdi7lSvFZDfi6x3Rk5yTk2fuM1UsJ-fRh-7ENuPdxQT-ooXDjnm8D_eoHK72YxxJO-UaspTGX2On8Y/) no-repeat center center;  /* Image used as background on hover effect
border: none; /* Get rid of border on hover */

2.Adım: </head> kodundan önce aşağıdaki kodları ekleyin.

<script src='http://code.jquery.com/jquery-latest.js'
type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){

//Larger thumbnail preview

$(&quot;ul.thumb li&quot;).hover(function() {
$(this).css({&#39;z-index&#39; : &#39;10&#39;});
$(this).find(&#39;img&#39;).addClass(&quot;hover&quot;).stop()
.animate({
marginTop: &#39;-110px&#39;,
marginLeft: &#39;-110px&#39;,
top: &#39;50%&#39;,
left: &#39;50%&#39;,
width: &#39;174px&#39;,
height: &#39;174px&#39;,
padding: &#39;20px&#39;
}, 200);

} , function() {
$(this).css({&#39;z-index&#39; : &#39;0&#39;});
$(this).find(&#39;img&#39;).removeClass(&quot;hover&quot;).stop()
.animate({
marginTop: &#39;0&#39;,
marginLeft: &#39;0&#39;,
top: &#39;0&#39;,
left: &#39;0&#39;,
width: &#39;100px&#39;,
height: &#39;100px&#39;,
padding: &#39;5px&#39;
}, 400);
});

//Swap Image on Click
$(&quot;ul.thumb li a&quot;).click(function() {

var mainImage = $(this).attr(&quot;href&quot;); //Find Image Name
$(&quot;#main_view img&quot;).attr({ src: mainImage });
return false; 
});

});
</script>

3.Adım: Sayfa düzenlemeden yeni bir sabit sayfa oluşturun ve sayfanın HTML kodları bölümüne aşağıdaki kodları ekleyerek sayfayı yayınlayın.

<ul class="thumb">
<li><a href="#"><img src="Resim 1 Link" alt="" /></a></li>
<li><a href="#"><img src="Resim 2 Link" alt="" /></a></li>
<li><a href="#"><img src="Resim 3 Link" alt="" /></a></li>
<li><a href="#"><img src="Resim 4 Link" alt="" /></a></li>
<li><a href="#"><img src="Resim 5 Link" alt="" /></a></li>
<li><a href="#"><img src="Resim 6 Link" alt="" /></a></li>
</ul>

Galerideki yeni fotoğraf eklemek için;

Galeriye yeni bir resim eklemek için galeri sayfasının HTML bölümüne eklediğiniz kodlara yeni bir li satırı ekleyebilirsiniz.Örneğin;