Cara Buat Navi Header Like Me


Anneyeong ^^ Today I nak buat Tuto untuk buat Navi Header Like Me ^^ CR BY : Kak Arrien :D Ni boleh untuk Template Designer/Blogskin . Ini sebenarnya basecode from satu Skin nih :D

Template Designer

1. Sign In -> Dashboard -> Layout -> Edit HTML/JavaScript
2. Copy code dibawah dan pastekan dalam Edit HTML/JavaScript tadi

<style>
@font-face{
font-family:agentletouch;
src:url(http://static.tumblr.com/dep4vzc/GkJmxp429/a_gentle_touch.ttf);}
@font-face {
    font-family: Bebas Neue;
    src: url(http://static.tumblr.com/cvlbtjz/cnsln9tpp/bebasneue.otf);
}
#title2 {
    font: normal 25px "Bebas Neue";
    text-shadow: 0 0 0px #111;
    color: #ccc;
    text-align:center;
    background: url(URL BACKGROUND);
    padding: 20px;
    background-position:50% 50%;
    border-bottom: 10px solid #fff;
    box-shadow: 0px 0px 10px #aaa;
    width: 97%;
    z-index: 9999!important;
    top: 0px;
    position: absolute;
    left: 0px;
}
</style>
<div id="title2">
<div style=" text-width: 600px;  color: #fff; font-family:agentletouch; font-size:50px;  text-align: center;text-shadow: 0 0 10px #000; ">
" YOUR BLOG NAME'S "
</div> <br />
<div class="title2"><div class="btd">
☮<a class="n" href="LINK">ABOUT</a>☮
<a class="n" href="LINK">ENTRY</a>☮
<a class="n" href="LINK">ASK.FM</a>☮
<a href="LINK">STUFF</a>☮
<a href="LINK">BIAS</a>☮
<a href="LINK">ARTWORK</a>☮
<div></div></div></div></div>
3. Save

 Blogskin

1. Sign In -> Dashboard ->Template
2. Tekan F3 and search code nih :

</style>

3. Copy code dibawah dan pastekan di  bawah code tadi .

style>
@font-face {
    font-family: Bebas Neue;
    src: url(http://static.tumblr.com/cvlbtjz/cnsln9tpp/bebasneue.otf);
}
#title2 {
    font: normal 25px "Bebas Neue";
    text-shadow: 0 0 10px #111;
    color: #fff;
    text-align:center;
    background: url(URL BACKGROUND);
    padding: 20px;
    background-position:50% 50%;
    border-bottom: 10px solid #fff;
    box-shadow: 0px 0px 10px #aaa;
    width: 97%;
    z-index: 9999!important;
    top: 0px;
    position: absolute;
    left: 0px;
}
</style>
<div id="title2"><center>
<div style=" text-width: 600px;  color: #fff; font-family:agentletouch; font-size:50px;  text-align: center;text-shadow: 0 0 10px #000; ">
" YOUR BLOG NAME'S "
</div> </center><br>
?
<span class="title2" onClick="document.getElementById('main').innerHTML=document.getElementById('o').innerHTML">home</span> ?
<span class="title2" onClick="document.getElementById('main').innerHTML=document.getElementById('k').innerHTML">about</span> ?
<span class="title2" onClick="document.getElementById('main').innerHTML=document.getElementById('p').innerHTML">linkies</span> ?
<span class="title2" onClick="document.getElementById('main').innerHTML=document.getElementById('s').innerHTML">tutorial</span> ?
<span class="title2" onClick="document.getElementById('main').innerHTML=document.getElementById('u').innerHTML">free page</span> ?
</div>

4. Preview & Save

NOTE :

AAA : Url Background navi header korg
AAA : Nama Blog Korg
AAA : Link Page Korang
AAA : Pastikan ianya sama dengan korang punya key untuk post
AAA : Pastikan sama dengan korang punya keycode untuk page tersebut .

Weh korang , I tak tau nak jelaskan untuk BLOGSKIN macam mana XD Pandai pandailah korang try sampai berjaya XD

No comments:

Post a Comment