Zeki Can - WordPress

  Blogger, Javascript

Blogger Rastgele Yazı Gösterme Kodu

Blogger kullanan arkadaşlar için en büyük sorunlardan biride temalarının rastgele yazı gösterme özelliğini içermemesidir. Arkadaşların bazıları temalarını çok sevdiğinden dolayı tema değişikliğine gitmek yerine temasına bu özelliği kod ile katmayı tercih etmekte.

Blogger Ratgele Yazıları gösterme kodunu eklemek için öncelikle Blogger Panelimize giriş yapalım. Sonrasında

Kumanda Panelinden Yerleşim>Gadget Ekle>Html/Javascript yolunu takip edelim.

Açılan pencereye altta verdiğim kodları yapıştıralım.

Kodları yapıştırdıktan sonra buton içinde yazan yazıyı değiştirmek isterseniz kod üzerinde Ctrl + F tuşuna basarak arama kutusunu açın.

Rastgele Bir Yazı Göster! diyerek aratın. Bulduğunuz yerde değişiklik yapıp istediğinizi yazabilirsiniz.

Buton içindeki metin boyutunda değişiklik yapmak isterseniz kod üzerinde Ctrl + F tuşuna basarak arama kutusunu açın. Kodun içine font size : 25px yazın burada ki 25 değerini arttırır iseniz butonun içindeki metinin boyu artar, azaltır iseniz de azalır.

Butonun genişlik değerini değiştirmek isterseniz kod üzerinde Ctrl + F tuşuna basarak arama kutusunu açın. Kodun içine width : 250px yazın burada ki 250 değerini arttırır iseniz butonun genişliği artar, azaltır iseniz de azalır.

<!-- Start Gadget Code Random Post Buton https://zekican.net/ -->
<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://teknolojikblog.com/ -->

Kısaca Kod İçerisinde Düzenlemek İsteyebileceğiniz Kısımlar;

Rastgele Bir Yazıyı Göster! : Buraya buton içinde gözükmesini istediğiniz başlığı yazın.
font size : 25px : Buton içindeki metin boyutunu belirtir.
width : 250px : Butonun genişlik değerini belirler.

  Benzer Yazılar

  Yorumlar

  Kategoriler

  Arama Yap

  Son yorumlar