Simple Recent Posts Blogger Plus Thumbnails Installing a recent post widget is one way to minimize bounce rate blog by providing information for the latest post
Installing a recent post widget is one way to minimize bounce rate blog by providing information for the latest posts on readers. With so readers will easily find the most warm posts on the blog.
Many kinds of recent post widgets like recent posts or recent carousel shaped posts. Well this time I will share a blogger widget recent posts are quite simple and stored in the sidebar blog. In addition to simple, recent posts widget has a fairly light loading, so you need to try also hehehe ...
Please save the following CSS code above </head> code (you may need to customize some sections to customize it to the theme you are using).
<style>Then please save the following javascript code above code </body>.
/<![CDATA[/
ul#recent-posts{width:100%;margin:0 auto;padding:0!important;list-style-type:none}
ul#recent-posts li{background:#FFF;padding:0!important;margin-bottom:10px;overflow:hidden;width:100%;height:auto;-webkit-box-shadow:2px 2px 3px rgba(0,0,0,.05);-o-box-shadow:2px 2px 3px rgba(0,0,0,.05);-ms-box-shadow:2px 2px 3px rgba(0,0,0,.05);box-shadow:2px 2px 3px rgba(0,0,0,.05);}
ul#recent-posts li img{width:90px;height:70px;margin:0 10px 0 0;float:left;}
ul#recent-posts li .title_post{padding:10px!important;line-height: 1;position:relative;margin-left:90px;}
ul#recent-posts li a{color:#333;font-family:inherit;font-size:14px;font-weight:500;text-decoration:none}
ul#recent-posts li a:hover{color:#FF1744;}
ul#recent-posts:after{content:"";display:block;clear:both}
/]]>/
</style>
<script type='text/javascript'>Listing 5 on marked text above had a function to set the number of posts displayed.
//<![CDATA[
var homePage = window.location.origin,numPosts = 5;
function downloadJSAtOnload(){var d=document.createElement("script");d.src="https://cdn.rawgit.com/KompiAjaib/kompi-js/master/recent_post_with_thumbnail.js",document.body.appendChild(d)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;
//]]>
</script>
Lastly please save the following code in the sidebar through the layout / layout on the gadget HTML / JavaScript.
<ul id="recent-posts"></ul>
Done, good luck. So today article about Simple Recent Posts Blogger Plus Thumbnails hopefully help and solve your problem.