Blogger, sidebar kenar çubuğuna sadece yazı etiketi kullanarak, R esimli, Y azı açıklamalı, R esim genişlik ve yükseklik ayarı, S layt po...
Blogger, sidebar kenar çubuğuna sadece yazı etiketi kullanarak, Resimli, Yazı açıklamalı, Resim genişlik ve yükseklik ayarı, Slayt post sayısı ve navigasyon alt numaratörlü, Önceki ve sonraki yazı butonlu, yazı Etiketleri ile Resimli Slayt Eklentisi. Blog’unuz için Json ve Java kodlama tekniği ile tasarlanmış, tüm yazı etiketlerinizden en popüler olanları veya dilediğiniz zaman sadece diğer etiket ismini değiştirmek suretiyle kullanabileceğiniz resimli slayt eklentisi için tek yapmanız gereken işlem birkaç link değişiminden ibarettir.
Blog’unuz da gadget olarak kullanacağınız slayt eklentisi oldukca hızlı olup, tüm slayt çalışmasını blog’unuzun RSS, feeds bağlantısından almakta olup, açılış hızını etkilemez. Diğer özelliklerinden biri de, resmin üzerine maus’u yanaştırıldığında slayt geçişi durup, kendini otomatikman bekleme pozisyonuna almasıdır. Maus’u yazı, resim üzerinden uzaklaştırdığınızda slayt çalışmasına devam eder.
Eklentinin özelleştirilmesi için yapmanız gereken çok fazla bir işlem mevcut değildir. Sadece blog isminizi (url) girerek, kullanmak istediğiniz etiketinizi seçeceksiniz. Blog şablonunda kullanılan genişlikler değişebildiğinden, genişlik ve yükseklik rakamlarını belirleminiz yeterli olacaktır. Blog yazılarınız için oluşturduğunuz etiketleri kullanarak her hafta farklı yazılarınızı okuyucularınıza tanıtabilirsiniz. Blog’unuz da bu kadar işlevsel bir eklentinin kullanılması tavsiyelerim arasında yer almaktadır.
Herhalde etiketlerden oluşan resimli açıklamalı, numaratör butonlu eklentinin nasıl çalıştığını merak etmişsinizdir ! Aşağıda canlı demosu verilen eklentiyi görebilmeniz için blog’a giriş yapın. Sidebar da, “ TEMA TASARIM İLE İLGİLİ MESAJLAR “ isimli gadget başlığını bularak inceleyin.
Resimli Son Yazılar Slayt Eklentisinin kurulumu :
1. Blogger kumanda paneline giriş yapın.
2. Yerleşim → Gadget ekle → Html/JavaScrip, gadget’ini açın ve aşağıdaki kodları ekleyin. Emeğe saygı duyuyor ve bana destek vermek istiyorsanız kod içindeki Gadget’i al link bağlantısını lütfen silmeyin.
<link rel="stylesheet" type="text/css" href="http://blogger-json-experiment.googlecode.com/svn/resources/blogger-feed-rotator-plugin/default-style.min.css"/>
<style type="text/css">
.slider-rotator {
width:300px;
height:400px;
}
</style>
<div id="slider-rotator" class="slider-rotator loading"></div>
<script type="text/javascript" src="http://blogger-json-experiment.googlecode.com/svn/resources/blogger-feed-rotator-plugin/blogger-feed-rotator.min.js"></script>
<script type="text/javascript">
makeSlider({
url: "http://adnanguney.blogspot.com",
numPost: 10,
newTabLink: false,
labelName: "Etiketinizinismi",
showDetail: true,
summaryLength: 240,
titleLength: "auto",
showThumb: true,
thumbWidth: 300,
squareThumb: true,
noThumb: "http://3.bp.blogspot.com/-vpCFysMEZys/UOEhSGjkfnI/AAAAAAAAFwY/h1wuA5kfEhg/s72-c/grey.png",
showNav: true,
navText: {
prev: "<",
next: ">"
},
containerId: "slider-rotator",
autoSlide: true,
interval: 6000,
speed: 1000,
hoverPause: true,
crossFade: false,
autoHeight: false
});
</script>
<div style="font-size:10px;text-align: center;">By <a href="http://guney59.blogspot.com/2015/01/blogger-yaz-etiketleri-ile-resimli.html"target="_blank"> Adnan Güney Gadgeti Al</a></div>
Özelleştirme :
width: 300 px : Gadget resim genişliği
height: 400 px : Gadget resim yüksekliği
http://adnanguney.blogspot.com : Blog (url) link’ini aynı formatta girin. tr uzantısı olmasın.
numPost : 10 : Görülmesini istediğiniz yazı adetini belirler.
labelName : "Etiketinizinismi" Kullanmak istediğiniz etiket yazınızı trayıcıda açın. Son etiket kısmını kopyalayın bu kısma yapıştırın. Tırnak ayraçlarını bozmamaya özen gösterin.
summaryLength : 240 : Yazı açıklama uzunluğunu belirler.
thumbWidth: 250 : Resmin genişliğini belirler.
ÖNEMLİ NOT : Blog’unuzda Jguery kütüphanesinin son güncelleşmiş linki yoksa aşağıdaki verilen etiketi bularak, hemen altına aşağıdaki link’i yapıştırın. Bu link olmadan yukarıdaki kodlar çalışmayacaktır.
Bulunacak etiket :
]]></b:skin>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js' type='text/javascript'/>
Hiç yorum yok
Fikirlerinizi bizimle yorumlarda paylaşabilirsiniz.