Simple Navigation (Like mine)
Annyeong! Aku balik lagi dengan tuto... Simple navigation kayak punya-ku itu.. Oke lah. Cekidottt..
- Dashboard > Template > Edit HTML
- Copy dan paste code di bawah untuk navigation
a.choco {
display:inline-block;
-webkit-transition: 0.9s;
-moz-transition: 0.9s;
padding-top:3px;
width:70px;
letter-spacing:2px;
text-decoration:none;
font-family:TREBUCHET MS;
font-size:10px;
height:20px;
text-transform:uppercase;
color: #fff;
border:2px solid #fff;
text-align:center;
background:#FFE4E4;
cursor:crosshair;
border-radius:0px;
}
merah: lebar kotak navi
orange: lebar spasi
hijau: jenis font
aqua: font size
blue: warna font
fuchsia: posisi font. misalnya center, right, left
brown: warna backgroud navi
- Copy code di bawah untuk hover navi (paste code ini di bawah code sebelumnya)
a.choco:hover{
border:1px solid #fff;
color: #fff;
background:#DAF1FF;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
merah: warna border hover
orange: warna font hover
hijau: warna background hover
- Copy dan paste code di bawah di bagian navigation
<a class="choco" onClick="document.getElementById('post').innerHTML=document.getElementById('nama navi').innerHTML" title="">NAMA NAVI</a> <span style="padding:4px;"></span>
merah: nama navi
*Note: itu baru satu kotak navi. Kalau mau banyak kotaknya, dan warna-nya selang-seling, bisa contoh code di bawah.
a.choco1 {
display:inline-block;
-webkit-transition: 0.9s;
-moz-transition: 0.9s;
padding-top:3px;
width:70px;
letter-spacing:2px;
text-decoration:none;
font-family:TREBUCHET MS;
font-size:10px;
height:20px;
text-transform:uppercase;
color: #fff;
border:2px solid #fff;
text-align:center;
background:#FFE4E4;
cursor:crosshair;
border-radius:0px;
}
Setelah hover
a.choco1:hover{
border:1px solid #fff;
color: #fff;
background:#DAF1FF;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
Jadi nanti tulis di bagian navigationnya bisa contoh di bawah
<a class="choco" onClick="document.getElementById('post').innerHTML=document.getElementById('nama navi').innerHTML" title="">NAMA NAVI</a> <span style="padding:4px;"></span>
<a class="choco1" onClick="document.getElementById('post').innerHTML=document.getElementById('nama navi').innerHTML" title="">NAMA NAVI</a> <span style="padding:4px;"></span>
Kalo udah selesai, warnanya bakalan beda-beda kalo kamu emang pasang warnanya selang seling.
Bingung? Jangan ragu untuk comment atau bilang aku di c-box
.
Paii paii
Labels: Tutorial
Simple Navigation (Like mine)
Annyeong! Aku balik lagi dengan tuto... Simple navigation kayak punya-ku itu.. Oke lah. Cekidottt..
- Dashboard > Template > Edit HTML
- Copy dan paste code di bawah untuk navigation
a.choco {
display:inline-block;
-webkit-transition: 0.9s;
-moz-transition: 0.9s;
padding-top:3px;
width:70px;
letter-spacing:2px;
text-decoration:none;
font-family:TREBUCHET MS;
font-size:10px;
height:20px;
text-transform:uppercase;
color: #fff;
border:2px solid #fff;
text-align:center;
background:#FFE4E4;
cursor:crosshair;
border-radius:0px;
}
merah: lebar kotak navi
orange: lebar spasi
hijau: jenis font
aqua: font size
blue: warna font
fuchsia: posisi font. misalnya center, right, left
brown: warna backgroud navi
- Copy code di bawah untuk hover navi (paste code ini di bawah code sebelumnya)
a.choco:hover{
border:1px solid #fff;
color: #fff;
background:#DAF1FF;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
merah: warna border hover
orange: warna font hover
hijau: warna background hover
- Copy dan paste code di bawah di bagian navigation
<a class="choco" onClick="document.getElementById('post').innerHTML=document.getElementById('nama navi').innerHTML" title="">NAMA NAVI</a> <span style="padding:4px;"></span>
merah: nama navi
*Note: itu baru satu kotak navi. Kalau mau banyak kotaknya, dan warna-nya selang-seling, bisa contoh code di bawah.
a.choco1 {
display:inline-block;
-webkit-transition: 0.9s;
-moz-transition: 0.9s;
padding-top:3px;
width:70px;
letter-spacing:2px;
text-decoration:none;
font-family:TREBUCHET MS;
font-size:10px;
height:20px;
text-transform:uppercase;
color: #fff;
border:2px solid #fff;
text-align:center;
background:#FFE4E4;
cursor:crosshair;
border-radius:0px;
}
Setelah hover
a.choco1:hover{
border:1px solid #fff;
color: #fff;
background:#DAF1FF;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
Jadi nanti tulis di bagian navigationnya bisa contoh di bawah
<a class="choco" onClick="document.getElementById('post').innerHTML=document.getElementById('nama navi').innerHTML" title="">NAMA NAVI</a> <span style="padding:4px;"></span>
<a class="choco1" onClick="document.getElementById('post').innerHTML=document.getElementById('nama navi').innerHTML" title="">NAMA NAVI</a> <span style="padding:4px;"></span>
Kalo udah selesai, warnanya bakalan beda-beda kalo kamu emang pasang warnanya selang seling.
Bingung? Jangan ragu untuk comment atau bilang aku di c-box
.
Paii paii
Labels: Tutorial
Cupcakes Time!!
Meet me the webmistress peeps!
The Girl Behind The Screen:
Just a ordinary girl who obsessed with Korea and Japan. Who's her? Guess yooo :D Whatever.. My name its Shabrina. Shabrina L. Rais. Now being a 6th Grade student in Al-Jannah Islamic Fullday School (yippee)! Be a human girl since 5 May 2002. Give me present? (LOL! Whut?). You have to know, I'm addicted with KPOP. Woohoo! Especially SNSD. You don't know them? Whutevaa.. Being a SONE since 2012. Beggining Sone, huh? Okay! Time to go :D Bay bayy '-')/
Call me Cupcakes okay! Byee!!
Biased:
1. Kim Taeyeon - Girls' Generation: ULTIMATE one huh? Yapp.. my first bias :D I think, I addicted to much with her (LOL)! Even I said my face it's look like Taeyeon maybe? #justkidding (whatever).
2. Tiffany Hwang - Girls' Generation: The 2nd. Ship this with Taeng >< I just love her same like Taeng.. Locksmith forever!!!
3. Jessica Jung - Girls' Generation: The 3rd. Wae so much SNSD bias? Because my fandom it's SONE. So, im focused with SNSD. (See it at F.A.Q).
4. Krystal Jung - F(x): The 4th. The sister of Jessica :D Oh my god! So much addicted with her >< Krystalized! That was me! Oh my Jung! I LOVE YAA!
5. Choi Sulli - F(x): The 5th. My Barbie Doll Sulli! Really like her pout! OMG, so cute >< Antis? Go away! Sulli it's mine! (LOL)
6. Byun Baekhyun - EXO: The last but not the least, Baekhyun! The one of my bias who is namja ^^ GO AWAY! BAEKHYUN MINE!! HUH?! :p Just kidding :D
About this site:
This blog it's officialy made by Shabrina L. Rais. For the first time, this blog named
http://miss-animeee.blogspot.com/ I don't know why I named that. I just don't have any idea. And the template it's soo simple! The VERY SIMPLE template. And I'm so happy I have a blog. My mom telling me about a Blogger World. So, in Desember 2012, i made my very first blog. I forgot for the link. I just remember the tittle: SHABRINA BLOG. And the blog was so empty >< And then, I made this blog at March 9 2013. Before it, made a kpop blog :)
One day, I saw Vesya's blog. You know the url right? It's
http://vesya-lithaa.blogspot.com/. Then, I see her blog and I think that was a AWESOME blog. And then, I try to find a inspired thing from Vesya's blog. One day, I asked her, "What's header?". I just can't imagine how a header looks! When I found a tutobies blog and it's explains about HEADER. Then, I started to making a header in photoscape and photoshop. But, I can't use it on blogger.
And then, I found Nurul Atiqah's blog. I found a nice header and the texts was saying: 'SNOW FLOWERS'. I decided to use that header for my own blog. When I use it, I already know how to use header at blogspot. When I see my header, I think, I'm gonna change my website name to
http://snow-flowerss.blogspot.com. I think, thats a good name for my blog :)
Some people asked me: "What's template do you use for your blog? Classic or Designer?". Hard question when I don't know everything about a CLASSIC TEMPLATES. And then, I see someone blogs who used a classic template and I'm so corious because her blog it's so awesome! And then I asked her where she get this template? And the she said, this is blogskins. You can find it at
http://blogskins.com and then I know all about blogskins and addicted with blogger's world ^^
OPEN FOR EVERYONE!!! ALWAYS OPEN :D (UNDER CONTRUCTION FOR BANNERS)
Already see my affies? Do you check the rules for affies here?
Tell me in cbox if you wanna ex-links banners