Blogger kullanıcıları için tasarlanmış rastgele yazılar butonu
her tıklamada blogunuzda bulunan yazılar içerisinden rastgele bir yazı
gösterir.Blogunuzun içeriğine göre rastgele yayın gösterim butonuna isim
verebilirsiniz.Örneğin yemek tarifleri blogunuz mu var? Rastgele yemek tarifi,oyun blogunuz mu var? rastgele oyun oyna,film blogunuz mu var? rastgele film izle vb.blogger rastgele yazılar butonunu biz verelim ismini siz koyun diyelim ve blogger
rastgele yazılar butonunu blogunuza nasıl ekliyebileceğinizi anlatalım:
- Blogger Hesabımızla Giriş Yapıyoruz.
- Kumanda Paneli>Yerleşim>Gadget Ekle>Html/Javascript yolunu takip edip açılan gadget içerisine aşağıdaki kodu yapıştırıyoruz.
<!-- Start Gadget Code Random Post Buton http://www.blogmimari.blogspot.com -->
<div id='myLuckyPost'></div> <script type='text/javascript'> function showLucky(root){ var feed = root.feed; var entries = feed.entry || []; var entry = feed.entry[0]; for (var j = 0; j < entry.link.length; ++j){if (entry.link[j].rel == 'alternate'){window.location = entry.link[j].href;}}} function fetchLuck(luck){ script = document.createElement('script'); script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); } function feelingLucky(root){ var feed = root.feed; var total = parseInt(feed.openSearch$totalResults.$t,10); var luckyNumber = Math.floor(Math.random()*total);luckyNumber++; a = document.createElement('a'); a.href = '#random'; a.rel = luckyNumber; a.onclick = function(){fetchLuck(this.rel);}; a.innerHTML = 'Rastgele Bir Yazı Göster!'; document.getElementById('myLuckyPost').appendChild(a); } </script> <script src='/feeds/posts/summary?max-results=0&alt=json-in-script&callback=feelingLucky'></script>
<style type='text/css'>
@import url( 'http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:700' );
#myLuckyPost a {
position: relative;
color: rgba(255,255,255,1);
text-decoration: none;
background-color: rgba(219,87,5,1);
font-family: 'Yanone Kaffeesatz';
font-weight: 700;
font-size: 25px;
display: block;
padding: 4px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px transparent;
-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px transparent;
box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px transparent;
margin: 10px auto;
width: 250px;
text-align: center;
-webkit-transition: all .1s ease;
-moz-transition: all .1s ease;
-ms-transition: all .1s ease;
-o-transition: all .1s ease;
transition: all .1s ease;
}
#myLuckyPost a:active {
-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
position: relative;
top: 6px;
}
</style>
<!-- End Gadget Code Random Post Buton http://www.blogmimari.blogspot.com -->
Kod İçerisinde:
Rastgele Bir Yazı Göster!:Buraya buton içerisinde görüntülenmek istediğiniz metni yazın.font-size:25px ;Buton içerisindeki metnin boyutu.
width:250px ;buton genişlik değeri.
Gerekli düzenlemeleri yaptıktan sonra gadgeti kaydedip blogger rastgele yazı göster butonu gadgetini görüntülemek istediğimiz yere sürükleyip bırakıyoruz.
2 yorum:
Tesekkür ederim bilgi icin, uygulamasi ne kadar kolaymis. Yalniz renk dgistirmeyi nasil yapabiliriz. Mesela buton beyaz ve yazi siyah olacaksa nasil bir degisiklik olmali?
saolasın benzerini kullanıyorum
www.ferhatbayram.blogspot.com
Yorum Gönder