Menghilangkan
NavBar
Merasa
tidak nyaman dengan tampilan NavBar di bagian atas halaman blog Anda?
Singkirkan NavBar dan perluas tampilan halaman blog Anda dengan cara berikut:
NavBar
Blogger
Buka template Blogger Anda di Layout >
Edit HTML.
Temukan titik penyisipan, letakkan kursor
persis di atas baris body {.
Sisipkan baris kode di bawah ini untuk
menghilangkan tampilan NavBar di halaman blog Anda:
#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}
Simpan perubahan template, preview blog dan
nikmati hasilnya.
Penyisipan
Kode Menghilangkan NavBar
Memodifikasi
Lebar Halaman
Hal
pertama yang perlu Anda pahami dalam memodifikasi halaman blog Anda adalah
mengenai penetapan lebar komponen halaman (header, halaman posting, sidebar,
dan footer).
Berikut
adalah rumusan yang bisa Anda jadikan pedoman dalam mengutak-atik lebar halaman
blog Anda :
#header-wrapper
= #outer-wrapper = #footer = #main-wrapper + 30 + #sidebar-wrapper
Temukan
dan ubah nilai width: di bagian tersebut sesuai kebutuhan :
#header-wrapper, #outer-wrapper, dan
#footer menjadi patokan lebar seluruh halaman blog.
#main-wrapper adalah ukuran kolom posting
Anda.
#sidebar-wrapper adalah ukuran kolom
sidebar Anda.
Nilai 30 digunakan untuk memberi jarak
antara antara kolom posting dan kolom sidebar.
Dengan
berpatokan pada rumusan di atas, maka Anda dapat mengubah ukuran halaman Anda
dengan mengedit HTML dengan nilai seperti berikut :
Nilai
width awal:
660px = 660px
= 660px = 410px + 30px + 220px
Nilai
width untuk modifikasi:
750px =
750px = 750px = 470px + 30px + 250px
Penjelasan
langkah pengeditan:
Timpa nilai width pada bagian
#header-wrapper, #outer-wrapper, dan #footer menjadi 750px.
Timpa nilai width pada bagian #main-wrapper
menjadi 470px.
Timpa nilai width pada bagian
#sidebar-wrapper menjadi 250px.
Nilai
width #main-wrapper = 470px cocok untuk beriklan (ukuran ini bisa mengakomodasi
banner 468x60 px). Silakan ubah ukuran sesuai selera dengan berpatokan pada
rumusan di atas.
Memodifikasi
Jumlah Kolom
Pilihan
template yang disediakan Blogger umumnya tersusun atas dua kolom (kolom posting
dan kolom sidebar). Anda dapat membuat kolom tambahan dengan menyalin kode
sidebar dan mengatur ulang ukurannya.
Sebagai
contoh, berikut cara membuat halaman blog dengan tiga kolom.
Penyisipan
Kolom Sidebar Baru
Buka template Blogger Anda di Layout >
Edit HTML.
Kita gandakan kode kolom sidebar yang sudah
ada. Umumnya kode sidebar dinamai sidebar-wrapper, namun ada juga template yang
menggunakan nama sidebar-wrap atau sejenisnya.
Temukan, seleksi, dan salin bagian ini:
#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long
text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking
IE sidebar float */
}
Pindahkan kursor di bawah kode tersebut, lalu
sisipkan kode yang telah Anda salin. Kini anda memiliki 2 kode di atas.
Bedakan nama kode, edit nama
#sidebar-wrapper yang telah Anda sisipkan menjadi #sidebar-wrapper2.
Ubah nilai width di #sidebar-wrapper dan
#sidebar-wrapper2, dengan cara membagi 2 nilai yang ada. Misalnya nilai awal
220px Anda bagi menjadi masing-masing 110px.
Selanjutnya temukan, seleksi, dan salin
bagian ini:
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar'
preferred='yes'>
...
...
</b:section>
</div>
Pindahkan kursor di bawah kode tersebut,
lalu kembali sisipkan kode yang telah Anda salin. Kini anda memiliki 2 kode di
atas.
Edit nama <div id='sidebar-wrapper'>
yang telah Anda sisipkan menjadi <div id='sidebar-wrapper2'>.
Simpan Template. Preview blog Anda untuk
memastikan tampilan 3 kolom telah berhasil Anda buat.
Catatan,
jika lebar sidebar pertama dan kedua menjadi sempit, maka gunakan rumusan
Memodifikasi Lebar Halaman.
Selamat
mencoba !
http://dankastamsis.blogspot.com/
0 komentar:
Posting Komentar