Cara Atasi tampilan Tata letak Blogger hanya terlihat sebagian

Beberapa hari setelah saya mempublikasikan tutorial cara mengedit widget yang tidak terlihat tombol editnya, tampilan halaman tata letak (layout page) pada Blogger / Blogspot kembali normal. Halaman tata letak yang sebelumnya hanya tampil separuh, sekarang sudah tampil penuh, beberapa tombol edit yang tadinya tersembuyi, sekarang sudah muncul / terlihat kembali. Tapi sayangnya itu hanya terjadi pada web / blog yang menggunakan template standar yang masih original, sementara untuk pengguna template responsive (mungkin hanya beberapa), baik itu custom atau template standar yang telah diubah menjadi responsive. Tampilan halaman tata letaknya masih error. Untuk mengatasi tampilan halaman tata letak yang error pada Blogger, silahkan ikuti tutorial berikut ini.

Hasilnya akan terlihat seperti gambar di bawah ini.

Cara agar semua tombol edit di halaman tata letak bisa muncul / terlihat.

Untuk pengguna template standar Blogger responsive.

Khusus buat Anda yang telah mengikuti tutorial cara membuat template blog menjadi responsive dari saya. Silahkan lakukan salah satu dari dua cara berikut.

1. Gabungkan kode CSS di dalam <b:template-skin> dengan <b:skin>. Caranya

<b:skin><![CDATA[

...CSS..

]]></b:skin>
<b:template-skin><![CDATA[

...CSS...

]]></b:template-skin>

Hapus kode yang di tandai dengan warna merah. Simpan template. Atau

2. Cukup pindahkan kode CSS di bawah ini, dari tag <b:template-skin> ke dalam tag <b:skin>.

body {
width: 1100px;
margin:0 auto;
min-width: $(content.width);
}

Hapus saja kode yang berwarna merah.

Update : Jika cara di atas belum bisa mengatasi tampilan layout yang error. Lakukan hal berikut. Tambahkan kode CSS di bawah ini, letakkan di atas kode ]]></b:template-skin> atau di atas kode ]]></b:skin>, terserah yang mana saja.

body#layout {width: 100%;}

Untuk pengguna template custom Blogger.

Ini mungkin akan sulit untuk membuat contoh yang akurat, karena tiap-tiap template custom Blogger mungkin memiliki kode (penamaan) yang berbeda-beda. Pada dasarnya,  untuk mengatasi masalah tampilan halaman tata letak yang hanya terlihat sebagian / separuh adalah dengan memindahkan kode CSS pembungkus terluar atau pembungkus semua widget di dalam body ke dalam kumpulan CSS utama. Pada template custom umumnya menggunakan <div id='wrapper'>.

Di bawah ini adalah cara yang sudah saya praktekkan pada salah satu template custom Blogger gratisan milik Kunci Dunia, dan hasilnya sesuai harapan (SUKSES). Yaitu dengan memindahkan kode CSS di bawah ini dari tag <b:skin> ke dalam tag <style type='text/css'>

#wrapper {width: 1100px; overflow: hidden;}

Simpan template, dan coba lihat halaman tata letak / layout blog Anda.

Jika Anda punya saran lain, silahkan di share pada kolom komentar. Sekian, semoga bermanfaat dan selamat mencoba.

Salam Blogger.