Pasang Widget Recent Post Pada Blogspot

Widget Recent Post ini boleh di sesuaikan untuk memaparkan:

- tajuk post sahaja. (option 1)
- tajuk post dan snippet. (option 2)
- mengubah jumlah bilangan post.
- memaparkan tarikh post.
- menambah atau mengurangkan bilangan perkataan pada snippet.

Cara Memasang Widget Recent Post

Langkah 1: Log masuk Blogger Dashboard, pergi ke Layout dan klik pautan Add a Gadget.
Langkah 2: Apabila pop-up window keluar, scroll kebawah dan klik pautan HTML/JavaScripts.

Langkah 3: Salin kod dibawah dan paste kedalam kotak HTML/JavaScripts tadi.

Option 1: Recent Posts Widget Show Post Only

<div id="hlrpsb">
<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-titles-only.js"></script>
<script style="text/javascript">var numposts = 10;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script>
<script src="http://blog-address.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com/2012/04/simple-related-posts-widget-for-blogger.html" rel="nofollow" >Recent Posts Widget</a>
<noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript>
<style type=text/css>
#hlrpsb a {color: #0B3861; font-size: 13px;}
#rpdr, #rpdr a {color:#808080;}
.bbrecpost2 {
padding-top:6px;
padding-bottom:6px;
border-bottom: 1px #cccccc dotted; }
</style>

Option 2: Recent Posts Widget With Snippets

<div id="hlrpsa">
<script src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-snippets.js">
</script>
<script>
var numposts = 5;var showpostdate = false;var showpostsummary = true;var numchars = 100;var standardstyling = true;
</script>
<script src="http://blog-address.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts">
</script></div><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://helplogger.blogspot.com/2012/04/simple-related-posts-widget-for-blogger.html" rel="nofollow" >Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<style type="text/css">
#hlrpsa a {color: #0B3861; font-size: 13px;}
#rpdr, #rpdr a {color:#808080;}
#hlrpsa { color: #999999; font-size: 11px; border-bottom:1px #cccccc dotted; margin-top:-10px; padding-bottom:10px;}
.hlrps a {font-weight:bold; }
.hlrpssumm {}
</style>

Langkah 4: sesuaikan widget mengikut keperluan blog:

- Change 10 (option 1) and 5 (option 2) with the number of posts that you want to display.
- Change false to true if you want the posts dates to appear
- Change 100 (option 1) if you want more characters to be displayed.
- To change the color and font size of the links, modify the values in blue (links) and violet (font-size)
- To change the style of posts summary, modify the values in green (color) and orange (font size)
- Replace the http://blog-address.com text with your URL

Langkah 5: Klik Save. Done