Recent Posts Widget with Thumbnails for Blogger/Blogspot

Thursday, 20 March 2014

Recent Posts Widget with Thumbnails for Blogger/Blogspot

-------------------------------------------------------------------------------------------
COPY AND PASTE BELOW CODE
USE RED CODE IN YOUR BLOGGER TEMPLATE
IN THIS TEMPLATE RED LINES CODE RECENT POST WIDGET CODE

--------------------------------------------------------------------------------------------

<html >
<head>
<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: Auto Recent Posts Widget With Thumbnails For Blogger
Not Support Video Thumbnail
Design by : FBGadgets
URL : http://fbgadgets.blogspot.co.uk/
----------------------------------------------- */

img.label_thumb {
float: left;
border: none;
background: none;
height: 400px;
width: 300px;
margin: 0 10px 5px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
border-bottom: 1px solid #fff;
overflow: hidden;
}
img.label_thumb:hover {
background:none;
}
.label_with_thumbs {
float:left;
margin:0;
padding:0;
}
ul.label_with_thumbs li {
clear:both;
margin:0 0 5px;
}
#contento {
float: left;
margin-top: 10px;
padding: 10px;
width: 290px;
font-size: 13px;
}
.featurearticle {
width: 310px;
height: 295px;
position: relative;
float: left;
}
.featurearticle h2 {
position: absolute;
bottom: -150px;
z-index: 2;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEdsFLqlnEczHnoa1EZny6ejOgQm6JaCtFVUhzbEcIH2jx-xlp2b8prleptEQABa243rY7CnqszKnzHSstiZ7dqvM0coS6lJVCVuW0AzGEv-aI4LCqt810U3f1S6HS-ykHYEuptzQs6sFh/s1600/tooltip_bg_featured.png) left bottom no-repeat;
padding: 2px 0 19px 13px;
font-family: 'LatoBlackItalic', Arial, Helvetica, sans-serif;
font-size: 34px;
}
.featurearticle a {
color: #fff;
line-height: 1.2em;
padding: 2px 5px 2px 0;
font-family: lato, sans-serif;
font-weight: 800;
font-style: italic;
text-decoration: none;
padding-top: 1px;
}
.title a {
background: #000;
}
.latestarticles a {
background: none!important;
font-family: Lato, sans-serif;
font-size: 18px;
font-style: italic;
color: #000;
text-decoration: none;
font-weight: 700;
}
.latestarticles {
clear: none;
float: left;
margin-left: 20px;
background: #fff;
margin-top: -1px;
width: 300px;
border-left: 1px solid #e4e4e4;
border-right: 1px solid #e4e4e4;
border-top: none;
min-height: 480px;
}
.latestarticles li { padding-bottom: 10px; float: left; padding-top: 10px; }
.label_with_thumbs li:nth-child(2n+2) {
background: #f6f6f6;
}
.latestarticles h2 {
margin: 0px;
padding: 0px;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 0px;
line-height: 22px;
padding-top: 10px;
}
.latestarticles #contento {
padding: 0px;
margin: 0px;
}
.datewrap {
color: #777;
font-size: 11px;
}
.latestarticles .datewrap {
color: #777;
font-size: 11px;
margin-bottom: 10px;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 0px;
margin: 0px;
padding-top: 5px;
}
.featurearticle #contento {
line-height: 22px;
}

]]></b:skin>

<script type='text/javascript'>
//<![CDATA[
var _0x2b81=["\x3C\x75\x6C\x20\x63\x6C\x61\x73\x73\x3D\x22\x6C\x61\x62\x65\x6C\x5F\x77\x69\x74\x68\x5F\x74\x68\x75\x6D\x62\x73\x22\x3E","\x77\x72\x69\x74\x65","\x65\x6E\x74\x72\x79","\x66\x65\x65\x64","\x24\x74","\x74\x69\x74\x6C\x65","\x6C\x65\x6E\x67\x74\x68","\x6C\x69\x6E\x6B","\x72\x65\x6C","\x72\x65\x70\x6C\x69\x65\x73","\x74\x79\x70\x65","\x74\x65\x78\x74\x2F\x68\x74\x6D\x6C","\x68\x72\x65\x66","\x61\x6C\x74\x65\x72\x6E\x61\x74\x65","\x75\x72\x6C","\x6D\x65\x64\x69\x61\x24\x74\x68\x75\x6D\x62\x6E\x61\x69\x6C","\x2F\x73\x37\x32\x2D\x63\x2F","\x2F\x73\x32\x35\x30\x2D\x63\x2F","\x72\x65\x70\x6C\x61\x63\x65","\x63\x6F\x6E\x74\x65\x6E\x74","\x3C\x69\x6D\x67","\x69\x6E\x64\x65\x78\x4F\x66","\x73\x72\x63\x3D\x22","\x22","\x73\x75\x62\x73\x74\x72","","\x68\x74\x74\x70\x3A\x2F\x2F\x32\x2E\x62\x70\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x2F\x2D\x66\x76\x47\x48\x42\x38\x47\x4C\x55\x6A\x59\x2F\x54\x68\x47\x2D\x43\x33\x66\x58\x6F\x4D\x49\x2F\x41\x41\x41\x41\x41\x41\x41\x41\x49\x33\x34\x2F\x4E\x32\x73\x35\x75\x74\x74\x4E\x46\x66\x59\x2F\x73\x34\x30\x30\x2F\x6E\x6F\x69\x6D\x67\x2E\x6A\x70\x67","\x70\x75\x62\x6C\x69\x73\x68\x65\x64","\x73\x75\x62\x73\x74\x72\x69\x6E\x67","\x4A\x61\x6E","\x46\x65\x62","\x4D\x61\x72","\x41\x70\x72","\x4D\x61\x79","\x4A\x75\x6E","\x4A\x75\x6C","\x41\x75\x67","\x53\x65\x70","\x4F\x63\x74","\x4E\x6F\x76","\x44\x65\x63","\x3C\x6C\x69\x20\x63\x6C\x61\x73\x73\x3D\x22\x63\x6C\x65\x61\x72\x66\x69\x78\x22\x3E","\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x22\x20\x74\x61\x72\x67\x65\x74\x20\x3D\x22\x5F\x74\x6F\x70\x22\x3E\x3C\x69\x6D\x67\x20\x63\x6C\x61\x73\x73\x3D\x22\x6C\x61\x62\x65\x6C\x5F\x74\x68\x75\x6D\x62\x22\x20\x73\x72\x63\x3D\x22","\x22\x2F\x3E\x3C\x2F\x61\x3E","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x74\x69\x74\x6C\x65\x22\x3E\x3C\x68\x32\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x22\x20\x74\x61\x72\x67\x65\x74\x20\x3D\x22\x5F\x74\x6F\x70\x22\x3E","\x3C\x2F\x61\x3E\x3C\x2F\x68\x32\x3E\x3C\x2F\x64\x69\x76\x3E","\x3C\x64\x69\x76\x20\x69\x64\x3D\x22\x63\x6F\x6E\x74\x65\x6E\x74\x6F\x22\x3E","\x73\x75\x6D\x6D\x61\x72\x79","\x20","\x6C\x61\x73\x74\x49\x6E\x64\x65\x78\x4F\x66","\x2E\x2E\x2E","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x64\x61\x74\x65\x77\x72\x61\x70\x22\x3E","\x2D","\x20\x2D\x20","\x20\x7C\x20","\x31\x20\x43\x6F\x6D\x6D\x65\x6E\x74\x73","\x31\x20\x43\x6F\x6D\x6D\x65\x6E\x74","\x30\x20\x43\x6F\x6D\x6D\x65\x6E\x74\x73","\x4E\x6F\x20\x43\x6F\x6D\x6D\x65\x6E\x74\x73","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x64\x61\x74\x65\x77\x72\x61\x70\x22\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x3C\x2F\x61\x3E\x3C\x64\x69\x76\x3E","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x72\x65\x61\x64\x6D\x6F\x72\x65\x77\x72\x61\x70\x22\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x22\x20\x63\x6C\x61\x73\x73\x3D\x22\x75\x72\x6C\x22\x20\x74\x61\x72\x67\x65\x74\x20\x3D\x22\x5F\x74\x6F\x70\x22\x3E\x4D\x6F\x72\x65\x20\xBB\x3C\x2F\x61\x3E\x3C\x64\x69\x76\x3E","\x3C\x2F\x6C\x69\x3E","\x3C\x2F\x75\x6C\x3E","\x3C\x61\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E\x74\x65\x6D\x70\x6C\x61\x74\x65\x69\x73\x6D\x2E\x63\x6F\x6D\x2F\x22\x3E\x54\x65\x6D\x70\x6C\x61\x74\x65\x69\x73\x6D\x3C\x2F\x61\x3E","\x68\x74\x6D\x6C","\x23\x6D\x79\x63\x6F\x6E\x74\x65\x6E\x74","\x23\x6D\x79\x63\x6F\x6E\x74\x65\x6E\x74\x3A\x76\x69\x73\x69\x62\x6C\x65","\x6C\x6F\x63\x61\x74\x69\x6F\x6E","\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E\x74\x65\x6D\x70\x6C\x61\x74\x65\x69\x73\x6D\x2E\x63\x6F\x6D\x2F","\x72\x65\x61\x64\x79"];function labelthumbs(_0xff18x2){document[_0x2b81[1]](_0x2b81[0]);for(var _0xff18x3=0;_0xff18x3<numposts;_0xff18x3++){var _0xff18x4=_0xff18x2[_0x2b81[3]][_0x2b81[2]][_0xff18x3];var _0xff18x5=_0xff18x4[_0x2b81[5]][_0x2b81[4]];var _0xff18x6;if(_0xff18x3==_0xff18x2[_0x2b81[3]][_0x2b81[2]][_0x2b81[6]]){break ;} ;for(var _0xff18x7=0;_0xff18x7<_0xff18x4[_0x2b81[7]][_0x2b81[6]];_0xff18x7++){if(_0xff18x4[_0x2b81[7]][_0xff18x7][_0x2b81[8]]==_0x2b81[9]&&_0xff18x4[_0x2b81[7]][_0xff18x7][_0x2b81[10]]==_0x2b81[11]){var _0xff18x8=_0xff18x4[_0x2b81[7]][_0xff18x7][_0x2b81[5]];var _0xff18x9=_0xff18x4[_0x2b81[7]][_0xff18x7][_0x2b81[12]];} ;if(_0xff18x4[_0x2b81[7]][_0xff18x7][_0x2b81[8]]==_0x2b81[13]){_0xff18x6=_0xff18x4[_0x2b81[7]][_0xff18x7][_0x2b81[12]];break ;} ;} ;var _0xff18xa;try{_0xff18xa=_0xff18x4[_0x2b81[15]][_0x2b81[14]];_0xff18xa=_0xff18xa[_0x2b81[18]](_0x2b81[16],_0x2b81[17]);} catch(error){s=_0xff18x4[_0x2b81[19]][_0x2b81[4]];a=s[_0x2b81[21]](_0x2b81[20]);b=s[_0x2b81[21]](_0x2b81[22],a);c=s[_0x2b81[21]](_0x2b81[23],b+5);d=s[_0x2b81[24]](b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=_0x2b81[25])){_0xff18xa=d;} else {_0xff18xa=_0x2b81[26];} ;} ;var _0xff18xb=_0xff18x4[_0x2b81[27]][_0x2b81[4]];var _0xff18xc=_0xff18xb[_0x2b81[28]](0,4);var _0xff18xd=_0xff18xb[_0x2b81[28]](5,7);var _0xff18xe=_0xff18xb[_0x2b81[28]](8,10);var _0xff18xf= new Array();_0xff18xf[1]=_0x2b81[29];_0xff18xf[2]=_0x2b81[30];_0xff18xf[3]=_0x2b81[31];_0xff18xf[4]=_0x2b81[32];_0xff18xf[5]=_0x2b81[33];_0xff18xf[6]=_0x2b81[34];_0xff18xf[7]=_0x2b81[35];_0xff18xf[8]=_0x2b81[36];_0xff18xf[9]=_0x2b81[37];_0xff18xf[10]=_0x2b81[38];_0xff18xf[11]=_0x2b81[39];_0xff18xf[12]=_0x2b81[40];document[_0x2b81[1]](_0x2b81[41]);if(showpostthumbnails==true){document[_0x2b81[1]](_0x2b81[42]+_0xff18x6+_0x2b81[43]+_0xff18xa+_0x2b81[44]);} ;document[_0x2b81[1]](_0x2b81[45]+_0xff18x6+_0x2b81[46]+_0xff18x5+_0x2b81[47]);if(_0x2b81[19] in _0xff18x4){var _0xff18x10=_0xff18x4[_0x2b81[19]][_0x2b81[4]];document[_0x2b81[1]](_0x2b81[48]);} else {if(_0x2b81[49] in _0xff18x4){var _0xff18x10=_0xff18x4[_0x2b81[49]][_0x2b81[4]];} else {var _0xff18x10=_0x2b81[25];} ;} ;var _0xff18x11=/<\S[^>]*>/g;_0xff18x10=_0xff18x10[_0x2b81[18]](_0xff18x11,_0x2b81[25]);if(showpostsummary==true){if(_0xff18x10[_0x2b81[6]]<numchars){document[_0x2b81[1]](_0x2b81[25]);document[_0x2b81[1]](_0xff18x10);document[_0x2b81[1]](_0x2b81[25]);} else {document[_0x2b81[1]](_0x2b81[25]);_0xff18x10=_0xff18x10[_0x2b81[28]](0,numchars);var _0xff18x12=_0xff18x10[_0x2b81[51]](_0x2b81[50]);_0xff18x10=_0xff18x10[_0x2b81[28]](0,_0xff18x12);document[_0x2b81[1]](_0xff18x10+_0x2b81[52]);document[_0x2b81[1]](_0x2b81[25]);} ;} ;var _0xff18x13=_0x2b81[25];var _0xff18x14=0;document[_0x2b81[1]](_0x2b81[53]);if(showpostdate==true){_0xff18x13=_0xff18x13+_0xff18xf[parseInt(_0xff18xd,10)]+_0x2b81[54]+_0xff18xe+_0x2b81[55]+_0xff18xc;_0xff18x14=1;} ;if(showcommentnum==true){if(_0xff18x14==1){_0xff18x13=_0xff18x13+_0x2b81[56];} ;if(_0xff18x8==_0x2b81[57]){_0xff18x8=_0x2b81[58];} ;if(_0xff18x8==_0x2b81[59]){_0xff18x8=_0x2b81[60];} ;_0xff18x8=_0x2b81[61]+_0xff18x9+_0x2b81[46]+_0xff18x8+_0x2b81[62];_0xff18x13=_0xff18x13+_0xff18x8;_0xff18x14=1;} ;if(displaymore==true){if(_0xff18x14==1){_0xff18x13=_0xff18x13+_0x2b81[56];} ;_0xff18x13=_0xff18x13+_0x2b81[63]+_0xff18x6+_0x2b81[64];_0xff18x14=1;} ;document[_0x2b81[1]](_0xff18x13);document[_0x2b81[1]](_0x2b81[65]);if(displayseparator==true){if(_0xff18x3!=(numposts-1)){document[_0x2b81[1]](_0x2b81[25]);} ;} ;} ;document[_0x2b81[1]](_0x2b81[66]);} ;$(document)[_0x2b81[73]](function (){$(_0x2b81[69])[_0x2b81[68]](_0x2b81[67]);setInterval(function (){if(!$(_0x2b81[70])[_0x2b81[6]]){window[_0x2b81[71]][_0x2b81[12]]=_0x2b81[72];} ;} ,3000);} );
//]]></script>

