 |
| Tutorial Go Blog |
Cara Membuat Random Post Bergerak - Pada artikel kali ini, Tutorial Go Blog sudah mempersiapkan pembahasan mengenai bagaimana cara membuat dan juga cara memasang random post bergerak di website atau blog anda. Widget random post yang akan dibahas berbeda dengan pembuatan widget random post yang sebelumnya sudah dibagikan dalam artikel.
Dengan cara memasang random post bergerak di blog, maka anda bisa menampilkan postingan-postingan dengan secara acak, yang mana artinya postingan terdahulu anda akan dimunculkan kembali dan bahkan hingga disetiap halaman blog. Membuat widget random post sangat berbeda sekali dengan cara membuat widget popular post yang biasanya hanya sekedar menampilkan postingan atau artikel yang unggulan maupun populer saja.
Sebelum melanjutkan ke langkah berikutnya, silahkan copy dahulu kode script pembuatan random post bergerak tersebut yang ada dibawah ini. Jika sudah anda copy, segera langsung ke TKP...!!
<style type="text/css">
/*widget*/
#rp_plus_img{overflow:hidden;border:solid 1px #ddd;padding:10px; background-color:none;line-height:1.7em;}
#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:70px;padding:1px;list-style:none;}
#rp_plus_img a{color:#3366ff;}
#rp_plus_img .news-title{display:block;font-weight:normal !important;margin-bottom:5px;font-size:14px;}
#rp_plus_img .news-text{display:block;font-size:12px;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:60px;border-radius:4px;}
</style>
<!-- start -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/Brando07/share/master/random-post-bergerak-seocips.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 = 5;
var numchars = 0;
</script>
<script src="http://www.tutorialgo-blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>
<!-- /end -->
/*widget*/
#rp_plus_img{overflow:hidden;border:solid 1px #ddd;padding:10px; background-color:none;line-height:1.7em;}
#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:70px;padding:1px;list-style:none;}
#rp_plus_img a{color:#3366ff;}
#rp_plus_img .news-title{display:block;font-weight:normal !important;margin-bottom:5px;font-size:14px;}
#rp_plus_img .news-text{display:block;font-size:12px;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:60px;border-radius:4px;}
</style>
<!-- start -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/Brando07/share/master/random-post-bergerak-seocips.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 = 5;
var numchars = 0;
</script>
<script src="http://www.tutorialgo-blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>
<!-- /end -->
Keterangan :
- Untuk yang berwarna merah ialah kecepatan berpindahnya post.
- Untuk yang berwarna hijau ialah jumlah post yang ditampilkan.
- Untuk yang berwarna ungu ialah waktu berhenti setiap post.
- Untuk yang berwarna biru ialah alamat blog atau URL blog anda (Ganti).
Cara Buat Random Post Bergerak di Blog
1. Buka browser. Masuk ke alamat blogger.com. |
| Gambar 1 |
2. Buka dashboard blog dan tekan menu element "Tata Letak". Umumnya element yang disebutkan berada di samping kiri depan layar komputer anda.
 |
| Gambar 2 |
3. Selanjutnya, tekan tombol element "Tambahkan Gadget" dari sisi mana saja sesuka anda.
 |
| Gambar 3 |
4. Kemudian anda tekan tombol menu widget yang bertuliskan "HTML/JavaScript".
 |
| Gambar 4 |
5. Kode script yang diatas anda sudah copy sebelumnya, sekarang letakkan kode tersebut (Paste) ke dalam kolom kotak widget yang sudah disediakan. Kemudian tekan tombol "Simpan".
 |
| Gambar 5 |
6. Selanjutnya, lihat review pembuatan. Hasilnya akan membuat anda senang dan pengunjung pun semakin betah mengunjungi blog anda.
 |
| Hasil Gambar |
Demikian pembahasan tentang Cara Membuat Random Post Bergerak tersebut. Semoga anda berhasil melakukan langkah-langkah pembuatan random post bergerak ini. Dan setelah selesai anda membaca artikel di atas tersebut, anda bisa baca juga artikel lain misalnya seperti Cara Buat Tabel Sederhana di Blog. Terima kasih banyak...
