POST LOADER TEMPLATE

Wednesday, 4 June 2014

POST LOADER TEMPLATE

------------------------------------------------------------------------------------------------------------
COPY AND PASTE BELOW CODE
------------------------------------------------------------------------------------------------------------

<?xml version="1.0" encoding="UTF-8" ?>
<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: POST LOADER TEMPLATE
Design by : FBGadgets
URL : http://fbgadgets.blogspot.co.uk/
----------------------------------------------- */

#navbar-iframe, #Navbar1 {display:none !important;}

/*****************************************
Global Links CSS
******************************************/
a{ color: #4690B3; outline:none; text-decoration: none; }
a:hover { color: #3e3e3e; text-decoration:none; }

/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper{width:1024px;background-color:#FAFAFA;margin:0 auto;padding:0;text-align:left;border-left:2px solid #333;border-right:2px solid #333;font:normal normal 11px Verdana,Geneva,sans-serif;}
#main-wrapper{width:70%;padding:0;float:left;word-wrap:break-word;/* fix for long text breaking sidebar float in IE */
overflow:hidden;/* fix for long non-text content breaking IE sidebar float */}

/* Headings
----------------------------------------------- */
h1,h2,h3,h4,h5,h6{font-family:BenchNine,"Bebas Neue",Bebas,"Arial Narrow",Sans-Serif;font-weight:normal;text-transform:none;margin:0}
/* Posts
----------------------------------------------- */
.date-header{margin:1.5em 0 .5em;display:none;}
.post{margin:.5em 0 1.5em;background-color:white;position:relative}
.post h1,.post h2{margin:.25em 0 0;padding:0 0 4px;font-size:140%;font-weight:normal;line-height:1.4em}
.post h1 a,.post h1 a:visited,.post h1 strong,.post h2 a,.post h2 a:visited,.post h2 strong{display:block;text-decoration:none;font-weight:normal}
.post h1 strong,.post h1 a:hover,.post h2 strong,.post h2 a:hover{color:#333333}
.post .post-title{margin-bottom:15px}
.post-body{margin:0 0 .75em;line-height:1.6em}
.post-body blockquote{line-height:1.3em}
.post-footer{margin:.75em 0;color:#999999;display:none}
.comment-link{margin-left:.6em}
.tr-caption-container img{border:none;padding:0}
.post blockquote{margin:1em 20px;font-style:italic}
.post blockquote p{margin:.75em 0}

.sidebar h2 {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizmkSKfzfQpptjIW6iyp8d7ALdbafWDoZtEuBy5j0ROzrhCeJdR3i9BUxTJGEyqb5UEbr1F1itMfcXVFGcAVDay3Z_QTGJx2Pzq7aPx7K4XjuFeK_-FgO4eIBL9BImV2xoBTxN2JwzuDU7/s1600/Sidebar+H2.png") no-repeat scroll 0 0 transparent;
background-position:0 0;
background-repeat:repeat no-repeat;
color: #FFFFFF;
font-family: verdana,arial;
font-size: 12px;
font-weight: bold;
height: 33px;
margin: 0;
padding: 3px 0 3px 7px;
text-transform: uppercase;
}
.sidebar ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
padding:0;
}
.sidebar li {
line-height:1.8em;
background-color: White;
border-bottom:2px solid #00ff00;
font-size: 9px; line-height: 1.2em; padding-top: 2px;
font-weight:bold;
}
.sidebar li a {
display:block;
line-height:1.8em;
padding-left: 5px;
font-size: 9px; line-height: 1.2em; padding-top: 2px;
font-weight:bold;
}
.sidebar li a:hover, .sidebar li:hover {
display:block;
font-size: 9px; line-height: 1.2em; padding-top: 2px;
background-color: Gold;
padding-left: 5px;
color:#009900;
}
.sidebar .widget {
border: 1px solid #539619;
background-color: LAWNGREEN;
border: 6px double;
border-top-color: RED;
margin-bottom: 10px;
}
.sidebar .widget-content {
padding:5px 15px 5px 15px;
}
.sidebar {
color: #000;
line-height: 1.5em;
font-size:12px;
}
#sidebar-wrapper {
width: 100%
float: right;
word-wrap: break-word;
overflow: hidden;
}

/* ----- FOOTER ----- */
#footer-wrapper {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
min-width: 1024px;
max-width: 1024px;
background: #000074;
}
#footer {
margin: 0px 0px 0px 0px;
padding: 10px 10px 10px 10px;
text-align: center;
color: #dddddd;
font: normal normal 80% tahoma,garamond,helvetica,Sans-serif;
line-height: 1.2em;
}
#footer h2 {
margin: 0px 0px 0px 0px;
padding: 0px 0px 10px 0px;
font-size: 100%;
font-weight: bold;
}
#footer .widget {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
.footer a {
color: #e01010
}

]]></b:skin>
<style type='text/css'>
#main-wrapper{padding:10px 0 10px 10px}
.post-body h1{font-size:180%}
.post-body h2{font-size:160%}
.post-body h3{font-size:140%}
.post-body h4{font-size:130%}
.post-body h5{font-size:120%}
.post-body h6{font-size:110%}
.isotope,.isotope .isotope-item{-webkit-transition-duration:0.8s;-moz-transition-duration:0.8s;-ms-transition-duration:0.8s;-o-transition-duration:0.8s;transition-duration:0.8s}
.isotope .isotope-item{-webkit-transition-property:-webkit-transform,opacity;-moz-transition-property:-moz-transform,opacity;-ms-transition-property:-ms-transform,opacity;-o-transition-property:top,left,opacity;transition-property:transform,opacity}
.post .datex{position:absolute;top:10px;padding:3px 5px;left:0;z-index:5;background-color:#C20404;color:white;height:28px;-moz-border-radius:0 2px 2px 0;-webkit-border-radius:0 2px 2px 0;border-radius:0 2px 2px 0;-moz-box-shadow:0 1px 3px #555454;-webkit-box-shadow:0 1px 3px #555454;box-shadow:0 1px 3px #555454;width:75px;text-align:center}
.post .datex strong{font-weight:bold;font-size:25px;line-height:20px;width:37px;display:block;float:left}
.post .datex span,.post .datex small{font-size:8px;display:block;line-height:10px;float:right;width:27px}

</style>

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style type='text/css'>
.blog-posts.hfeed{overflow:hidden}
.post{float:left;width:31.3%;margin:0 0 15px;border:1px solid #E0E0E0;-moz-box-shadow:0 2px 4px #E7E7E7;-webkit-box-shadow:0 2px 4px #E7E7E7;padding:0 0 5px;box-shadow:0 2px 4px #E7E7E7;overflow:hidden}
.post:hover{-moz-box-shadow:0 2px 5px #CACACA;-webkit-box-shadow:0 2px 5px #CACACA;box-shadow:0 2px 5px #CACACA}
.post img{border:0;width:100%}
.post h2.post-title{padding:4px 8px 0;margin:0 0 5px;font-size:160%}
.post h2.post-title a{color:#0F0F0F}
.post h2.post-title a:hover{color:#C20404}
.post-body p{margin:0;padding:0 8px}
.post .jump-link{position:absolute;bottom:-25px;right:5px;line-height:25px;padding:0 10px;background-color:#EBEBEB;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;-moz-box-shadow:inset 0 2px 4px #D1CACA;-webkit-box-shadow:inset 0 2px 4px #D1CACA;box-shadow:inset 0 2px 4px #D1CACA}
.post .jump-link a:hover{color:black;text-decoration:none}
.post .thumbx{display:block;padding:5px;background-color:#F0F0F0;position:relative;border-bottom:1px solid #DFDFDF}
.post .thumbx::before{position:absolute;content:"";width:100%;height:100%;display:block;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJKEE05Mlr_WWxs8tY1JxS5X8CrBgO2p5-Bl4o-dU5xLlLSsKM9jhHeURS87cXjXq1ENOLDSUfDuaduEAEYAe5FvmFt_2038W14fhFnjd5P3UuXtQW3IWcAtzvQRY-f3rv5tqe0gZrC3rV/s0/overlay.png);top:0;background-position:100% 0;background-repeat:no-repeat;left:0}
.post-body{margin-bottom:20px}
.post img.noimage{height:100px}
a.loadpost{display:block;width:320px;margin:0 auto;text-decoration:none;background-color:#EEE;line-height:35px;border:1px solid #D3D0D0;border-radius:3px;box-shadow:0 0 3px #E7E7E7,inset 0 0 2px white}
.imgload{width:32px;height:32px}
#blog-pager{display:none}

</style>
<b:else/>
<style type='text/css'>
#main-wrapper{padding:10px}
.post,#comments,#related_posts,.breadcrumbs{margin:0 0 15px;border:1px solid #E0E0E0;-moz-box-shadow:0 2px 4px #E7E7E7;-webkit-box-shadow:0 2px 4px #E7E7E7;padding:0 10px 15px;box-shadow:0 2px 4px #E7E7E7;background-color:white;overflow:hidden}
.post .datex{top:-2px;right:10px;left:auto;width:40px;height:55px;padding:5px 0;-moz-border-radius:0 0 2px 2px;-webkit-border-radius:0 0 2px 2px;border-radius:0 0 2px 2px}
.post .datex strong{font-size:22px;width:100%;padding:0 0 3px;float:none}
.post .datex span,.post .datex small{float:none;width:100%;font-size:9px;line-height:12px}
.post h1.post-title{margin:5px 0 15px;border-bottom:4px solid #363636;padding:0 0 3px;font-size:200%}
.post h1.post-title a{color:#363636}
.post img{padding:5px;border:1px solid #C0BEBE}

</style>
</b:if>
<b:else/>
<style type='text/css'>
#main-wrapper{padding:10px}
.post,#comments{margin:0 0 15px;border:1px solid #E0E0E0;-moz-box-shadow:0 2px 4px #E7E7E7;-webkit-box-shadow:0 2px 4px #E7E7E7;padding:0 10px 15px;box-shadow:0 2px 4px #E7E7E7;overflow:hidden}
.post h2.post-title{margin:5px 0 15px;border-bottom:4px solid #363636;padding:0 0 3px;font-size:200%;background-color:white}
.post h2.post-title a{color:#363636}
.post img{padding:5px;border:1px solid #C0BEBE}

</style>
</b:if>

</head>

<body>

<div id='outer-wrapper'>
<div id='content-wrapper'>
<div id='main-wrapper'>

<div style='clear:both'/>
<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'>
<b:if cond='data:mobile == "false"'>
<b:include data='top' name='status-message'/>
<div class='blog-posts hfeed'>
<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumbs'>
<span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a class='homex' expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title'>Home</span></a></span>
»
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'>
<a expr:href='data:label.url' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span>
<b:if cond='data:label.isLast != "true"'> » </b:if>
</b:loop>
<b:else/>
»Unlabelled
</b:if>
» <span><data:post.title/></span>
</b:loop>
</div>
</b:if>
<data:defaultAdStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.isDateStart'>
<b:if cond='data:post.isFirstPost == "false"'>
</div></div>
</b:if>
</b:if>
<b:if cond='data:post.isDateStart'>
<div class="date-outer">
</b:if>
<b:if cond='data:post.dateHeader'>
<div class='date-header'><data:post.dateHeader/></div>
</b:if>
<b:if cond='data:post.isDateStart'>
<div class="date-posts">
</b:if>
<div class='post-outer'>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "static_page"'>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</div>
<b:if cond='data:post.includeAd'>
<b:if cond='data:post.isFirstPost'>
<data:defaultAdEnd/>
<b:else/>
<data:adEnd/>
</b:if>
<div class='inline-ad'>
<data:adCode/>
</div>
<data:adStart/>
</b:if>
</b:loop>
<b:if cond='data:numPosts != 0'>
</div></div>
</b:if>
<data:adEnd/>
</div>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<b:include name='nextprev'/>
</b:if></b:if>
<b:include name='feedLinks'/>
<b:if cond='data:top.showStars'>
<script src='//www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>/*<![CDATA[*/google.load("annotations","1",{"locale":"<data:top.languageCode/>"});function initialize(){google.annotations.setApplicationId(<data:top.blogspotReviews/>);google.annotations.createAll();google.annotations.fetch();}
google.setOnLoadCallback(initialize);/*]]>*/</script>
</b:if>
<b:else/>
<b:include name='mobile-main'/>
</b:if>
<b:if cond='data:top.showDummy'>
<data:top.dummyBootstrap/>
</b:if>
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'/>
<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 id='feedLinks'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='iframe_comments' var='post'/>
<b:includable id='mobile-index-post' var='post'/>
<b:includable id='mobile-main' var='top'/>
<b:includable id='mobile-nextprev'/>
<b:includable id='mobile-post' var='post'/>
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<b:if cond='data:mobileLinkUrl'>
<div class='blog-mobile-link'>
<a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
</div>
</b:if>
</div>
<div class='clear'/>
</b:includable>
<b:includable id='post' var='post'>
<article class='post hentry' expr:id='data:post.id' itemscope='' itemtype='http://schema.org/BlogPosting'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.thumbnailUrl'>
<a class='thumbx' expr:href='data:post.url' expr:title='data:post.title'><img class='post-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl'/></a>
<b:else/>
<a class='thumbx' expr:href='data:post.url' expr:title='data:post.title'><img alt='no image' class='noimage post-thumbnail' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi73Q_2I7gDqIR_eB7dWSe50mTB13heRZLkCUZ9gE9bzB6fVx9T_wS1sAVQHrwuzoZYMjfm5xT9blqZA1l4GNHOCLSzdDBYtwVf9QlqmZEBGa1mC6OgIdTjugRrlwxq1Kw_3_oqepQL4mIK/s0/grey.png'/></a>
</b:if>
</b:if>
</b:if>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.title'>
<h2 class='post-title entry-title' itemprop='name headline'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' itemprop='url'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' itemprop='url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
<b:else/>
<h1 class='post-title entry-title' itemprop='name headline'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' itemprop='url'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' itemprop='url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>
<div class='post-header' style='position:absolute;left:-9999px'>
<div class='post-header-line-1'/>
</div>
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<p>
<data:post.snippet/>
</p>
<b:else/>
<data:post.body/>
</b:if>
<b:else/>
<data:post.body/>
</b:if>
</div>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if></b:if>
<b:if cond='data:blog.pageType == "item"'>
<div style='background:#222;border:1px solid #111;border-right:1px solid #444;border-bottom:1px solid #444;padding:10px 0;margin:13px 0 8px 0;width:100%;float:left;height:50px'>
<div style='float:right;padding-right:10px'>
<div class='addthis_toolbox addthis_default_style'>
<a class='addthis_button_facebook_like' fb:like:layout='button_count'/>
<a class='addthis_button_tweet'/>
<a class='addthis_button_google_plusone' g:plusone:size='medium'/>
<a class='addthis_counter addthis_pill_style'/>
</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js#pubid=4rifin' type='text/javascript'/></div>
<div style='float:right;padding:2px 10px 0 0;font:normal 12px Arial;color:#666'>
<strong>Share this article</strong> :
</div>
</div>
</b:if>
<b:if cond='data:blog.pageType != "static_page"'>
<span class='datex'>
<strong/>
<span/>
<small/>
</span>
</b:if>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'><span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<b:if cond='data:post.authorProfileUrl'>
<span class='fn'>
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<data:post.author/>
</a>
</span>
<b:else/>
<span class='fn'><data:post.author/></span>
</b:if>
</b:if>
</span> <span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='updated published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
</b:if>
</b:if>
</span> <span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</b:if>
</span> <span class='post-icons'>
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>
<b:include data='post' name='postQuickEdit'/>
</span> <div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div> </div>
<div class='post-footer-line post-footer-line-2'><span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span> </div>
<div class='post-footer-line post-footer-line-3'><span class='post-location'>
<b:if cond='data:top.showLocation'>
<b:if cond='data:post.location'>
<data:postLocationLabel/>
<a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
</b:if>
</b:if>
</span> </div>
</div>
</article>
<b:if cond='data:blog.pageType == "item"'>
<div id='social-side2'/>
<div class='blog-pager' id='blog-pager'>
<div class='pager-isi'>
<b:if cond='data:newerPageUrl'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><h6>Next</h6><h5><data:newerPageTitle/></h5></a>
<b:else/>
<span class='linkgrey left'><h6>Next</h6><h5>This is the most recent post.</h5></span>
</b:if>
<b:if cond='data:olderPageUrl'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><h6>Previous</h6><h5><data:olderPageTitle/></h5></a>
<b:else/>
<span class='linkgrey right'><h6>Previous</h6><h5>This is the last post.</h5></span>
</b:if>
</div>
</div>
<script type='text/javascript'>/*<![CDATA[*/$(window).load(function(){var c=$("a.blog-pager-newer-link").attr("href");$("a.blog-pager-newer-link").load(c+" .post-title:first",function(){var a=$("a.blog-pager-newer-link").text();$("a.blog-pager-newer-link").html("<h6>Next</h6><h5>"+a+"</h5>")});var d=$("a.blog-pager-older-link").attr("href");$("a.blog-pager-older-link").load(d+" .post-title:first",function(){var a=$("a.blog-pager-older-link").text();$("a.blog-pager-older-link").html("<h6>Previous</h6><h5>"+a+"</h5>")})});/*]]>*/</script>
<div id='related_posts'/>
</b:if>
</b:includable>
<b:includable id='postQuickEdit' var='post'/>
<b:includable id='shareButtons' var='post'/>
<b:includable id='status-message'/>
<b:includable id='threaded-comment-form' var='post'/>
<b:includable id='threaded_comment_js' var='post'/>
<b:includable id='threaded_comments' var='post'/>
</b:widget>
<b:widget id='HTML7' locked='false' title='LOADER' type='HTML'>
<b:includable id='main'>
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>
</div>
<aside id='sidebar-wrapper' itemscope='' itemtype='http://schema.org/WPSideBar'>
<div id='sidebar-watas'>
<b:section class='sidebar' id='sidebar-atas' preferred='yes'>
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content popular-posts'>
<ul>
<b:loop values='data:posts' var='post'>
<li>
<b:if cond='data:showThumbnails == "false"'>
<b:if cond='data:showSnippets == "false"'>
<a expr:href='data:post.href'><data:post.title/></a>
<b:else/>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</b:if>
<b:else/>
<b:if cond='data:showSnippets == "false"'>
<div class='item-thumbnail-only'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
</div>
<div style='clear:both'/>
<b:else/>
<div class='item-content'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</div>
<div style='clear:both'/>
</b:if>
</b:if>
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
<div class='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' showaddelement='yes'>
<b:widget id='Stats1' locked='false' title='Monthly Views' type='Stats'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<div expr:id='data:widget.instanceId + "_content"' style='display:none'>
<b:if cond='data:showSparkline'>
<img alt='Sparkline' expr:id='data:widget.instanceId + "_sparkline"' height='30' width='75'/>
</b:if>
<b:if cond='data:showGraphicalCounter'>
<span class='counter-wrapper graph-counter-wrapper' expr:id='data:widget.instanceId + "_totalCount"'/>
<b:else/>
<span class='counter-wrapper text-counter-wrapper' expr:id='data:widget.instanceId + "_totalCount"'/>
</b:if>
<b:include name='quickedit'/>
</div>
</div>
</b:includable>
</b:widget>
<b:widget id='PlusFollowers1' locked='false' title='Google+ Followers' type='PlusFollowers'>
<b:includable id='main'>
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<b:if cond='data:profileUrl != ""'>
<div class='g-plus' data-action='followers' data-source='blogger:blog:followers' expr:data-height='data:height' expr:data-href='data:profileUrl' expr:data-theme='data:theme' expr:data-width='data:width'/>
<script type='text/javascript'>/*<![CDATA[*/window.___gcfg={'lang':'<data:language/>'};/*]]>*/</script>
</b:if>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
</aside>


<div class='clear'> </div>
</div> 
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
<div class='kreditx'>

Blogger Designed by <a href='http://fbgadgets.blogspot.co.uk/' target='_blank'>FB GADGETS</a> | <a class='FB' href='http://fbgadgets.blogspot.co.uk/' target='_blank'>MKR Site</a>
</div>
</div>
</div> 

</body>
</html>

------------------------------------------------------------------------------------------------------------
2- ADD HTML/JAVA WIDGET AND PASTE BELOW POST LOADER CODE
------------------------------------------------------------------------------------------------------------

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'></script>

<script type='text/javascript'>
//<![CDATA[

function resizeThumb(e,b){var c=document.getElementById(e),d=c.getElementsByTagName("img");for(var a=0;a<d.length;a++){d[a].src=d[a].src.replace(/\/s72\-c/,"/s"+b+"-c");}}

window.labelnyacx=(function(){var a=function(d){var e=d||{},c=e.url_blog||window.location.host,b=e.id_labelcontent||"#labelxnya";$.ajax({url:"http://"+c+"/feeds/posts/summary?max-results=0&alt=json-in-script",type:"get",dataType:"jsonp",success:function(h){var f=h.feed.category,j="";if(f!==undefined){j="<ul class='subnya-xitem'>";for(var g=0;g<f.length;g++){j+='<li><a href="/search/label/'+encodeURIComponent(f[g].term)+'" target="_blank">'+f[g].term+"</a></li>"}j+="</ul>";$(b).html(j)}else{$(b).html("<span>No Label!</span>")}},error:function(){$(b).html("<strong>Error Loading Feed!</strong>")}})};return function(b){a(b)}})();

resizeThumb("main",250);
labelnyacx();
(function($) {
var loadingGif = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSeGJj6Dpeb8tZ-MptAoJ2WHlFCtvR7EbsLDvE41Jqx2oclGsdvTsRofzTv5Mp7G50CEbQxf6t0kZRj3FrQfLDhaOeLbzc-emK4mwYOc5ZtPQt5MZhrFU0zGF-8f-5nyTALIA5YNyEm4Zi/s32/ajax-loader.gif';
var olderPostsLink = '';
var loadMoreDiv = null;
var postContainerSelector = 'div.blog-posts';
var loading = false;
var win = $(window);
var doc = $(document);
// Took from jQuery to avoid permission denied error in IE.
var rscript = /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi;
function loadDisqusScript(domain) {
$.getScript('http://' + domain + '.disqus.com/blogger_index.js');
}
function loadMore() {
if (loading) {
return;
}
loading = true;
if (!olderPostsLink) {
loadMoreDiv.hide();
return;
}
loadMoreDiv.find('a').hide();
loadMoreDiv.find('img').show();
$.ajax(olderPostsLink, {
'dataType': 'html'
}).done(function(html) {
var newDom = $('<div></div>').append(html.replace(rscript, ''));
var newLink = newDom.find('a.blog-pager-older-link');
if (newLink) {
olderPostsLink = newLink.attr('href');
} else {
olderPostsLink = '';
loadMoreDiv.hide();
}
var newPosts = newDom.find(postContainerSelector).children('.date-outer');
$(postContainerSelector).append(newPosts);
resizeThumb("main",250);
// Loaded more posts successfully. Register this pageview with
// Google Analytics.
if (window._gaq) {
window._gaq.push(['_trackPageview', olderPostsLink]);
}
// Render +1 buttons.
if (window.gapi && window.gapi.plusone && window.gapi.plusone.go) {
window.gapi.plusone.go();
}
// Render Disqus comments.
if (window.disqus_shortname) {
loadDisqusScript(window.disqus_shortname);
}
// Render Facebook buttons.
if (window.FB && window.FB.XFBML && window.FB.XFBML.parse) {
window.FB.XFBML.parse();
}
loadMoreDiv.find('img').hide();
loadMoreDiv.find('a').show();
loading = false;
});
}
function init() {
if (_WidgetManager._GetAllData().blog.pageType == 'item') {
return;
}
olderPostsLink = $('a.blog-pager-older-link').attr('href');
if (!olderPostsLink) {
return;
}
var link = $('<a class="loadpost" href="javascript:">Load more posts</a>');
link.click(loadMore);
var img = $('<img src="' + loadingGif + '" style="display:none">');
loadMoreDiv = $('<div style="text-align:center;font-size:140%"></div>');
loadMoreDiv.append(link);
loadMoreDiv.append(img);
loadMoreDiv.insertBefore($('#blog-pager'));
$('#blog-pager').hide();
}
$(document).ready(init);
})(jQuery);

//]]>
</script>

-------------------------------------------------------------------------------------------------------------------
OR USE THIS SIMPLE 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: POST LOADER TEMPLATE
Design by : FBGadgets
URL : http://fbgadgets.blogspot.co.uk/
----------------------------------------------- */

.post-thumbail img {
width: 305px;
}

/* Index Post */
.post-thumbail {
position:relative;
overflow:hidden;
height:171px;
margin:5px;
float:left;
}

.linkhover a {
position:absolute;
width:305px;
height:171px;
color:transparent;
}

]]></b:skin>

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style>
.post image {
float:left;
width: 330px;
height: 200px;
border-radius: 0%;
border: 10px solid white;
-webkit-box-shadow: 5px 5px 5px #111;
box-shadow: 5px 5px 5px #111;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}

.post{
float:left;
width: 330px;
height: 200px;
border: 2px solid #000000;
border: 1px solid #9B1212;
display:inline;
overflow:hidden;
position:relative;
}
.post h3 {
border:0 none;
line-height:13px;
margin:0 0 5px;
padding:3px
}
.post h3 a,.post h3 a:visited,.post h3 strong {
color:#333;
font:bold 13px Arial;
text-align:center;
text-shadow:none;
line-height:20px
}
.post-body {
font-size: 0px;
height:200px;
overflow:hidden;
width:280px;
padding: 5px
}
</style>
</b:if></b:if>

</head>

<body>

<div id='outer-wrapper'>

<div id='content-wrapper'>

<div id='main-wrapper'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div class='menu-xitem'>
<div><div class='xitem1'><a class='liat' href='#'><b:if cond='data:blog.url == data:blog.homepageUrl'>
Latest Post
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<data:blog.pageName/>
<b:else/>
<b:if cond='data:blog.searchQuery'>
<data:blog.searchQuery/>
<b:else/>
<b:if cond='data:blog.searchLabel'>
<data:blog.searchLabel/>
</b:if>
</b:if>
</b:if>
</b:if></a>
<div class='hidden' id='labelxnya'/>
</div></div>
</div>
</b:if></b:if>
<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'>
<b:if cond='data:mobile == "false"'>
<div class='blog-posts hfeed'>
<b:include data='top' name='status-message'/>
<data:defaultAdStart/>
<b:loop values='data:posts' var='post'>

<b:if cond='data:post.isDateStart'>
<div class="date-outer">
</b:if>
<b:if cond='data:post.dateHeader'>
<div class='date-header'><data:post.dateHeader/></div>
</b:if>
<b:if cond='data:post.isDateStart'>
<div class="date-posts">
</b:if>
<div class='post-outer'>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "static_page"'>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</div>
<b:if cond='data:post.includeAd'>
<b:if cond='data:post.isFirstPost'>
<data:defaultAdEnd/>
<b:else/>
<data:adEnd/>
</b:if>
<div class='inline-ad'>
<data:adCode/>
</div>
<data:adStart/>
</b:if>
</b:loop>
<b:if cond='data:numPosts != 0'>
</div></div>
</b:if>
<data:adEnd/>
</div>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<b:include name='nextprev'/>
</b:if></b:if>
<b:include name='feedLinks'/>
<b:if cond='data:top.showStars'>
<script src='//www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>/*<![CDATA[*/google.load("annotations","1",{"locale":"<data:top.languageCode/>"});function initialize(){google.annotations.setApplicationId(<data:top.blogspotReviews/>);google.annotations.createAll();google.annotations.fetch();}
google.setOnLoadCallback(initialize);/*]]>*/</script>
</b:if>
<b:else/>
</b:if>

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div class='loadingpost'/>

<b:include name='nextprev'/>
</b:if></b:if>

<style type='text/css'>
.loadingxx{width:100%;min-height:150px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiX12fJkZejVcqT6NmP2PDYF46soJX_Xd-P90_7c6q4gTCcuYoioQU7_cNBTO96Df5S-yXbMRS0D4V31XxLZc0p6Ch3jbUJzLftPrKMY50Mr1c41u7wt4qU-5xaPUVb-1ArVyRnZQUsPjk/s1600/progress_ani.gif) no-repeat center;display:block;text-indent:-9999px}
.bwh-title .comment-link{margin:0;position:absolute;right:0;top:0;padding:3px 4px;color:white;min-width:20px;text-align:center;background-color:#303030;text-decoration:none}
a.loadpost{display:block;padding:8px;background-color:#303030;color:white;text-transform:capitalize;text-decoration:none}
.labelnyatas a{display:inline-block;padding:0 5px;height:17px;font-size:8px;line-height:17px;text-decoration:none;background-color:#303030;color:white}
.bwh-title .comment-link:hover,a.loadpost:hover,.labelnyatas a:hover{background-color:#1295C9}
.bwh-title .comment-link::after{content:"";width:0;height:0;border-width:2px 4px;border-style:solid;border-color:#303030 #303030 transparent transparent;position:absolute;top:100%;right:0}
.bwh-title .comment-link:hover::after{border-color:#1295C9 #1295C9 transparent transparent}
</style>
<script type='text/javascript'>
//<![CDATA[
function resizeThumb(e,b){var c=document.getElementById(e),d=c.getElementsByTagName("img");for(var a=0;a<d.length;a++){d[a].src=d[a].src.replace(/\/s72\-c/,"/s"+b+"-c");}}

window.labelnyacx=(function(){var a=function(d){var e=d||{},c=e.url_blog||window.location.host,b=e.id_labelcontent||"#labelxnya";$.ajax({url:"http://"+c+"/feeds/posts/summary?max-results=0&alt=json-in-script",type:"get",dataType:"jsonp",success:function(h){var f=h.feed.category,j="";if(f!==undefined){j="<ul class='subnya-xitem'>";for(var g=0;g<f.length;g++){j+='<li><a href="/search/label/'+encodeURIComponent(f[g].term)+'" target="_blank">'+f[g].term+"</a></li>"}j+="</ul>";$(b).html(j)}else{$(b).html("<span>No Label!</span>")}},error:function(){$(b).html("<strong>Error Loading Feed!</strong>")}})};return function(b){a(b)}})();
//]]>
</script>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'></script>

<script type='text/javascript'>
//<![CDATA[
resizeThumb("main",250);
labelnyacx();
(function($) {
var loadingGif = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSeGJj6Dpeb8tZ-MptAoJ2WHlFCtvR7EbsLDvE41Jqx2oclGsdvTsRofzTv5Mp7G50CEbQxf6t0kZRj3FrQfLDhaOeLbzc-emK4mwYOc5ZtPQt5MZhrFU0zGF-8f-5nyTALIA5YNyEm4Zi/s32/ajax-loader.gif';
var olderPostsLink = '';
var loadMoreDiv = null;
var postContainerSelector = 'div.blog-posts';
var loading = false;
var win = $(window);
var doc = $(document);
// Took from jQuery to avoid permission denied error in IE.
var rscript = /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi;
function loadDisqusScript(domain) {
$.getScript('http://' + domain + '.disqus.com/blogger_index.js');
}
function loadMore() {
if (loading) {
return;
}
loading = true;
if (!olderPostsLink) {
loadMoreDiv.hide();
return;
}
loadMoreDiv.find('a').hide();
loadMoreDiv.find('img').show();
$.ajax(olderPostsLink, {
'dataType': 'html'
}).done(function(html) {
var newDom = $('<div></div>').append(html.replace(rscript, ''));
var newLink = newDom.find('a.blog-pager-older-link');
if (newLink) {
olderPostsLink = newLink.attr('href');
} else {
olderPostsLink = '';
loadMoreDiv.hide();
}
var newPosts = newDom.find(postContainerSelector).children('.date-outer');
$(postContainerSelector).append(newPosts);
resizeThumb("main",250);
// Loaded more posts successfully. Register this pageview with
// Google Analytics.
if (window._gaq) {
window._gaq.push(['_trackPageview', olderPostsLink]);
}
// Render +1 buttons.
if (window.gapi && window.gapi.plusone && window.gapi.plusone.go) {
window.gapi.plusone.go();
}
// Render Disqus comments.
if (window.disqus_shortname) {
loadDisqusScript(window.disqus_shortname);
}
// Render Facebook buttons.
if (window.FB && window.FB.XFBML && window.FB.XFBML.parse) {
window.FB.XFBML.parse();
}
loadMoreDiv.find('img').hide();
loadMoreDiv.find('a').show();
loading = false;
});
}
function init() {
if (_WidgetManager._GetAllData().blog.pageType == 'item') {
return;
}
olderPostsLink = $('a.blog-pager-older-link').attr('href');
if (!olderPostsLink) {
return;
}
var link = $('<a class="loadpost" href="javascript:">Load more posts</a>');
link.click(loadMore);
var img = $('<img src="' + loadingGif + '" style="display:none">');
loadMoreDiv = $('<div style="text-align:center;font-size:140%"></div>');
loadMoreDiv.append(link);
loadMoreDiv.append(img);
loadMoreDiv.insertBefore($('#blog-pager'));
$('#blog-pager').hide();
}
$(document).ready(init);
})(jQuery);
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
(function(a){a.fn.hoverTimeout=function(c,e,b,d){return this.each(function(){var f=null,g=a(this);g.hover(function(){clearTimeout(f);f=setTimeout(function(){e.call(g)},c)},function(){clearTimeout(f);f=setTimeout(function(){d.call(g)},b)})})}})(jQuery);

//]]>
</script>

</b:includable>

<b:includable id='backlinkDeleteIcon' var='backlink'/>
<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 id='feedLinks'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='iframe_comments' var='post'/>
<b:includable id='mobile-index-post' var='post'/>
<b:includable id='mobile-main' var='top'/>
<b:includable id='mobile-nextprev'/>
<b:includable id='mobile-post' var='post'/>

<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:if cond='data:mobileLinkUrl'>
<div class='blog-mobile-link'>
<a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
</div>
</b:if>
</div>
<div class='clear'/>
</b:includable>

<b:includable id='post' var='post'>

<div class='post'>

<div class='post-body'>

<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<a expr:href='data:post.url'><data:post.title/></a>
</b:if>
</h3>

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>

<div class='post-thumbail'>
<div class='linkhover'><a expr:href='data:post.url'><data:post.title/></a></div>
<data:post.body/>
</div>

<b:if cond='data:post.thumbnailUrl'>
<a expr:href='data:post.url'><img alt='thumbnail' class='post-thumbnail' expr:src='data:post.thumbnailUrl'/></a>
<b:else/>
<a expr:href='data:post.url'><img alt='thumbnail' class='post-thumbnail' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUXkJZM9srOl1bE07HoNGpONGGjUrG9aDQJjZIJB9TatneHsJ9ZK5HXASZYZys8Os2x0hlAgL7-JC_9nde0MkJE9e0CGGmAWifhZqvLQ8eEARh8ug-y1QqJeS0ETtMaD0QoEv4JcxP3sam/s1600/FBGadgets.png'/></a>
</b:if>

</b:if>
</b:if>

<data:post.body/>

</div>

</div>

</b:includable>

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


<div class='clear'> </div>
</div> 

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

</div> 

</body>
</html>