Wednesday, August 1, 2012

Tutorial : Blog Archive in Calendar Mode

Hari ni atin ada tutorial baru >< . Tak taulah baru ke tak LOL --' . Selalunya korang guna blog archive jenis drop down kan? Ok kali ni atin nak share buat jenis calender mode punye . Kalau tak tahu bawah ni contohnya k .



BLOGSKIN

 Dashboard > Template > Edit HTML
 Tekan Ctrl + f (serentak) dan cari code </stlye>
 Copy code bawah ni

<style type="text/css">
#blogCalendar {
display:block;
text-algin:center;
border:3px solid #F6358A;
width:90%;
background: #ffffff;
}

#CalendarCaption a {
text-decoration:none;
}

#CalendarCaption {
border-bottom: 2px solid #F6358A;
width:85%;
margin:auto;
}

#CalendarTable a {
font-weight:bold;
color: #F6358A;
}

.Today {
background: #F6358A;
font-weight:bold;
text-decoration:none;
}

#CalendarFooter {
font-weight:bold;
margin-top:5px;
margin-bottom:5px;
background: #FFC0CB;
}

.yearInput {
color: #000000;
background: #F6358A;
}

.monthTable {
color: #000000;
background: #F6358A;
}
</style></center>
 Paste di bawah code </stlye>

 Next , Copy code bawah ni pulak
<center><div id="blogCalendar"></div>
<script type="text/javascript" src="http://lvchen-recentcomments.googlecode.com/svn/trunk/Calendar/1.0/calendar_pack.js"></script>
<script type="text/javascript">
Calendar.base="NAMABLOG.blogspot.com";
Calendar.timeZone="+08:00";
Calendar.timeZoneCheck = true;
Calendar.drawTable();
</script>
 Paste kat mana2 yang korang suka k
 Review and Save.





DESIGNER

 Design > Add a Gadget > Html
 Copy semua code dibawah then pastekan dalam Html

<center><div id="blogCalendar"></div>
<script type="text/javascript" src="http://lvchen-recentcomments.googlecode.com/svn/trunk/Calendar/1.0/calendar_pack.js"></script>
<script type="text/javascript">
Calendar.base="NAMABLOG.blogspot.com";
Calendar.timeZone="+08:00";
Calendar.timeZoneCheck = true;
Calendar.drawTable();
</script>
<style>
#blogCalendar {
display:block;
text-algin:center;
border:3px solid #F6358A;
width:90%;
background: #ffffff;
}

#CalendarCaption a {
text-decoration:none;
}

#CalendarCaption {
border-bottom: 2px solid #F6358A;
width:85%;
margin:auto;
}

#CalendarTable a {
font-weight:bold;
color: #F6358A;
}

.Today {
background: #F6358A;
font-weight:bold;
text-decoration:none;
}

#CalendarFooter {
font-weight:bold;
margin-top:5px;
margin-bottom:5px;
background: #FFC0CB;
}

.yearInput {
color: #000000;
background: #F6358A;
}

.monthTable {
color: #000000;
background: #F6358A;
}
</style></center>

 Review and Save.


merah : kod warna SINI
biru : nama blogspot 
cth : (fatinhalid.blogspot.com)

No comments: