Cara Mengatasi Layout Blogger Tumpang Tindih
DP BBM 23 - Cara Mengatasi Layout Blogger Tumpang Tindih - Selamat malam, selamat beristirahat dan selamat membaca di blog DP BBM 23, yang mungkin kebetulan sobat sedang online disini, setelah kemarin membahas dan berbagi mengenai Apa Itu http, https, www dan FTP, dikesempatan malam ini akan saya ulas sedikit mengenai blogger, yaitu tentang Cara Mengatasi Layout Blogger Tumpang Tindih, berikut ulasan selengkapnya!!!
Sebenarnya apa sih yang menyebabkan layout / tata letak blogspot menjadi tumpang tindih ?? mari kita bahas dalam postingan Cara Mengatasi Layout Blogger Tumpang Tindih, sebelumnya sobat pasti tau yang namanya kode <div class='clear'/> ataupun kode <div class='clear:both;'/> karena kode itu tentu selalu ada di dalam setiap template blogger/blogspot... apa sih efek dari kode <div class='clear'/> dan <div class='clear:both;'/> ini, pada tampilan blog kita ?? jadi sebenarnya fungsi kode tersebut untuk memberikan space antara dua element div, jika kode tersebut terhapus maka tampilannya akan menjadi tmpang tindih...
Perhatikan pada gambar diatas, saya berinama antara sebelum dan sesudah penyebab terjadinya element menjadi tumpang tindih, dikarenakan saya mengedit ulang templatenya, karena merasa kurang OK dengan tampilan Menu Navigasinya, akhirnya saya utak - atik sesuai dengan keinginan saya, dan dibawah ini adalah tampilan header ( bagian Navigasi ) bawaan dari templatenya, alias belum di edit...
Tampilan Navigasi seperti itu, emang tidak jelek sih, cuma sayang saja jika lewat smartphone terlihat kurang OK, dan sebagian menutupi iklan, akhirnya saya coba - coba merubahnya dengan tampilan seperti dibawah ini...
Seperti itulah hasil jadinya, lebih responsive dan terlihat lebih kece aja gitu hehe, dan merubah tampilan pun selesai, namun karena saya bosan dan terlihat kurang OK dengan logo yang sebelumnya saya gunakan, akhirnya saya berkeinginan untuk merubahnya, dan pada saat membuka layout / tata letak, ternyata bagian header tertindih dengan element lain, bisa sobat lihat pada gambar dibawah ini...
Dengan keadaan seperti itu, tentu saja tidak dapat merubah logo, karena bagian Edit tertutup, dan setelah saya cek ulang pada templatenya, ternyata ada bagian yang terhapus, yaitu pada bagian kode <div class='clear:both;'/> dan setelah diperbaiki, akhirnya tampilaannya kembali rapi dan logopun bisa di rubah...
Nah, jadi inti dan kesimpulannya kode <div class='clear:both;'/> dan <div class='clear'/> yaitu untuk mengatur jarak antara element satu dengan yang lainnya, dan untuk terlihat rapi pada layout dashboard blogger, labih jelasnya...
Sebenarnya apa sih yang menyebabkan layout / tata letak blogspot menjadi tumpang tindih ?? mari kita bahas dalam postingan Cara Mengatasi Layout Blogger Tumpang Tindih, sebelumnya sobat pasti tau yang namanya kode <div class='clear'/> ataupun kode <div class='clear:both;'/> karena kode itu tentu selalu ada di dalam setiap template blogger/blogspot... apa sih efek dari kode <div class='clear'/> dan <div class='clear:both;'/> ini, pada tampilan blog kita ?? jadi sebenarnya fungsi kode tersebut untuk memberikan space antara dua element div, jika kode tersebut terhapus maka tampilannya akan menjadi tmpang tindih...
Perhatikan pada gambar diatas, saya berinama antara sebelum dan sesudah penyebab terjadinya element menjadi tumpang tindih, dikarenakan saya mengedit ulang templatenya, karena merasa kurang OK dengan tampilan Menu Navigasinya, akhirnya saya utak - atik sesuai dengan keinginan saya, dan dibawah ini adalah tampilan header ( bagian Navigasi ) bawaan dari templatenya, alias belum di edit...
Tampilan Navigasi seperti itu, emang tidak jelek sih, cuma sayang saja jika lewat smartphone terlihat kurang OK, dan sebagian menutupi iklan, akhirnya saya coba - coba merubahnya dengan tampilan seperti dibawah ini...
Seperti itulah hasil jadinya, lebih responsive dan terlihat lebih kece aja gitu hehe, dan merubah tampilan pun selesai, namun karena saya bosan dan terlihat kurang OK dengan logo yang sebelumnya saya gunakan, akhirnya saya berkeinginan untuk merubahnya, dan pada saat membuka layout / tata letak, ternyata bagian header tertindih dengan element lain, bisa sobat lihat pada gambar dibawah ini...
Dengan keadaan seperti itu, tentu saja tidak dapat merubah logo, karena bagian Edit tertutup, dan setelah saya cek ulang pada templatenya, ternyata ada bagian yang terhapus, yaitu pada bagian kode <div class='clear:both;'/> dan setelah diperbaiki, akhirnya tampilaannya kembali rapi dan logopun bisa di rubah...
Nah, jadi inti dan kesimpulannya kode <div class='clear:both;'/> dan <div class='clear'/> yaitu untuk mengatur jarak antara element satu dengan yang lainnya, dan untuk terlihat rapi pada layout dashboard blogger, labih jelasnya...
Fungsi DIV Clear dan Clear Both Pada Blogger
- Memberikan Space antara dua element div
- kode <div class='clear:both;'/> dan <div class='clear'/> pada tampilan blog memiliki fungsi yaitu untuk memberikan ruang atau space antara element sebeleumnya dengan sesudahnya, jadi dengan menggunakan kode <div class='clear:both;'/> dan <div class='clear'/> ini, bisi juga mempercantik tampilan blog agar bentuknya tidak tumpang tindih atau saling bertumpukan...
- Mengatur tata letak ( lay out ) menu widget pada dasboard
- Fungsi kedua yang sekaligus merupakan peranan penting dari kode kode <div class='clear:both;'/> dan <div class='clear'/> adalah mengatur tata letak menu widget pada tampilan menu utama layout di halaman dahsboard blogger, sehingga kita lebih mudah untuk mengedit / menambahkan gadget baru kedalam elemen yang kita inginkan...