28 January 2009

Change Your Posting Date With Calendar Icon

Salam semua..
Bekerja kah anda hari ni??
kuang...kuang..ku bercuti sakan lagi ni..
haiihhhh...kebosanan melanda..
tp xpe..aku nak bagi tuts pasal cara nak tukar tarikh entri kepada bentuk calendar..

meh aku ajar step by step yeee...

  • Settings
  • Formatting
  • Change the date header format to mm.dd.yyyy for example 1.20.2009
  • Save

Next..

  • Layout (*before you guys start the step make sure backup your template first)
  • Edit HTML
  • Mark the Expand Widget Templates box
  • Find code &<TITLE><data:blog.pageTitle/></TITLE>
  • Paste below script after the code

<SCRIPT type='text/javascript'>
//<![CDATA[
/*********************************/
/* http://muniiera.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>


Cari another code


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

or else cari code di bawah jika code di atas xjumpa


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


paste code di bawah selepas mencari code di atas
.dateblock {
background: url("http://i215.photobucket.com/albums/
cc133/muniiera/calendar/black.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;
padding: 4px 0px 0px 0px;
}

.day {
color:#000000;
font-size: 19px;
width: 37px;
margin: 0 5px;
padding: 4px 0px 0px 0px;

}
Next step find code <data:post.dateheader>
dan tukar code di atas dengan code di bawah

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

Kemudian Save the templates

got it??
ok now you guys can change the icon of your calendar
example black.gif to blue.gif

Photobucketblack.gif Photobucket blue.gif Photobucketblue2.gif

Photobucketgreen.gif Photobucketorange.gif Photobucketpink.gif

Photobucketred.gif Photobucket yellow.gif Photobucketpurple.gif


(jika anda xmahu guna aku punya image hosting boleh je amik calendar2x tu n letakkan dlm image hosting korang sendiri k)

code color:#000000; adalah untuk memaparkan color tarikh anda.
ingin mendapatkan code color yg lain sila ke sini

Selamat Mencuba

mood:
:bunny1:
Munirah Abd's Facebook profile

4 comments:

  1. huh...aku wish... aku have time nak follow tutorial ko lah dik.... nan ado lagik.. :-(

    ReplyDelete
  2. adenium: xpe kak nnti ada free time boleh je nak follow...sentiasa ada... =)

    ReplyDelete
  3. blog ko dah jadi blog tutorial ke mun??hehe

    ReplyDelete
  4. ms munirah,
    teach me how to add songs to profile/page bole.?

    ReplyDelete

Dear readers,comments make me happy and make me smile!! Yes!! your comments will be moderated.Dont worry about that ok.. Its a procedure to kick out spammer and mosquitos.Thank you.

# NO SPAM OK!!!
# Comment is awaiting on moderation.
# No harsh word!!


Thanks for your comment!! *wink*