17 Jul 2012

Menghilangkan Overflow pada Body (Halaman Blog)Click here to get more tutorials!

Meniadakan atau menghilangkan overflow body (yang terlihat di halaman blog bagian bawah) bertujuan untuk membuat blog terlihat lebih rapi sekaligus membuat seluruh bagian blog selalu terlihat tanpa perlu menarik2 scrollbar pada bagian horizontal. Ada beberapa cara untuk membuat kondisi seperti ini. Tentu saja cara yang pertama dengan memanfaatkan fitur pengaturan yang telah disediakan blogger. Cara yang lain adalah dengan menambahkan kode css di atas kode ]]></b:skin> yang letaknya sedikit di atas tag penutup head (</head>).

Beberapa penyebab munculnya Overflow body

Sekalipun beberapa memang harus terjadi karena kebutuhan untuk sedikit menampilkan halaman blog yang sedikit lebar agar semua tertampilkan sesuai dengan harapan, beberapa terjadi karena beberapa sebab yang berkaitan dengan kode html atau kode css. Dalam beberapa kasus, bahkan overflow muncul tanpa pernah kita sadari. Hal seperti ini kerap terjadi karena saat melakukan perubahan atau penambahan kode tidak melakukan pengecekan halaman blog secara cermat.

Cara Menghilangkan Overflow (horizontal) di halaman blog (body)

Cara termudah ketika anda menggunakan template blogger, maka lakukan setting lebar body (halaman blog) menggunakan fitur blogger "Ubahsuaian".
Memanfaatka fitur Ubahsuaian - blogger
  1. Login ke Blogger
  2. Dasbor
  3. Template
  4. Ubahsuaian
  5. Perancang Template Blogger
    • Sesuaikan Lebar
    • Seluruh Blog :
      Atur lebar blog dan perhatikan preview di bagian bawahnya untuk memastikan muncul tidaknya scrollbar (horizontal).
    • Terapkan ke Blog
    • Kembali ke Blogger
  6. Selesai!
Menggunakan kode css baru
  1. Login ke Blogger
  2. Dasbor
  3. Template
  4. Edit HTML
  5. Template › Edit HTML
    • Proceed (Lanjutkan)
    • Cari kode ]]></b:skin>.
      Gunakan Ctrl+F untuk mempermudah dan mempercepat pencarian kode.
    • Copy dan paste-kan kode css di atas ]]></b:skin>
    • Simpan Template (Save Template
  6. Selesai!
Kode CSS
Ada 2 kode css yang dapat digunakan, silahkan anda bisa gunakan salah satu.
body{overflow-x:hidden;}
]]></b:skin>
body{width:1007px;padding:0;margin:0;}
]]></b:skin>

3 comments:

  1. trimaksi gan infoya semoga dapat jaya selalu dgn berbagi ilmu

    ReplyDelete
  2. thank mas caranya...masih bingung tapinya saya.....maklum bau belajar hehe

    ReplyDelete

Terima kasih atas kunjungan dan komentar anda! Tutorial lain yang jauh lebih menarik bisa anda dapatkan dengan klik disini!