Sitene Angry Birds Fare İmleci Ekle

Web sitenizde bulunan normal fare imlecin den sıkıldıysanız, angry birds fare imleçleri tam size göre. Sitesine biraz renk katmak, eğlence katmak isteyen webmasterlar için angry birds fare işaretlerini sizlerle paylaşıyorum. Blogger sistemine fare imleci nasıl eklenir konusunda sıkıntı yaşayanlar bu konudan gerekli bilgileri edinebilirler. Ayrıca bu kod bütün blog sistemlerinde çalışmaktadır.

Sizlerle tam olarak bir birinden güzel 5 adet angry birds fare işareti paylaşıyorum. Fare imleçlerinin demosunu istediğiniz angry bird karakterinin üstüne gelerek test edebilirsiniz.  İşte karşınızda popüler angry birds fare imleçleri.
angry birds
Blogger Angry Birds Fare İmleci Ekleme

-Blogger Yönetici Paneline giriş yapın.
-Yerleşim > Gadget ekleye tıklayın.
-Açılan pencerede HTML/JavaScript'e tıklayın ve beğendiğiniz fare imlecini kopyalayıp yapıştırın.
-Kaydet butonuna basın. İşlem tamam!

  <style>body, a, a:hover {cursor: url("http://4.bp.blogspot.com/-6E6-dgBdzXY/U_UTyhEjQJI/AAAAAAAACsY/3iu6QTegZ68/s1600/angry_birds_pig.png"), auto !important;}</style>


  <style>body, a, a:hover {cursor: url("http://2.bp.blogspot.com/-hN8M5XCMSuc/U_UTyqAN1qI/AAAAAAAACsM/rQdlkdhyyhA/s1600/green_angry_bird.png"), auto !important;}</style>


  <style>body, a, a:hover {cursor: url("http://1.bp.blogspot.com/-jfUQECCqDds/U_UTym9I2bI/AAAAAAAACsA/1GdpVJDugP8/s1600/red_angry_bird.png"), auto !important;}</style>


  <style>body, a, a:hover {cursor: url("http://2.bp.blogspot.com/-oWQJLoHbBvI/U_UTzJ7hQjI/AAAAAAAACsI/41AKdlWpunU/s1600/white_angry_bird.png"), auto !important;}</style>


  <style>body, a, a:hover {cursor: url("http://3.bp.blogspot.com/-wuyPq-yXi34/U_UTztes8PI/AAAAAAAACsQ/MaHavyQ_cXY/s1600/yellow_angry_bird.png"), auto !important;}</style>

Blogger FeedBurner Kurulumu ve Ayarları

Blogger hemen hemen herkesin kullandığı en büyük blog platformlarından biridir. Eğer aktif Google hesabınız varsa, sizde dakikalar içinde kolayca bir blog sahibi olabilirsiniz. Ne yazık ki her şey blog açmayla bitmiyor. Blogunuz da bir içerik yayınladıktan sonra ihtiyacınız olan en önemli şey içeriğinizi okuyacak okuyuculardır. İçerik beslemeleri, blogunuz güncellendiği zaman, blog takipçilerini yazdığınız yeni yazıdan haberdar olmasını sağlayarak takipçi sayınızı ve hitinizi arttırır.

FeedBurner ise en çok bilinen içerik besleme sistemlerinden biridir. Hemen hemen her blogger RSS beslemeleri için Google'ın ücretsiz olarak kullanıma sunduğu FeedBurner'i kullanıyor.

feedburner

FeedBurner Kurulumu ve Ayarları

- FeedBurner'e giriş yapmak için önce Google Hesanıza giriş yapmalısınız. Google hesabına giriş yaptıktan sonra http://feedburner.google.com/ servisine girin.

Adım 1: FeedBurner servisine girdikten sonra alt tarafta bulunan bölüme blog sayfanızı girin. Next butonuna basın.
blogger feedburner kurulumu

