Assalamualaikum :)
Tuto nie direq oleh wawa. Tak tahu navigate network tu apa?? tengok gambar bawah nie : D btw credit to owner.
| Live Preview |
Template Designer.
1. Dashboard > Layout > Add Gadget > HTML/JavaScript.
2. Next,copy code nie :
<style>
a.link {
font-size: 9px;
font-family: Trebuchet Ms;
display:inline-block;
text-align:center;
width: 20px;
color: #fff;
background:#ccc;
padding:3px;
margin:2px;
text-decoration: none;
-webkit-transition-duration:1200ms;
}
a.link:hover{
display:inline-block;
text-align:center;
width: 20px;
color: #fff;
background:#eee;
-webkit-transition-duration:1200ms;
}
</style>
</center>
<div style='font:9px georgia;text-align:center;margin-top:2px;'>
<center><a class="link" href="LINK">FB</a>
<a class="link" href="LINK">TW</a>
<a class="link" href="LINK">TB</a>
<a class="link" href="LINK">BS</a>
<a class="link" href="LINK">AF</a>
</center>
4. Then Paste kan dalam HTML/JavaScript.
5. Save!.
Classic Template / Blogskin.
1. Dashboard > Template > Edit HTML.
2. Tekan Ctrl+F serentak dan cari code </style>
3. Now copy code nie :
a.link {
font-size: 9px;
font-family: Trebuchet Ms;
display:inline-block;
text-align:center;
width: 20px;
color: #fff;
background:#ccc;
padding:3px;
margin:2px;
text-decoration: none;
-webkit-transition-duration:1200ms;
}
a.link:hover{
display:inline-block;
text-align:center;
width: 20px;
color: #fff;
background:#eee;
-webkit-transition-duration:1200ms;
}
4. Paste kan ATAS code </style> tadi.
5. Sekarang copy code nie pula :
</center>
<div style='font:9px georgia;text-align:center;margin-top:2px;'>
<center><a class="link" href="LINK">FB</a>
<a class="link" href="LINK">TW</a>
<a class="link" href="LINK">TB</a>
<a class="link" href="LINK">BS</a>
<a class="link" href="LINK">AF</a>
</center>
6. Paste kan di bahagian sidebar or mana-mana yang korang suka.
Preview and Save!.
Note :
Orange : Background color.
Blue : Hover background color.
Red : Link site.
6 Comments