Powered by Blogger.

Sunday, April 9, 2017

Cara membuat Recent Post Bergerak di Blog (SlideShow)

Bismillahirrohmanirrohiim
Kalau anda Perhatikan di blog saya sebelah kanan, anda akan menemui Widget yang berbentuk bingkai dan berisi Judul artikel, namun Menariknya judul artikel tersebut bisa bergerak (Animasi) ke bawah. biasanya hal ini di sebut (SlidesShow).
Pada posting ini saya akan berbagi tentang Cara membuat Recent Post Bergerak di Blog (SlideShow).
perlu anda ketahui bahwa artikel yang ada di slideshow tersebut secara otomatis menampilkan  judul postingan Terbaru/Recent Post.


Oke silahkan di simak tutorial di bawah ini :

1. Masuk ke account Blogger anda.
2. Pilih Tata Letak. 
3. Silahkan Pilih Add Gadget/Tambahkan Gadget.
4. Pilih HTML/JavaScript.
5. Copy Paste Kode Di bawah ini :

<style type="text/css">
    #rp_plus_img{height:377px;}
    #rp_plus_img li {height:60px;padding:5px;list-style:none;
    background-color:#ffffff;
    border:solid 1px #000000;}
    #rp_plus_img a{color:#00000;}
    #rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
    text-align:justify;
    -moz-border-radius: 5px;}
    #rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
 
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript">
</script>
<script type="text/javascript">
    var speed = 1500;
    var pause = 3500;
    $(document).ready(function(){
    rpnewsticker();
    interval = setInterval(rpnewsticker, pause);
    });
</script>
<ul id="rp_plus_img"><script>
    var numposts = 5;
    var numchars = 0;
</script>     <script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script>     </ul>
<small><a href="http://cahkaliandong.blogspot.com/2017/04/cara-membuat-recent-post-bergerak-di.html" target="_blank">get this widget here</a></small>

Ditulis Oleh : Raja unlock // 8:08 AM
Kategori:

Comments
0 Comments

0 comments:

Post a Comment

 

Site Info