Menukarkan Post Date Dengan Calendar Icon.

1. Sign In akaun Blogger.

2. Pilih Settings --> Formatting dan ganti "date header format".

3. Pastikan format tarikh seperti ini (mm.dd.yyyy) contoh : 7.14.2010.

4. Kemudian Save Setting.

4. Langkah seterusnya, pilih Layout --> Edit HTML --> Expand Widget Templates.

5. Cari kod ini.

</head>

6. Copy kod di bawah dan letakkan diatas kod tadi.

<SCRIPT type='text/javascript'>
//<![CDATA[
function date_replace(date) {
var da = date.split('.');
var day = da[1], mon = da[0], year = da[2];
var month =
['0','Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
document.write("<div class='month'>"+month[mon]+"</div> <div class='day'>"+day+"</div>");
}
//]]>
</SCRIPT>
<script type='text/javascript'>
if (window.jstiming) window.jstiming.load.tick(&#39;headEnd&#39;);
</script>

7. Cari kod ini.

]]></b:skin>

8. Copy kod dibawah dan letakkan diatas kod tadi.

.dateblock {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLgMHiM9ad_S1Jozg8-gFh8Mi77tW6g7mnhPdpHeBFrR1LYX_mDmqThOBTXg_Dryr02jvsmWzUBoRJjBgUEveqo96E9Py4OloCeKlKlsGQRahS8JZRSdcEPugy7gvOvHdQb01bIuREurA/s1600/dateblock.gif); background-repeat:no-repeat; width:66px; height:75px; text-align:center; float:left; color:#fff; font-size:10px; font-weight:bold; margin:0px; margin-top:3px; margin-right:10px; padding-top:7px}
.day{font-size:35px; font-weight:bold; color:#000; padding-top:5px; letter-spacing:-1px}
.month{font-size:12px; font-weight:bold; color:#fff; padding:0px; letter-spacing:1px
}

9. Cari kod ini.

<data:post.dateHeader/>

10. Untuk memudahkan carian anda gunakan Ctl + F.

11. Sekiranya anda sudah jumpa kod diatas, gantikan dengan kod ini.

<DIV class='dateblock'>
<SCRIPT>date_replace('<data:post.dateHeader/>');</SCRIPT></DIV>

12. Setelah selesai pilih Preview.

13. Sekiranya anda berpuashati dengan hasilnya pilih SAVE.

14. Selamat Mencuba.