Showing posts with label Recent Post. Show all posts
Showing posts with label Recent Post. Show all posts

Apr 14, 2011

Tutorial Recent Post Bergerak

Hari tu, saya dah share bagaimana nak letak Scroll Box di Blog Archive, kali ni saya nak kongsikan pulak bagaimana mahu membuat recent post bergerak seperti kat fresh entries di sidebar blog Ma Belle Conway.. Dulu, kat blog ni pon ada sebelum saya bertukar template dan domain,  lepas je tukar terus hilang. Cuba pasang tak jadi jugak. Oleh kerana bakal bertukar template lagi sekali, maka saya biarkan aje dulu..hehehe

Macam biasa, pi kat Dashboard > Design > Page Elements > Add a Gadget.. Then pilih HTML/ JavaScript. Pehtu, hangpa copy code ni dan paste kat bahagian content..



        <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;

        margin-bottom:-20px;

        padding:0px 0px -20px 0px;

        height:350px;

        }

        #spylist ul{

        width:220px;

        overflow:hidden;

        float:center;

        list-style-type: none;

        padding: 0px 0px;

        margin:0px 0px;

        }

        #spylist li {

        width:200px;

        padding: 2px 2px;

        margin:0px 0px 5px 0px;

        list-style-type:none;

        float:center;

        height:70px;

        overflow: hidden;

        background:#FFFFFF;

        border:1px solid #ddd;

        }

        #spylist li a {

        text-decoration:none;

        color:#A32929;

        font-size:12px;

        height:0px;

        overflow:hidden;

        margin: 0px 0px;

        padding:0px 0px 0px 0px;

        }

        #spylist li img {

        float:left;

        margin-right:10px;

        background:#EFEFEF;

        border:0;

        }

        .spydate{

        overflow:hidden;

        font-size:0px;

        color:#0284C2;

        padding:2px 0px;

        margin:1px 0px 0px 0px;

        height:0px;

        font-family:Tahoma,Arial,verdana, sans-serif;

        }

        .spycomment{

        overflow:hidden;

        font-family:Tahoma,Arial,verdana, sans-serif;

        font-size:0px;

        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 = " ";

        showPostDate = false;

        showcomments = false;

        summaryPost = 40;

        summaryFontsize = 10;

        summaryColor = "#666";

        icon2 = " ";

        numposts = 20;

        home_page = "http://URL BLOG ANDA/";

        limitspy=4

        intervalspy=4000

        </script>

        <div id="spylist">

        <script src="http://sites.google.com/site/testingsahaja/recentpostslide.js?attredirects=0&d=1" type="text/javascript"></script>

        </div>

Part yang kaler merah tu, tukar ngan alamat blog uols. Yang kaler hijau tu pulak, uols leh tukar mengikut saiz dan kesesuaian sidebar blog uols. Yang kaler biru tu, numposts = 20 adalah jumlah post yang akan dipapar secara bergilir-gilir.. Yang limitspy = 4 tu pulak adalah jumlah paparan post pada masa yang sama..

Dah adjust comey-comey, preview pon dah berkenan di hati, maka uols leh save dan voila!! ^_*


 Sign up HB!Affiliate to enjoy free gift!

Kliklah sini dulu.. Thanks!!

Suka entri ini, meh picit button kat bawah ni:

Related Posts Plugin for WordPress, Blogger...