Label Cloud

Search This Blog

30 March 2010

online counter Calendar Icon Pada Post Date Header

Assamualaikum , Msue nak kongsi lagi ngan korang sume bagaiamana nak buat Calendar Icon Pada Post Date Header .

1. Login ke Blogspot .

2. Klik Settings - Formatting

3. Cari Date Header Format

4. Setkan seperti dibawah .


YYYY-MM-DD


5. Save Setting

6. Klik Layout - Edit HTML(Tandakan pada Expand Widget)

7. Cari kod di bawah(Gunakan CTRL+F untuk memudahkan korang mencarinya .


<head>



8. Copy kod dibawah ini .


<!-- orangevolt calendar widget -->
<script src='http://anniebluesky.googlepages.com/fastinit.js'/>
<script src='http://anniebluesky.googlepages.com/prototype-1.5.0.js'/>
<script src='http://anniebluesky.googlepages.com/orangevolt-calendar.js'/>
<link href='http://anniebluesky.googlepages.com/calendar.css' rel='stylesheet' type='text/css'/>
<!-- end calendar widget -->



9. Pastekan di bawahnya .

10. Cari kod di bawah(Gunakan CTRL+F untuk memudahkan korang mencarinya .


<data:post.dateHeader/>



11. Tukarkannya dengan kod dibawah ini


<h2 class='date-header'>
<data:post.dateHeader/>
</h2>



12. Cari kod di bawah ini atau seumpamanya .



/* Posts
-----------------------------------------------



13. Copy kod dibawah ini .


/* Calendar
----------------------------------------------- */
span.cal {
background:transparent url('CALENDAR IMAGE. URL') no-repeat scroll 0%;
float:left;
height:49px;
width:48px;
font-family:"Trebuchet MS",Tahoma,Arial;
font-size-adjust:none;
font-style:normal;
font-variant:normal;
font-weight:normal;
margin-right: 13px;
}

span.cal_month {
color:#FFFFFF;
display:block;
font-size:11px;
line-height:11px;
margin-left:-3px;
padding-top:2px;
text-align:center;
text-transform:uppercase;
}

span.cal_day {
color:#999999;
display:block;
font-size:18px;
line-height:18px;
margin-left:-3px;
padding-top:8px;
text-align:center;
text-transform:uppercase;
}



14. Pastekan diatasnya .


Note : Pada highlight gantikan ngn salah satu URL Kalendar dibawah .

KLIK SINI -->study




Cara mendapatkan URL image di atas

- Right click pada salah satu image berkenaan .

- Klik Properties





- Copy URL image .



15. Preview dan Save template .:okay:yahoo


Via - BlogU




Tinggalkan Komen Anda Disini