Nah...kali ini saya akan kasih tau bagaimana Mengganti Tanggal dengan Icon Kalender. Pengen tahu contohnya...? Ga sabar nih Sahabat bimabijak.co.cc ?okey, simak baik-baik ya...cekidot !
Untuk mengganti warna text bulan, silahkan ganti kode heksa warna #fff dengan warna sesukakamu. Begitu juga jika ingin mengganti warna text tanggal, silahkan ganti kode heksa #3366cc dengan kode warna sesukamu.
Apabila letak text bulan tidak sesuai dengan kalender, silahkan ubah kembali marginnya dengan disesuaikan.
Kalo udah selesai, kemudian cari kode html berikut :
Lalu ganti dengan script ini :
Save Template dan Selesai
Semoga Bermanfaat...
ENJOY !
- Setelah login di blogger, dan sebelum edit HTML anda, pastikan dulu format tanggal blog anda harus mm/dd/yyyy. Kalo belum, silahkan ganti dulu. Caranya...setting--->>formatting trus ganti date header format-nya dengan mm/dd/yyyy. kalo ga tau formatnya seperti ini : 1.25.2008.
- Nah..langkah ke-2 yaitu edit HTML. caranya masuk ke layout--->>edit HTML jangan lupa kasih tanda centang di Expand Template Widget.
- Kalo udah, Silahkan cari kode HTML di bawah ini :
<TITLE><data:blog.pageTitle/></TITLE>
- Kalo sudah ketemu, copy paste script berikut dibawah kode HTML yang 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> - Kalo udah, cari kode berikut :
h2.date-header {
background:none;
margin:1.5em 0 .5em;
border:0px;
font-size:80%;
color:#b33c3c;
font-style:normal;
} - Kalo dah ketemu, copy kode berikut di bawah kode diatas :
.dateblock {
background: url("http://mizwar.blog.googlepages.com/biru.gif")
no-repeat;
width: 55px;
margin: 0;
font-weight: bold;
height: 50px;
/*position: absolute;
top: 0;
left: 0;*/
float: left;
text-align: center;
}
.month {
font-size: 11px;
width: 34px;
margin-top:4px;
margin-bottom:3px;
margin-left:5px;
margin-right:5px;
text-transform: uppercase;
color: #fff;
}
.day {
color:#3366CC;
font-size: 19px;
width: 37px;
margin: 0 5px;
}
Keterangan: Kode http://mizwar.blog.googlepages.com/biru.gif adalah gambar kalender. Kalo anda ingin mengganti gambar kalender tersebut, silahkan ganti text biru.gif dengan text kalender di bawah ini :
Blue.gif cyan.gif hijau.gif orange.gif pink.gif ungu.gif hitam.gif kuning.gif merah.gif
Untuk mengganti warna text bulan, silahkan ganti kode heksa warna #fff dengan warna sesukakamu. Begitu juga jika ingin mengganti warna text tanggal, silahkan ganti kode heksa #3366cc dengan kode warna sesukamu.
Apabila letak text bulan tidak sesuai dengan kalender, silahkan ubah kembali marginnya dengan disesuaikan.
<data:post.dateHeader/>
<DIV class='dateblock'>
<SCRIPT>date_replace('<data:post.dateHeader/>');
</SCRIPT></DIV>
Semoga Bermanfaat...
ENJOY !