English French German Spain Italian Dutch Russian Portuguese Japanese Korean Arabic Chinese Simplified
Yazılarımız Hakkında Yorum Yazmayı Unutmayın:)!!!

28 Temmuz 2012 Cumartesi

Blogger Rastgele Yazı Butonu Oluştur

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:

  1. Blogger Hesabımızla Giriş Yapıyoruz.
  2. 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

................................Reklam...............................

 

BlogMimarını Facebookta Takibedin

Bu Siteye Katılın

Blog Mimarını Twitterda Takibedin