New Look Blogspot Post Date

Some time we've bored with standard blog interface,...i mean for post date format look as simple digits, if you've got idea to change a look of its you can use this trick to make your blog more beautiful look of post date. This trick have put as you see in my blog. If you interest let's do it now.
The first thing you have to do is change your "date header format" to become mm.dd.yyyy (1.24.2008).

How to do this?
go to your blogger account, then chose "Setting --> Formatting, change "date header format" to become what I said before (mm.dd.yyyy) then save your setting.

Next step is go to tabs "Template --> Edit HTML".
Don't forget to backup your template first.
Click on a "Expand Widget Templates" check box. and go to the deep tricks under.

1. Find this code

<title><data:blog.pageTitle/></TITLE>

in your HTML. If you found it, put the code below under it.

<script type='text/javascript'>
//<![CDATA[
/*********************************/
/* http://nemesismedia.blogspot.com */
/*********************************/
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>

2. Then Find this code:

.date-header {
margin: 1.5em 0 0;
font-weight: normal;
color: $dateHeaderColor;
font-size: 100%;
}

if you can't found it try to find this:

h2.date-header {
margin:1.5em 0 .5em;
}

3. OK, you have found it? next step is put the below code under it.

.dateblock {
background: url("your hosting image")
no-repeat;
width: 50px;
margin: 0;
font-weight: bold;
height: 50px;
/*position: absolute;
top: 0;
left: 0;*/
float: left;
text-align: center;
}

.month {
font-size: 11px;
width: 37px;
margin: 0 5px;
text-transform: uppercase;
color: #fff;
}

.day {
color:#3366CC;
font-size: 19px;
width: 37px;
margin: 0 5px;

}