Hantunya | Script archive kalender di blogger- Kalian membutuhkan lebih banyak tutorial? Saya pikir widget ini sangat cocok dengan yang Anda butuhkan karena sangant informatif dan kimunikatif.
Langkah Script archive kalender di blogger :
- Backup template Anda
- Masuk ke menu Edit HTML, tidak perlu centang sana sini lagi sebab CMS blogger sudah baru.
- Cari kode dibawah ini :
4. Ganti kode diatas dengan kode diawah ini :
(
)
Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format
Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format
5. Cari kode dibawah ini :
6. Pastekan kode dibawah ini, diatas pada kode diatas :
Kostumisasi Script archive kalender di blogger :
Anda dapat memilih jenis sesuai dengan yang Anda inginkan :
Diatasnya pastekan kode dibawah ini :
Blue & White :

#calendarDisplay {display:none;}
/* div that holds calendar */
#blogger_calendar { margin:0px auto 0px 0px;width:100%;}
/* Table Caption - Holds the Archive Select Menu */
#bcaption {border:1px solid #C7C7C7;padding:2px;margin:10px 0 0;background:#fff;font:bold 100% Tahoma, Arial, Sans-serif}
/* The Archive Select Menu */
#bcaption select {background:#ffff;border:0 solid #C7C7C7;color:#0080ff;font-weight:bold;text-align:center;}
/* The Heading Section */
table#bcalendar thead {}
/* Head Entries */
table#bcalendar
thead tr th {width:20px;text-align:center;padding:3px; border:1px solid
#C7C7C7; font:bold 100% Tahoma, Arial,
Sans-serif;background:#fff;color:#0080ff;}
/* The calendar Table */
table#bcalendar {border:1px solid #C7C7C7;border-top:0; margin:0px 0 0px;width:100%;background:#fff}
/* The Cells in the Calendar */
table#bcalendar
tbody tr td {cursor:pointer; text-align:center; border-radius:4px;
padding:3px;border:1px solid #C7C7C7; color:#666;font:bold 100% Tahoma,
Arial, Sans-serif;}
/* Links in Calendar */
table#bcalendar tbody
tr td a:link, table#bcalendar tbody tr td a:visited, table#bcalendar
tbody tr td a:active {font-weight:bold;color:#ffffff;
text-decoration:none;}
table#bcalendar tbody tr td a:hover {color:#ffffff; text-decoration:none;}
/* First Row Empty Cells */
td.firstCell {visibility:visible;}
/* Cells that have a day in them */
td.filledCell { background:#fff;}
td.filledCell:hover { background:#dddddd;}
/* Cells that are empty, after the first row */
td.emptyCell {visibility:hidden;}
/* Cells with a Link Entry in them */
td.highlightCell {background:#53A9FF;border:1px solid #C7C7C7}
td.highlightCell:hover {background:#72B9FF;border:1px solid #C7C7C7}
/* Table Footer Navigation */
table#bcNavigation
{width:100%;background:#fff;border:1px solid
#C7C7C7;border-top:0;color:#0080ff;font:bold 100% Tahoma, Arial,
Sans-serif;}
table#bcNavigation a:link {text-decoration:none;color:#0080ff}
table#bcNavigation a:hover{text-decoration:underline;}
td#bcFootPrev {width:10px;}
td#bcFootAll{text-align:center;}
td#bcFootNext {width:10px;}
ul#calendarUl {margin:5px auto 0!important;}
ul#calendarUl li a:link {}
Yellow & Black :

#calendarDisplay {display:none;}
/* div that holds calendar */
#blogger_calendar { margin:5px 0 5px 10px;width:98%;}
/* Table Caption - Holds the Archive Select Menu */
#bcaption {border:1px solid #666666;padding:2px;margin:10px 0 0;background:#333333;font:bold 100% Tahoma, Arial, Sans-serif}
/* The Archive Select Menu */
#bcaption select {background:#333333;border:0 solid #333333;color:#dddddd;font-weight:bold;text-align:center;}
/* The Heading Section */
table#bcalendar thead {}
/* Head Entries */
table#bcalendar
thead tr th {width:20px;text-align:center;padding:2px; border:1px
outset #666666; font:bold 100% Tahoma, Arial,
Sans-serif;background:#333333;color:#dddddd}
/* The calendar Table */
table#bcalendar {border:1px solid #666666;border-top:0; margin:0px 0 0px;width:95%;background:#333333}
/* The Cells in the Calendar */
table#bcalendar
tbody tr td {text-align:center;padding:2px;border:1px outset #666666;
color:#F5F202;font:bold 100% Tahoma, Arial, Sans-serif;}
/* Links in Calendar */
table#bcalendar
tbody tr td a:link, table#bcalendar tbody tr td a:visited,
table#bcalendar tbody tr td a:active {font-weight:bold;color:#ffffff;
text-decoration:underline;}
table#bcalendar tbody tr td a:hover {color:#ffffff; text-decoration:none;}
/* First Row Empty Cells */
td.firstCell {visibility:visible;}
/* Cells that have a day in them */
td.filledCell {}
/* Cells that are empty, after the first row */
td.emptyCell {visibility:hidden;}
/* Cells with a Link Entry in them */
td.highlightCell {background:#000000;border:1px solid #666666}
/* Table Footer Navigation */
table#bcNavigation
{width:95%;background:#333333;border:1px solid
#666666;border-top:0;color:#F5F202;font:bold 100% Tahoma, Arial,
Sans-serif;}
table#bcNavigation a:link {text-decoration:none;color:#F5F202}
table#bcNavigation a:hover{text-decoration:underline;}
td#bcFootPrev {width:10px;}
td#bcFootAll{text-align:center;}
td#bcFootNext {width:10px;}
ul#calendarUl {margin:5px auto 0!important;}
ul#calendarUl li a:link {}
7. Save Template Anda
8. Masuk ke Menu Layout > Add Gadget > pilih Blog Archive :
9. Atur Blog Archive seperti pada gambar dibawah ini :
10. Save Kembali Template Anda.
Semoga Script archive kalender di blogger bermanfaat bagi anda pencinta blogger.