Cara Membuat Random Post Disertai Gambar Dengan Efek Bergerak

12:36:00
Cara Membuat Random Post Disertai Gambar Dengan Efek Bergerak

Selamat datang agan atau aganwati kali ini bertemu dengan saya pada kesempatan kali ini, kali ini saya akan berbagi tentang tips blogging yaitu cara membuat widget random posts disertai thumbnail atau dikenal dengan gambar dengan efek bergerak. Widget random post disertai gambar dengan efek bergerak merupakan widget pada blog yang menampilkan artikel-artikel pilihan pada blog secara acak serta pada widget tersebut ditampilkan juga gambar artikel disertai dengan efek yang bergerak secara vertikal kebawah.


Widget ini sangatlah efektif untuk menjaring pengunjung yang datang karena, bisa saja widget tersebut menampilkan daftar artikel yang menurut pengunjung menarik untuk dikunjungi. Dengan begitu akan sangat tepat sekali bagi anda yang ingin meningkatkan jumlah trafik yang anda miliki dengan memasang widget tersebut.


Berikut tutorial untuk memasang widget random post with thumbnail dengan efek bergerak :


Demo

Cara Membuat Random Post Disertai Thumbnail / Gambar Dengan Efek Bergerak


Langkah

1. Login ke dashboard blog anda masing-masing,

2. Pada menu dashboard pilih menu tata letak,

3. Setelah itu pilih tambahkan gadget,

4. Setelah itu pilih menu html / javascript,

5. Setelah itu copy script berikut ini,

 <div style="margin-bottom: 15px;">
<style type="text/css">
#rp_plus_img{height:640px;overflow:hidden;border:solid 0px #585858;padding:1px 5px 14px 1px;background-color:none;}
#rp_plus_img ul{list-style-type:none;margin:0;padding:0}
#rp_plus_img li{border:0; margin:0; padding:0; list-style:none;}
#rp_plus_img li{height:130px;padding:1px;list-style:none;}
#rp_plus_img a{color:#3366ff;}
#rp_plus_img .news-title{display:block;font-weight:bold !important;margin-bottom:5px;font-size:14px;}
#rp_plus_img .news-text{display:block;font-size:11px;font-weight:normal !important;color:#282828;text-align:justify;}
#rp_plus_img img{float:left;margin-right:10px;padding:1px;border:solid 1px #cccccc;width:60px;height:65px;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://slide-down-recent.googlecode.com/files/Slide%20Down%20Recent%20Post.js"></script>
<script type="text/javascript">
var speed = 400;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img">
<script style="text/javascript">
var numposts = 60;
var numchars = 0;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>
</div> 

6. Paste ke kolom html / javascript yang sudah tersedia,

7. Simpan, dan lihat hasilnya.



Demikian artikel tentang cara membuat random post disertai gambar dengan efek bergerak, semoga bermanfaat, jangan lupa bagikan serta tinggalkan komentar anda, terima kasih.

Share this

I'm CEO & Founder in http://caritema.com & http://renaldyways.blogspot.com/


Artikel Menarik Lainnya

Next Article
Next Post
Previous Article
Previous Post
Cara style text di komentar Disqus dan Blogger:
  • Untuk menulis huruf bold silahkan gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic silahkan gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline silahkan gunakan <u></u>.
  • Untuk menulis huruf strikethrought silahkan gunakan <strike></strike>.
  • Untuk menulis kode HTML silahkan gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silahkan parse dulu kodenya pada kotak parser di bawah ini.
  • Untuk menggunakan emoji di bawah ini cukup copy kode tersebut dan beri jarak 1 spasi untuk menampilkan emoji pada kolom komentar Blogger.
Parser Kode
FAQ
Emotikon

Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

2 Comments

Obat Migren 13 April 2015 at 10:37

Terimakasih banyak sob, mantab nih tutornya.. siip

Renaldy Ramadani 15 April 2015 at 17:56

yoi bro :2thumbup