Author
Hi I'm a sixteen years old girl from Indonesia. Stalk me here.
Tutorials
All the list of tutorials, please click here. Thank you.
Credit
Tempelate by yours trully. Do not open my page source. I will respect you if you're respect me.

Edit Simple Tempelate (Part 02) // Tuesday, July 26, 2011

Assalamu'alaikum...




Tutorial ini adalah lanjutan dari tutorial Lettha sebelumnya :) nah, lanjutan dari tutorial INI

1. TRANSPARENTKAN HEADER
Sekarang, kita akan men-transparentkan header di Simple Tempelate agar tampak seperti Denim Tempelate ;) so ikuti langkah langkah ini sebaik baiknya ok?

Dashboard >>Design >>Edit HTML

Cari kode:
/* Mobile

Pastekan kode nyh diatasnya:
.header-outer, .content-inner { background-color: transparent; }
.main-outer, .tabs-outer { background-color: $(content.background.color);}

kalau kode tersebut gagal, silakan pakai kode yang ini dan pastekan diatas kode yang kamu cari tadi:
.tabs-inner .widget ul { margin: 0px -15px;}
.content-inner{padding: 0px;}


PREVIEW DULU ! Kalau sudah puas, click Save Tempelate :)

2. MEMBUAT ROUND CORNER HEADER
Nah, step kali ini lah yang bisa memberi kesan "Denim Tempelate" di blog "Simple Tempelate" kamu. Untuk cara membuat header melengkung kayak header Lettha, lihat tutorial nya di SINI

Lalu adjust kelebaran header agar sampai sama dengan body blog. Caranya gimana? kayak gini:

Dashboard >>Design >>Tempelate Designer

Click Adjust Width lalu adjust width body blog sampai sama lebarnya dengan header kamu ;)


3.BUANG BORDER SHADOW SEKELILING BLOG

Kalau anda sudah buang benda putih di header Simple Tempelate kan nanti ada shadow/bayang bayang warna abu abu kan di sekeliling blog? nah begini cara delete shadow tersebut:

Dashboard >>Design >>Edit HTML

Cari kode:
.content-outer {

Dibawah kode itu ada kode ini kan?
-moz-box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);
-webkit-box-shadow: 0 0 $(content.shadow.spread.webkit) rgba(0, 0, 0, .15);
-goog-ms-box-shadow: 0 0 $(content.shadow.spread.ie) #333333;
box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);

Delete semua kode itu kecuali kode .content-outer {

PREVIEW DULU ! Lalu Save Tempelate kalau sudah puas :)

4. DELETE NAVBAR
Cara ini bikin blog kamu sedikit lebih rapi karena kita akan menbuang Navbar blog. Caranya seperti ini:

Dashboard >>Design >>Edit HTML

Cari kode:
/* Variable definitions

Pastekan kode ini diatasnya:
#navbar-iframe {
height:0px;
visibility:hidden;
display:none;
}

itu untuk kode buang Navbar (means navbar sudah hilang lenyap tidak ada)

Kalau anda ingin navbar anda Auto Show Hide, pastekan kode ini diatas kode yang anda cari tadi:
#navbar-iframe{
opacity:0.0;
filter:alpha(Opacity=0)
}

#navbar-iframe:hover{
opacity:1.0;
filter:alpha(Opacity=100, FinishedOpacity=100)
}

PREVIEW DULU ! Kalau sudah puas, click SAVE TEMPELATE :)

Nanti kamu akan kaget kalau blog kamu udah nggak ada navbarnya lagi. Tenang, Mari kita beri 2 tombol yaitu tombol Follow dan Dashboard ala Tumblr (kayak punya Lettha). Untuk tutorialnya, click DISINI.

Dan selamat ! Kamu udah dapat simple tempelate ala Denim ^_^ Untuk design lainnya, bisa lihat tutorial Lettha lainnya di SINI :D