Cara Membuat Recent Post Berjalan di Blog

Cara Membuat Recent Post Berjalan di Blog - cara menjadikan artikel-artikel terbaru berjalan atau Trik/cara mengatur/supaya recent post bisa berjalan/bergerak atau cara agar recent post bisa berjalan pada/di blog.

Sebelumnya saya telah posting artikel mengenai cara membuat/memberi recent post di blog, tetapi itu recent post yang biasa. Pada artikel kali ini saya akan berbagi cara yang masih ada hubungannya dengan arttikel sebelumnya yaitu Cara Membuat Recent Post Berjalan di Blog. Dengan cara menampilkan recent post pada blog maka dapat mempermudah pengunjung untuk lebih banyak membaca artikel yang lainya, sama halnya dengan related post atau artikel terkait. selain hal itu blog akan kelihatan lebih menarik dan cantik. Lalu bagaimanakah cara agar recent post dapat berjalan di blog? Berikut ini adalah cara caranya::
  1. Pertama anda harus Login ke akun blogger anda
  2. Setelah itu anda Klik Tata Letak --> Tambah Gadget --> Pilih HTML/Java Script.
  3. Langkah selanjutnya anda copy kode/script dibawah ini kemudian paste kedalam kotak HTML tadi.
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">
    </script>
    <style media="screen" type="text/css">
    <!--
    #spylist {
    overflow:hidden;
    margin-top:5px;
    padding:0px 0px;
    height:350px;
    }
    #spylist ul{
    width:220px;
    overflow:hidden;
    list-style-type: none;
    padding: 0px 0px;
    margin:0px 0px;
    }
    #spylist li {
    width:208px;
    padding: 5px 5px;
    margin:0px 0px 5px 0px;
    list-style-type:none;
    float:none;
    height:70px;
    overflow: hidden;
    background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
    border:1px solid #ddd;
    }
    #spylist li a {
    text-decoration:none;
    color:#4B545B;
    font-size:11px;
    height:18px;
    overflow:hidden;
    margin:0px 0px;
    padding:0px 0px 2px 0px;
    }
    #spylist li img {
    float:left;
    margin-right:5px;
    background:#EFEFEF;
    border:0;
    }
    .spydate{
    overflow:hidden;
    font-size:10px;
    color:#0284C2;
    padding:2px 0px;
    margin:1px 0px 0px 0px;
    height:15px;
    font-family:Tahoma,Arial,verdana, sans-serif;
    }
    .spycomment{
    overflow:hidden;
    font-family:Tahoma,Arial,verdana, sans-serif;
    font-size:10px;
    color:#262B2F;
    padding:0px 0px;
    margin:0px 0px;
    }
    -->
    </style>
    <script language="JavaScript">
    imgr = new Array();
    imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
    showRandomImg = true;
    boxwidth = 255;
    cellspacing = 6;
    borderColor = "#232c35";
    bgTD = "#000000";
    thumbwidth = 70;
    thumbheight = 70;
    fntsize = 12;
    acolor = "#666";
    aBold = true;
    icon = " ";
    text = "comments";
    showPostDate = true;
    summaryPost = 40;
    summaryFontsize = 10;
    summaryColor = "#666";
    icon2 = " ";
    numposts = 20;
    home_page = "http://temukancara.blogspot.com/";
    limitspy=4
    intervalspy=4000
    </script>
    <div id="spylist">
    <script src="http://infonetmu.googlecode.com/files/recentpostthumbslideshow.js" type="text/javascript">
    </script></div>
  4. Langkah yang terakhir Simpan. kemudian lihatlah hasilnya
Catatan:
  • Pada Url yang berwarna merah anda ubah dengan Url blog anda.
  • Pada Angka yang berwarna biru itu menunjukkan jumlah post yang ingin di tampilkan
Demikianlah yang dapat saya sampaikan pada artikel kali ini mengenai cara membuat recent post berjalan di blog. Semoga apa yang saya sampaikan dapat bermanfaat buat anda. 

Komentar