Langkah yang kedua masih dalam Dasbor
Klik Rancangan (Yang dulunya Tata Letak)
Klik tab Edit HTML
Klik tulisan Download Template Lengkap.
Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
Beri tanda centang pada kotak di samping tulisan Expand Template Widget,
Kemudian cari kode <title><data:blog.pageTitle/></title> kalau sudah ketemu taruh Script berikut ini dibawahnya kode tersebut
<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>
Kalau sudah cari kode seperti dibawah ini :
.date-header {
margin: 1.5em 0 0;
font-weight: normal;
color: $dateHeaderColor;
font-size: 100%;
}
kalau nggak ada coba cari yang seperti ini :
h2.date-header {
margin:1.5em 0 .5em;
}
Kalau sudah ketemu taruh Script berikut dibawahnya
.dateblock {
background: url("http://i1002.photobucket.com/albums/af149/Imtikhan/redcalend.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: 37px;
margin: 0 5px;
text-transform: uppercase;
color: #fff;
}
.day {
color:#ff0000;
font-size: 19px;
width: 37px;
margin: 0 5px;
}
Keterangan : Kodehttp://i1002.photobucket.com/albums/af149/Imtikhan/redcalend.gif
adalah gambar icon kalender.
sobat bisa menggantinya dengan gambar-gambar dibawah ini :
redcalend.gif
http://i1002.photobucket.com/albums/af149/Imtikhan/redcalend.gif
bluecalend.gif
http://i1002.photobucket.com/albums/af149/Imtikhan/bluecalend.gif
pinkcalend.gif
http://i1002.photobucket.com/albums/af149/Imtikhan/pinkcalend.gif
blackcalend.gif
http://i1002.photobucket.com/albums/af149/Imtikhan/blackcalend.gif
yellowcalend.gif
http://i1002.photobucket.com/albums/af149/Imtikhan/yellowcalend.gif
kalau kode color:#ff0000; adalah kode warna tanggal, sobat bisa menggantinya dengan warna yang lain.
langkah selanjutnya yaitu sobat cari kode ini
<data:post.dateHeader/>, cara nyarinya biar gampang Copy kode tersebut,
terus tekan F3 dan Paste di dalam kotak yang disediakan, kalau sudah ketemu ganti kode tersebut dengan Script dibawah ini :
<div class='dateblock'>
<script>date_replace('<data:post.dateHeader/>');</script></div>
Simpan Template
Kalau misalnya tulisan bulan dan tanggalnya terlalu keatas coba tambahkan kode ini padding: 4px 0px 0px 0px;
dibawah kode .month { dan juga dibawah kode .day {
NB : Kalau Tanggalnya berubah menjadi tulisan Undefine itu pasti sobat tidak memperhatikan tutorial ini dari awal.
Coba lihat lagi tutorial ini dari awal dan baca baik-baik perintahnya.
Selamat mencoba