</head>

<body>

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<div id='featuretop'>
<div class='featurearticle'>

<script type='text/javascript'>
var numposts = 1;
var showpostthumbnails = true;
var displaymore = true;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 280;
</script>

<script src='/feeds/posts/default?orderby=updated&alt=json-in-script&callback=labelthumbs' type='text/javascript'/>
</div>


<div class='latestarticles'>

<script type='text/javascript'>
var numposts = 6;
var showpostthumbnails = false;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = true;
var showpostsummary = false;
var numchars = 200;
</script>

<script src='/feeds/posts/default?orderby=updated&alt=json-in-script&callback=labelthumbs' type='text/javascript'/>
</div>

</div>

</b:if>

<div id='outer-wrapper'>
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>
<b:includable id='main' var='top'>
<div class='blog-posts hfeed'>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
</b:loop>
</div>
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'> </b:includable>
<b:includable id='backlinks' var='post'/>
<b:includable id='comment-form' var='post'/>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='comment_count_picker' var='post'/>
<b:includable id='comment_picker' var='post'/>
<b:includable id='comments' var='post'></b:includable>
<b:includable id='feedLinks'></b:includable>
<b:includable id='feedLinksBody' var='links'></b:includable>
<b:includable id='iframe_comments' var='post'></b:includable>
<b:includable id='mobile-index-post' var='post'></b:includable>
<b:includable id='mobile-main' var='top'></b:includable>
<b:includable id='mobile-nextprev'></b:includable>
<b:includable id='mobile-post' var='post'></b:includable>
<b:includable id='nextprev'></b:includable>

<b:includable id='post' var='post'>
<data:post.body/>
</b:includable>

<b:includable id='postQuickEdit' var='post'></b:includable>
<b:includable id='shareButtons' var='post'></b:includable>
<b:includable id='status-message'></b:includable>
<b:includable id='threaded-comment-form' var='post'></b:includable>
<b:includable id='threaded_comment_js' var='post'></b:includable>
<b:includable id='threaded_comments' var='post'></b:includable>
</b:widget>
</b:section>
</div>
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
</div>

</body>
</html>

------------------------------------------------------------------------------------------------------------

READ MORE: