recent post cool colorful and easy to make

This time I want to share how to make a recent post colors are super cool and rarely found ..
recent post is usually difficult in getting and if there is not active most of the code ....
maybe it had ever tasted. and he immediately wrote a recent post top coolest ...

advantages :

• simple
• colorful 
• responsive
• easy to use
• handsome
• cool

recent post beautiful recent post colored

source www.berwirausaha.anet

<div id="recentpostsae"></div>
    <div id="recentpostnavfeed"></div>
    <script type='text/javascript'>
    //<![CDATA[
        var numfeed = 7;
        var startfeed = 0;
        var urlblog = "http://www.berwirausaha.net";
        var charac = 0;
        var urlprevious, urlnext;
    function seocipsfeed(e,t){for(var n=e.split("<"),r=0;r<n.length;r++)-1!=n[r].indexOf(">")&&(n[r]=n[r].substring(n[r].indexOf(">")+1,n[r].length));return n=n.join(""),n=n.substring(0,t-1)}function showrecentpostsae(e){var t,n,r,a,i,s="";urlprevious="",urlnext="";for(var l=0;l<e.feed.link.length;l++)"previous"==e.feed.link[l].rel&&(urlprevious=e.feed.link[l].href),"next"==e.feed.link[l].rel&&(urlnext=e.feed.link[l].href);for(var d=0;d<numfeed&&d!=e.feed.entry.length;d++){t=e.feed.entry[d],n=t.title.$t;for(var l=0;l<t.link.length;l++)if("alternate"==t.link[l].rel){r=t.link[l].href;break}i="content"in t?t.content.$t:"summary"in t?t.summary.$t:"",a="media$thumbnail"in t?t.media$thumbnail.url:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfUScD1vZYWYicO_IPAxwSE1a4NaAneLicnEFYnYVs4hbOoGXAT1OCS0ZdbH-tl38E2ia5V4m5C_DeW6XM9YMMM8PgVSBsb8Sr8ga3fPPLJRaQPND02ufrtWI401mp_khR9Z5D_x5tdvC-/s1600/no-image.png",s+="<div class='recentpostel'>",s+="<a href='"+r+"' target='_blank'><img src='"+a+"' /></a>",s+="<h6><a href='"+r+"'>"+n+"</a></h6>",s+="<p>"+seocipsfeed(i,charac)+"...</p>",s+="</div>"}document.getElementById("recentpostsae").innerHTML=s,s="",s+=urlprevious?"<a href='javascript:navigasifeed(-1);' class='previous'>Previous</a>":"<span class='noactived previous'>Previous</span>",s+=urlnext?"<a href='javascript:navigasifeed(1);' class='next'>Next</a>":"<span class='noactived next'>Next</span>",s+="<a href='javascript:navigasifeed(0);' class='home'>Home</a>",document.getElementById("recentpostnavfeed").innerHTML=s}function navigasifeed(e){var t,n;-1==e?(t=urlprevious.indexOf("?"),n=urlprevious.substring(t)):1==e?(t=urlnext.indexOf("?"),n=urlnext.substring(t)):n="?start-index=1&max-results="+numfeed+"&orderby=published&alt=json-in-script",n+="&callback=showrecentpostsae",incluirscript(n)}function incluirscript(e){1==startfeed&&removerscript(),document.getElementById("recentpostsae").innerHTML="<div id='recentpostload'>
</div>",document.getElementById("recentpostnavfeed").innerHTML="";var t=urlblog+"/feeds/posts/default"+e,n=document.createElement("script");n.setAttribute("type","text/javascript"),n.setAttribute("src",t),n.setAttribute("id","seocipslabel"),document.getElementsByTagName("head")[0].appendChild(n),startfeed=1}function removerscript(){var e=document.getElementById("seocipslabel"),t=e.parentNode;t.removeChild(e)}onload=function(){navigasifeed(0)};
    //]]>
    </script>
    <style>
    #recentpostnav{border:1px solid #000;width:100%;margin:0 auto;}
    #recentpostsae{margin:0}
    .recentpostel{background:#333;display:block;border:2px solid #111;margin:5px 0;padding:10px;height:79px;}
    .recentpostel img{background:#222;padding:5px;float:left;height:70px;margin-right:8px;width:70px;border-radius:5px;}
    .recentpostel h6,.recentpostel h6 a{text-decoration:none;font-size:14px!important;font-weight:700!important;margin:0;color:#000;}
    .recentpostel:nth-child(1n+0) {background: #F49A9A;}
    .recentpostel:nth-child(2n+0) {background: #FCD092;}
    .recentpostel:nth-child(3n+0) {background: #81F7BE;}
    .recentpostel:nth-child(4n+0) {background: #E1EFA0;}
    .recentpostel:nth-child(5n+0) {background: #B1DAEF;}
    #recentpostload{color:#888;font-family:Tahoma;font-size:100px;letter-spacing:-10px;text-align:center;text-shadow:-5px 0 1px #444;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDMLA0KoJWtJBFqISwyWuKSKBa-cOn2oYEljdT1ikfoCotSD7_W5rtR5oHoLY_EqloM9HXtszJ3jWAFiA_M7NNMB0mRu3eYKFj18NnLwNpENXQzxzwdL7trEkQ9s-AjIG6dmfcH6r040Ht/s1600/loader.gif) 50% 50% no-repeat #F49A9A;height:470px;border:1px solid #111}
    #recentpostnavfeed{border:2px solid #000;color:#111;background:#F49A9A;font-family:Verdana;font-size:12px;text-align:center;margin:0}
    #recentpostnavfeed:hover{background-color:#FCD092;}
    #recentpostnavfeed a{color:#111!important;font-family:Tahoma!important;font-size:12px!important;font-weight:400!important;display:block;padding:5px 10px}
    #recentpostnavfeed span{padding:5px 10px}
    #recentpostnavfeed .next{float:right}
    #recentpostnavfeed .previous{float:left}
    #recentpostnavfeed .home{text-align:center}
    #recentpostnavfeed a:hover,#recentpostnavfeed span.noactived{color:transparant!important}
    </style>

 how to use it:

1. sign in in your daskboard blogger
2. layout - add a gadget
3. html/java script
4. just paste the code above and dont forgate replace http://www.berwirausaha.net with your blog url
5. save.
6. done

 for the demo here