Adım 2: Blogger kullanıcıysanız gelen ekranda blogunuzun mevcut besleme adresleri listelenecektir. İlk seçenekte bulunan Atom'u seçin ve Next butonuna basın.
blogger feedburner ekleme
Adım 3: Sıra geldi beslemeleriniz için başlık ve adres belirlemeye. Feed Title  yani besleme başlığı otomatik olarak blog başlığınız olarak tanımlanır. İster burayı değiştirebilir isterseniz de olduğu gibi bırakabilirsiniz. Feed Adress ise insanların beslemelerinizi görmenizi sağlayacak adrestir. Kısa ve akılda kalıcı bir adres seçimi her zaman için yararlıdır. Gerekli alanları doldurduktan sonra Next'e basın.

blogger feedburner kurulumu

Adım 4: Gerekli adımları tamamladıktan sonra feedburner kurulumu başarıyla tamamlandı yazısını göreceksiniz. Alt tarafta ki resimde de gördüğünüz üzere feed adresimiz http://feeds.feedburner.com/bloggereklenti formatında başarıyla oluşturuldu. Takipçileriniz blogunuza abone olmak için bu adresi kullanabilirler. blogger feed adresimizi başarıyla oluşturduktan sonra Next butonuna basın.
 blogger feedburner kurulumu
Adım 5: Açılan sayfada feedburner'in besleme istatistiklerini tutması için gerekli ayarlamaları yapabilirsiniz. Siteniz için daha fazla istatistik istiyorsanız Clickthroughs — How often people click items back to your site seçeneğini ve I want more! Have FeedBurner Stats also track seçeneğini işaretleyin ve Next'e basın.
blogger feedburner kurulumu

Next butonuna bastıktan sonra başarılı bir şekilde kayıt aşamamız tamamlandı ve feedburner hesabımız aktifleştirildi. Bundan sonra ki yapacaklarınız FeedBurner aboneliği için tamamen sizin isteğinize kalmış.

Adım 6: Sıra geldi FeedBurner Optimize ayarlarına. Üst sekmelerde bulunan Optimize butonuna tıklayın. Ardından sağ menüde bulunan Browser Friendly'i seçerek Theme: ClearFeed (Turkish)'i seçin ve Save butonuna basın.
- Sağ tarafta bulunan menüden SmartFeed ve FeedFlare seçeneklerini aktifleştirin.
SmartFeed: Blogunuza veya site üzerinde tek bir beslemesini yayınlarken mümkün olan en geniş kitleye ulaşır. Ziyaretçilerinizin besleme okuyucu uygulaması ile uyumlu bir formatta (RSS veya Atom) yayınınızı diğer dillere çevirir.
FeedFlare: Abonelerinizin aşağıda listelenen hizmetler ile yayınlarınızı Site ve ya Feed üzerinden kolay bir şekilde e-mail,sosyal paylaşım sitelerinde paylaşma, etiketleme gibi hizmetler ile kolay bir şekilde başkalarıyla paylaşabilir.

blogger feedburner ayarları

Adım 7: Publicize ayarlarında ise abonelerinizi arttırmak için çeşitli öneri ve ipuçları bulunuyor. Bu kısımdan kişilerin beslemelerinize abone olmasını sağlamak için Email Subscritions, Yeni  yazılar yazdığınız da otomatik olarak popüler arama motorlarına haber vermek için PingShot, Beslemelerinize abone olan kişilerin sayısını görmek için FeedCount ve yeni konu açtığınızda Twitter gibi sosyal medya sayfalarına otomatik olarak tweet atmak için Socialize servisini seçin.

