Merubah Tanggal Posting Menjadi ICON CALENDER

salam SUKSES,
Buat teman2 bloger saya mencoba memposting postingan yang sudah saya lakukan dan Hasilnya ...................... SUKSES.
di sini saya mw berbagi sama teman2 bloger untuk lebih rapih mendesign sebuah blog yang kita buat agar lebih menarik atau mempunyai nilai jual.
tapi di sini penulis juga menulis agar sewaktu2 tulisan saya dapat di pakai oleh saya sendiri

Ayo kita belajar merubah tanggal posting menjadi icon kalender.

Langkah I :

• Login ke account blogger kamu.
• Pilih Setelan --> Bahasa dan pemformatan
• Dalam halaman Format, ganti Format Header Tanggal menjadi seperti ini mm.dd.yyyy (bulan.hari.tahun) Cth : 04.25.2014
• Simpan Setelan
• Selesai Langkah I

Langkah II:

• Pilih Template --> Edit HTML --> akan keluar coding /  bahasa HTML

Catatan : Biasakan Sebelum melakukan Perubahan silahkan copy semua coding / bahasa HTML jika terjadi eror kita dapat pastekan kembali coding / bahasa HTML tersebut ke dalam bloh

LANJUTKAN YA.

Cari Kode di bawah inigan cara ctrl + F

h2.date-header {
...
}

atau

.date-header {
...
}

sudah ketemu copy paste kan kode yang di bawah tepat di bawah kode CSS di atas

.dateblock {
background: url("http://i647.photobucket.com/albums/uu191/ariamsi/Icon/bluecalend3.gif") no-repeat;
margin: 0 10px 0 0;
font-weight: bold;
width: 33px;
height: 36px;
/*position: absolute;
top: 0;
left: 0;*/
float: left;
text-align: center;
}

.month {
font-size: 8px;
width: 34px;
margin: 0 auto;
padding-top: 2px;
text-transform: uppercase;
color: #fff;
}

.day {
color:#3366CC;
font-size: 12px;
width: 34px;
margin: 0 auto;
padding-top: 2px;
}

Untuk Penggantian Warna

1.  Perhatikan code warna Hijau dan warna merah di atas
2. Silakan ganti kode yang berwarna merah yang di atas dengan kode warna di sini.
3. Silakan pilih image background untuk icon kalender kamu dengan mengganti kode yang berwarna hijau dengan nama file di bawah image berikut.

greencalend3.gif	yellowcalend3.gif	orangecalend3.gif
pinkcalend3.gif	ungucalend3.gif	redcalend3.gif

• Kemudian lakukan copas kode di bawah ini dan letakkan di atas kode </head>.

<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>

  > Terakhir cari Kode yang di bawa ini :

<data:post.dateHeader/>

  > Dan ganti dengan kode berikut.

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

• Jangan lupa disimpan.

Catatan Penting :
Apabila menggunakan trik blogger ini, tanggal posting (date header) dalam template blog kamu harus berada di atas judul posting (post title) atau posting (post).
Jika 1 atau 2 baris paragraf postingan kamu ikut masuk kmenjorok ke dalam, maka perlu penambahan kode pada CSS .post-body. Kode tambahannya adalah padding-top:10px; (ubah nilainya sampai baris paragraf postingan kamu berada di bawah icon tanggal).

di poskan oleh http://trik-tips.blogspot.com/2008/01/mengganti-tanggal-icon-calender.html