Tutorial : Simple navigation

Hello semua :) Hari ini, saya nak ajar awak tentang simple navigation yang paling simple gilalah. 

Saya credit unknown. Blog dia sungguh comel.

1. Log in > Dashboard > Layout > Add a Gadget > HTML/JavaScript.

2. Copy code di bawah.

<style type="text/css">
a.linkies {
font-size: 11px;
font-family: damai pelajar;
display:inline-block;
text-align:center;
border:2px solid #FAE3EC;
border-radius:5px;
width: 45px;
color: #BFBFBF;
background:#fff;
padding:1px;
margin:2px;
text-decoration: none;
-webkit-transition-duration:1200ms;
}
a.linkies:hover          {
display:inline-block;
text-align:center;
border-radius:1px;
width: 50px;
color: #fff;
background: #FFE4E4;
-webkit-transition-duration:1200ms;
}
a.linke {
font-size: 11px;
font-family: damai pelajar;
display:inline-block;
text-align:center;
border:2px solid #FAE3EC;
border-radius:5px;
width: 45px;
color: #fff;
background: #FFE4E4;
padding:1px;
margin:2px;
text-decoration: none;
-webkit-transition-duration:1200ms;
}
a.linkie:hover {
display:inline-block;
text-align:center;
border-radius:1px;
width: 50px;
color: #BFBFBF;
background:#fff;
-webkit-transition-duration:1200ms;
}
</style>

Dah copy ?
3. Paste dekat HTML/JavaScript.

Dah paste?  Now copy code di bawah ni pula

<a class="linkie"  href="http://blogspot.com/">Tajuk</a>
<a class="linkies"  href="http://blogspot.com/">Tajuk</a>
<a class="linkie"  href="http://blogspot.com/">Tajuk</a>
<a class="linkies"  href="http://blogspot.com/">Tajuk</a>

Dah copy ? Paste dekat bawah code tadi. Macam ni.

<style type="text/css">
a.linkies {
font-size: 11px;
font-family: damai pelajar;
display:inline-block;
text-align:center;
border:2px solid #FAE3EC;
border-radius:5px;
width: 45px;
color: #BFBFBF;
background:#fff;
padding:1px;
margin:2px;
text-decoration: none;
-webkit-transition-duration:1200ms;
}
a.linkies:hover          {
display:inline-block;
text-align:center;
border-radius:1px;
width: 50px;
color: #fff;
background: #FFE4E4;
-webkit-transition-duration:1200ms;
}
a.linke {
font-size: 11px;
font-family: damai pelajar;
display:inline-block;
text-align:center;
border:2px solid #FAE3EC;
border-radius:5px;
width: 45px;
color: #fff;
background: #FFE4E4;
padding:1px;
margin:2px;
text-decoration: none;
-webkit-transition-duration:1200ms;
}
a.linkie:hover {
display:inline-block;
text-align:center;
border-radius:1px;
width: 50px;
color: #BFBFBF;
background:#fff;
-webkit-transition-duration:1200ms;
}
</style>
<a class="linkie"  href="http://blogspot.com/">Tajuk</a>
<a class="linkies"  href="http://blogspot.com/">Tajuk</a>
<a class="linkie"  href="http://blogspot.com/">Tajuk</a>
<a class="linkies"  href="http://blogspot.com/">Tajuk</a>

 Then save :) Senang kan?

Kalau nak tambah link... Copy code bawah ni.

<a class="linkie"  href="http://blogspot.com/">Tajuk</a>
<a class="linkies"  href="http://blogspot.com/">Tajuk</a>

Good luck :) Kalau menjadi, comment kayh :)

 Back to Tutorial