Assalamualaikum & selamat sejahtera...for the first time aku nak kongsi ilmu dengan semua pengguna blogger.. nak ambik je..tak payah nak credit bagai..sebab benda ni pun aku belajar dari org lain jugak.
first, Revert to CLASSIC TEMPLATE.
lepas tu, DELETE semua
code yg ada kat EDIT HTML tu .
then, copy code kat bwah ni kat EDIT HTML yg kosong tu .
<html>
<head>
<center><img
src="URL HEADER"
/></center>
<title>NAMA BLOG</title>
merah :
URL header
biru : nama/tajuk blog
biru : nama/tajuk blog
4. Then copy code
bawah ni dan paste kat BAWAH code tadi .
<style type="text/css">
#navbar-iframe {
display: none;
}
body {
background:url(URL BACKGROUND);
font-family: verdana, tahoma, sans-serif;
background-attachment:fixed;
cursor: url(URL Cursor),
auto;
}
a:link, a:visited {
color:#CC99FF;
text-decoration:none;
}
a:hover {
color: #549DF1;
border-bottom:1px solid #FF99D5;
}
</style>
<body oncontextmenu='return false;'>
<br>
merah : URL background
biru : url cursor
hijau : code warna
5. dah siap tu , tekan CTRL+F dan code </style>
klau dah jumpa , paste kod di bawah ni
dekat atas code </style> tu .
.content {
background:#ffffff;
color:#666666;
font-size: 11px;
padding:14px;
width:600px;
border-radius:10px;
text-align:justify;
}
.bar {
background: #ffffff;
color: #666666;
font-size: 11px;
padding: 8px;
width: 230px;
border-radius: 10px;
text-align: justify;
}
.main-title {
color:#3BBDEC;
font-size:14px;
padding:3px;
border-bottom:1px solid #999999;
}
.sec-title {
color: #3BBDEC;
font-style:italic;
font-size:10px;
margin-bottom:2em;
}
blockquote {
border: 1px solid #000000;
padding: 2px;
}
merah : warna tulisan
hijau : warna border sideber
oren : warna border blockqoute
6. Lepas dah siap , CTRL+F dan cari kod <body
oncontextmenu='return false;'>
7. Copy code di bawah ni dan pastekan DI
BAWAH code
<body oncontextmenu='return false;'> tadi .
<table style="line-height: 17px;"
width="900" border="0" align="center"
cellspacing="5">
<tbody><tr>
8. Then , copy code dibawah ni dan pastekan DI
BAWAH code tadi .
<td valign="top" style="width:600px;
padding:10px; border-radius:10px; background:#ffffff;
font-size:11px;"><div id="content"><blogger><div
class="main-title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div><div
class="sec-title"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader>
| <$BlogItemDateTime$> | <a
href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$>
comments</a></BlogItemCommentsEnabled></div><$blogitembody$></blogger><br><center><OlderPosts><a
href=<$OlderPosts$>>Older Post</a> </OlderPosts>
<NewerPosts> | <a href=<$NewerPosts$>>Newer
Post</a></NewerPosts></center></div></div></td>
9. Copy code dekat bawah ni dan pastekan DIBAWAH kod
tadi .
<td
valign="top" width="230px"><div
class="bar">
<div class="main-title">TITLE
SIDEBAR</div>ISI SIDEBAR</div><br>
<div class="bar"><div
class="main-title">TITLE SIDEBAR</div>ISI
SIDEBAR</div><br>
<div class="bar"><div
class="main-title">TITLE SIDEBAR</div>
ISI SIDEBAR</div><br>
</td>
biru : tajuk sideber cth: about , link , friend
10. Copy code dekat bawah ni dan pastekan dekat bawah
sekali .
</table></body></head></html>
Sekarang . code untuk buat navigate pulak .
1) CTRL+F dan cari kod </style> .
Copy code dekat bawah ni dan pastekan DI ATAS kod
</style>
a.cute {
background: #FFE2EA;
padding: 2px;
letter-spacing: 2px;
display: inline-block;
width: 190px;
color: #FF789F;
border: 1px #FF789F solid;
}
a.cute:hover {
border: 1px #FF789F solid;
background : #FFE2EA;
color: #FF789F;
}
biru : warna
background navigations
hijau : warna
tulisan navigations
oren : warna
border navigations
2) Ingat tak code </td> Yang
step no-9 . Copy kod bawah ni dan pastekan DI ATAS kod
</td> tadi .
<div class="bar"><div
class="main-title">NAVIGATIONS</div><br><center><a
class="cute"
onClick="document.getElementById('content').innerHTML=document.getElementById('me').innerHTML"
title="About">About</a><a class="cute"
onClick="document.getElementById('content').innerHTML=document.getElementById('love').innerHTML"
title="Linkies">Links</a><a class="cute"
onClick="document.getElementById('content').innerHTML=document.getElementById('you').innerHTML"
title="Posts">Entries</a></div><br>
3) Copy code di bawah dan paste BAWAH kod tadi .
<div id="me"
style="display:none;"><div class="main-title">The
Webmaster</div><br>
biodata 0r what so ever
</div><div id="love"
style="display:none;"><div
class="main-title">Affies&Linkies</div><br><a
href="blogger.com"/>Friends</a> | <a
href="blogger.com"/>Friends</a> | <a
href="blogger.com"/>Friends</a> | <a
href="blogger.com"/>Friends</a> | <a
href="blogger.com"/>Friends</a> | <a
href="blogger.com"/>Friends</a></div>
<div id="you"
style="display:none;"><blogger><div
class="main-title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div><div
class="sec-title"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader>
| <$BlogItemDateTime$> | <a
href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$>
comments</a></BlogItemCommentsEnabled></div><$blogitembody$></blogger><br><center><OlderPosts><a
href=<$OlderPosts$>>Older Post</a> </OlderPosts>
<NewerPosts> | <a href=<$NewerPosts$>>Newer
Post</a></NewerPosts></center></div>
tamat...
peringatan! sebelum revert template tu..save dulu code asal tu..save kat new post pun takpe..kalau dah siap edit semua, preview dulu..jadi ke tidak..kalau jadi..boleh tekan save..
selamat mencuba!