blogger feedburner ayarları
Headline Animator: Resimler üzerinde dönüşümlü olarak sitenizdeki konu başlıkları döndürmenize yarar.
BuzzBoost: Bir IFRAME kodu içerisinde beslemelerinizi başka siteler üzerinden göstermenize imkân sağlar. CSS kısmından da kendinize has tasarımınızı yapmanıza olanak sağlar.
Email Subscriptions: İnsanların beslemenize abone olmasını sağlayan sistemdir.
PingShot: Yeni bir giriş yaptığınızda bazı sunucuların bundan haberdar olmasını sağlayan sistemdir.
FeedCount: Sitenize eklediğiniz RSS beslemesine kaç kişinin abone olduğunu buradan takip edebilirsiniz.
Socialize: Beslemelerinizi Twitter gibi sosyal paylaşım sitelerine bağlayarak, konu yazdığınızda otomatik olarak sosyal medya adresinizden tweet atar.
Creative Commons: RSS çıkışı içerisine telif hakları ve diğer yasal çözümleri eklemenize imkân verir. Bu sayede çalınma olaylarını aza indirebilirsiniz.
Chicklet Chooser: Sitenize eklemesini yapabileceğiniz düğmeler ve butonlar ile istatistik bilgileri için özel kutuları buradan alabilirsiniz.
Password Protector: RSS okumasını şifreleme yapabilirsiniz. Sadece sitenize üye olanların RSS bilgilerini görmesini isterseniz bu kısmı kullanabilirsiniz. Ama diğer ziyaretçiler üye olmadan göremeyecektir RSS bilgilerini.
NoIndex: Arama Motorları tarafından RSS bilgilerinizi okunmasını engelleyen seçenektir. Pek fazla tercih edilmez.

Blogger için FeedBurner kurulum ve ayarları bu kadardır. Takıldığınız bir yer olursa yorum bölümünden sorabilirsiniz.
| | | | | Devamı » 19 Ağustos 2014 Salı sayfa 0 yorum

Blogger Sayfa Numaralandırma Eklentisi

Blogger'da ana sayfada ve sayfa başına gösterilecek konu sayısı Ayarlar > Yayınlar ve Yorumlar > En fazla şu kadar kayıt göster seçeneğinden ayarlanabiliyor. Fakat her ne kadar bu şekilde sayfa başına gösterilecek kayıtlar ayarlansa da sayfa navigasyonu arşivlere göre Eski Kayıtlar ve Yeni Kayıtlar olmak üzere ikiye ayrılıyor. Blogger'da sayfa numaralandırma el ile kod eklenmediği sürece otomatik olarak ayarlanamıyor. Bu konumuzda sizlerle blogunuza sayfa numaralandırma eklentisi nasıl eklenir resimli bir şekilde anlatacağım.
blogger sayfa numaralandırma eklentisi

Blogger Sayfa Numaralandırma - Page Navigation Eklentisi 

Tam olarak 7 adet birbirinden farklı stillere sahip blogger sayfa numaralandırma kodlarından öncelikle bir stil seçin. Stil seçtikten sonra:

Adım 1: Blogger Yönetici > Şablon > HTML'yi düzenle butonuna tıklayın.
Adım 2: Blogger şablon kodlarının bulunduğu alana tıklayıp CTRL + F 'e basıp Blogger kod arama butonunu açın.
Adım 3:  ]]></b:skin> kodunu aratın ve hemen üstüne aşağıdan seçmiş olduğunuz blogger sayfa numaralandırma stillerinden birini yapıştırın.

  • Stil 1
 #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 3px 7px;margin-right:5px;background:#E9E9E9;color: #888;border:1px solid #E9E9E9;}
.displaypageNum a:hover,.showpage a:hover,.pagecurrent{background:#CECECE;text-decoration:none;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .showpage, #blog-pager .pagecurrent{font-weight:bold;color: #888;}
 #blog-pager .pages{border:none;}

blogger sayfa numaralandırma eklentisi
  •  Stil 2
 #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#404042;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#EC8D04;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

blogger sayfa numaralandırma eklentisi

  • Stil 3
 #blog-pager{clear:both;margin:30px auto; padding: 7px; text-align:center;font-size: 11px;background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #000000),color-stop(1, #292929));background-image: -o-linear-gradient(top, #000000 0%, #292929 100%);background-image: -moz-linear-gradient(top, #000000 0%, #292929 100%);background-image: -webkit-linear-gradient(top, #000000 0%, #292929 100%);background-image: -ms-linear-gradient(top, #000000 0%, #292929 100%);background-image: linear-gradient(to top, #000000 0%, #292929 100%); padding: 6px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 3px 10px;margin-right:5px; color: #fff;}
.displaypageNum a:hover,.showpage a:hover,.pagecurrent{background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #59A2CF),color-stop(1, #D9EAFF));background-image: -o-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: -moz-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: -webkit-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: -ms-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: linear-gradient(to top, #59A2CF 0%, #D9EAFF 100%);text-decoration: none;color: #000;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.showpageOf{display:none!important}.blog-pager-older-link, .home-link, .blog-pager-newer-link {background: transparent;}
a.blog-pager-older-link, a.home-link, a.blog-pager-newer-link {color: #fff;}
#blog-pager .pages{border:none;background: none;}

blogger sayfa numaralandırma eklentisi



  • Stil 4

  #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 14px;padding: 5px 12px;margin-right:5px; color: #666; background-color:#eee;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#359BED;text-decoration:none;color: #fff;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#359BED;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;}

blogger sayfa numaralandırma eklentisi

  • Stil 5
 #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px; }
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 13px;padding: 5px 12px;margin-right:5px; color: #3E5801; background-color:#E0EDC1;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#FEF6DF;text-decoration:none;color: #E16800;}
#blog-pager .pagecurrent{font-weight:bold;color: #D25E71;background:#FFDEDF;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;}

blogger sayfa numaralandırma eklentisi

  • Stil 6
  #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px; }
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 13px;padding: 5px 12px;margin-right:5px; color: #AD0B00; background-color:#FAB001;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#DB4920;text-decoration:none;color: #fff;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#DB4920;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;}

blogger sayfa numaralandırma eklentisi

  • Stil 7
  #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px; }
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 12px;padding: 5px 12px;margin-right:5px; color: #222; background-color:#eee; border: 1px solid #EEEEEE;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#E5E5E5;text-decoration:none;color: #222;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#DB4920;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;}

blogger sayfa numaralandırma eklentisi

Page navigation stil kodlarından birini şablonlara ekledikten sonra sıra geldi gerekli Script kodlarını eklemeye.

Adım 4: </body> kodunu aratın.
Adım 5: Aşağıda ki scripti </body> 'nin üstüne yapıştırın

 <b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
  /*<![CDATA[*/
    var perPage=5;
    var numPages=6;
    var firstText ='İlk Sayfa';
    var lastText ='Son Sayfa';
    var prevText ='« Önceki';
    var nextText ='Sonraki »';
    var urlactivepage=location.href;
    var home_page="/";
  /*]]>*/
</script>
  <script src="https://blogkaynagi-sayfa-numaralandirma.googlecode.com/svn/blogkaynagi-numaraland%C4%B1rma.js"/>
</b:if>
</b:if>

Eklenti Ayarları 
Eklentiyi blogunuza ekledikten sonra isterseniz Mavi ile renklendirilmiş alanları değiştirebilirsiniz.
    var perPage=5;  -Sayfa başına gösterilecek konu sayısı
    var numPages=6
    var firstText ='İlk Sayfa';
    var lastText ='Son Sayfa';
    var prevText ='« Önceki';
    var nextText ='Sonraki »';


  • var perPage=5; Sayfa başına gösterilecek konu sayısı. Bu ayar ana sayfada gösterilecek kayıt sayısı ile aynı olmalıdır. Ayarlar > Yayınlar ve Yorumlar > En fazla şu kadar kayıt göster seçeneğinin den ana sayfada gösterilecek kayıtları ayarlayabilirsiniz.
  • var numPages=6; Sayfa numaralandırma da gösterilecek sayfa sayısı.
Adım 6: Şablonu Kaydet butonuna tıklayıp eklentinin keyfini çıkarabilirsiniz!