Cara Merapikan Susunan Widget Di Tata Letak Blogger Agar Tidak Terpotong Saat Di Edit Menggunakan Smartphone

Sebagai seorang blogger, menambahkan dan mengurangi widget blog merupakan kegiatan yang sering kita lakukan. Gunanya adalah untuk menambahkan fitur baru atau mengubah tampilan blog agar tidak membosankan dan terlihat lebih menarik.

Mungkin bagi sebagian orang tidak menemukan kendala yang berarti saat melakukan editing menggunakan laptop/ komputer. Namun, ketika mengedit menggunakan smartphone, ternyata ada masalah yang dihadapi oleh sebagian blogger, yaitu masalah terpotongnya tombol edit widget sehingga menyebabkan kita sulit untuk menghapus dan menambahkan widget baru.

Selain terpotong, susunan widget juga terlihat sangat berantakan. Sehingga mengurangi estetika tampilan layout di dashboard. Meskipun pengunjung blog tidak melihatnya. Tapi, ketika kita membagikan atau menjual template blog, kerapian layout/ tata letak juga dapat menandakan bahwa template yang kita buat benar-benar profesional.

Berikut contoh tampilan widget di menu tata letak yang berantakan.

Dibuka melalui laptop

Dibuka melalui smartphone terpotong bagian kanan

Lalu bagaimana cara memperbaikinya?

Cara memperbaikinya sangat gambang, ikuti langkah-langkah berikut ini:

1. Buka blogger.com
2. Pilih theme/ tema
3. Klik Edit HTML
   
4. Arahkan kursor mouse ke dalam kotak HTML, klik tombol kiri mouse satu kali, lalu tekan Ctrl + F. Maka akan muncul kolom pencarian di sebelah kanan atas kotak.
5. Masukkan kode ini ke dalam kolom pencarian <b:skin> lalu tekan tombol Enter
6. Maka kamu akan menemukan kode seperti ini &lt;style type=&quot;text/css&quot;&gt;&lt;!-- /* <b:skin>...</b:skin>
   
7. Klik tiga titik yang berwarna biru antara kode <b:skin> dan </b:skin>
   
8. Maka akan terlihat kode HTML seperti gambar di bawah ini.
   
9. Tugas kamu selanjutnya adalah mengganti angka-angka yang ada di dalam kode tersebut dengan angka yang baru. Hasilnya akan seperti ini.
   

10. Biar lebih mudah, kamu salin dan tempel saja kode yang sudah saya ubah di bawah ini ke template kamu.

ul { list-style-type: none; }
#wrapper{width: 850px;overflow: hidden;}
#header-wrapper{width:100%;}
#header1{float:left;width:30%;}
#header2{float:right;width:60%;}
#posting-wrapper { overflow: visible;width: 450px;float:left;back }
#sidebar-kanan { float: right; width: 200px; }
#sidebar-kiri {width: 200px;float:left}
{ clear: both; width: 100%; }
#content-wrapper {width:100%;}
#footer { width: 100%; }
#post-left{float:left;width:40.5%}
#post-right{float:right;width:40.5%}
#kiri, #tengah, #kanan { width: 28.3%; float: left; }

11. Kalau sudah klik Simpan tema (save theme)
12. Sekarang coba lihat bagian Tata Letak (Layout), jika menjadi rapi berarti kamu berhasil.

Catatan:

1. Setiap template memiliki kode yang berbeda-beda, jika kode template kamu berbeda dari langkah nomor 10. Kamu tidak bisa menyalin dan menempel kode pada langkah 10 langsung ke template kamu. Tapi kamu harus mengedit angkanya satu persatu seperti pada langkah nomor 9.
2. Sebelum mengedit template, ada baiknya di backup terlebih dahulu supaya jika terjadi kesalahan, template kamu bisa dikembalikan seperti semula.