Header Ads

  • Breaking News

    Recent Post Widget with Thumbnail


    If your blog has lengthy posts, and you wish to assist your visitors to find your new posts swiftly, without spending stretch surveying throughout your blog seeking for your aged posts.
    You'll surely like this widget, and you’ll append it to your blog sidebar.



















    Step 1: Copy following code and past in HTML Widget in layout. 
    You'l just have to change this line http://mix--er.blogspot.com/ with your blog address or domain name.

    <div class="pipesContainer">
    
    <script src="http://pipes.yahoo.com/js/listbadge.js">{"pipe_id":"1a6640e2a78b2c6e736f2220529daae5","_btype":"list","pipe_params":{"URL":"http://mix--er.blogspot.com/feeds/posts/default"},
    
    "hideHeader":"false","height":"500","count": 5 }</script>
    
    <style type=text/css>
    
    .pipesContainer {
    
    margin:10px 0 10px 0;
    
    padding:0px;
    
    background:none;
    
    }
    
    .pipesHolder {
    
    padding: 0px!important;
    
    margin:10px 0px 0px 0px!important;
    
    }
    
    .pipesTitle {
    
    padding-top:0px!important;
    
    line-height:14px;
    
    font-weight:bold!important;
    
    }
    
    /*.pipesDescription,*/
    
    .pipesSmallthumb {
    
    display:none!important;
    
    }
    
    .pipesThumbnail img {
    
    border: none!important;
    
    width:82px !important;
    
    min-height: 72px !important
    
    }
    
    .pipesThumbnail {
    
    background: url(http://4.bp.blogspot.com/-LOOjBWkPDOU/TcgzCKbFr1I/AAAAAAAACmE/RkFjOZVgkoU/s400/blogger.gif) no-repeat top center;
    
    border: none!important;
    
    height:72px !important;
    
    width:72px !important;
    
    overflow:hidden;
    
    margin: 0px 8px 0px 0px!important;
    
    }
    
    .yba,.ybf {display:none!important;}
    
    .ygt {margin-top:10px;margin-bottom:10px;font-size:9px;float:left;}
    
    .ybr li  {background-color: transparent!important; border-bottom:1px #cccccc dotted; padding:0px 0px 10px 0px!important;}
    
    </style></div>
    

    If you want, you can change the height and / or number of posts, not hard at all, just find this line and add your own value.

    "height":"500","count": 5 

    Well, that's all in this post. Save Template and Happy Blogging yes



    No comments

    Post Top Ad

    Post Bottom Ad