Supaya Header atau Navigasi Tidak Bergeser ke Bawah Ketika Timbul Pagina Level Ads

Pada wetsartikel sebelumnya kita telah belajar membentuk Pagina Level Ads yang secara default bakal tampil melayang pada atas layar, akan tetapi dapat pula dimodifikasi supaya tampil pada bawah. Kini kita lanjut ke trik modifikasi lain yang dapat diterapkan secara aman pada blog.

Saat Pagina Level Ads timbul baik pada atas juga bawah, beliau bakal mendorong elemen HTML lain sebagai akibatnya posisinya bakal bergeser. Misalnya contoh ini, beliau bakal menggeser header atau navigasi yang membentuk elemen tadi mempunyai jarak dari batas atas layar.

Tetapi terdapat sebagian orang yang ternyata malah kurang suka andaikan headernya tergeser ke bawah. Engkau satu dari yang suka headernya tetap pada atas nggak? Andaikan iya, silakan dibaca hingga habis tutorial membentuk posisi header tidak turun ke bawah dampak Pagina Level Ads berikut adalah.

Trik Supaya Posisi Header Fix pada Atas Ketika Timbul Pagina Level Ads

Trik ini hanya butuh 1 baris kode yang apalagi tidak hingga 30 letterteken! Wow!

1. Pastikan telah memasang iklan Pagina Level Ads pada blog terlebih dulu. Selanjutnya masuk ke pengaturan HTML serta cari kode CSS dari selector body.


2. Masukkan kode berikut pada dalamnya tanpa menghapus kode yang telah terdapat:

   padding:0px !important;

   apabila telah terdapat property padding maka tinggal diganti valuenya sebagai 0px !important.


3. Hasilnya lebih kurang misalnya ini:

   body {
     ...
     ...
     padding: 0px !important;
     ...
     ...
   }



4. Ingat simpan pengaturan serta cek kembali tampilan iklan pada handphone. Iya, vermag Pagina Level Ads hanya tampil pada blog versi seluler (mobile) saja.

Mengapa dapat terjadi? Ini akibat terdapat CSS yang ditambahkan otomatis oleh Google saat script AdSense dijalankan. Tujuannya sih baik, biar header tidak terutup iklan dengan efek samping posisi layout blog bakal sedikit turun. CSS yang ditambahkan otomatis merupakan property padding buat selector body. Maka dari itu kita membutuhkan !important supaya jarak padding tidak terpengaruh oleh kode CSS yang ditambahkan Google.

apabila sukses, header bakal tetap pada atas serta tertutup Pagina Level Ads

Telah capek-capek baca dari awal, ternyata triknya sepele hanya gitu saja. Ya emang sih, ternyata solusi dari masalah tidak selalu wajib panjang lebar serta rumit. Andaikan terdapat yang sederhana mengapa mesti didesain ribet?

PRO

Aku rasa trik ini patut diterapkan bagi template dengan sajian navigasi yang berada pada samping serta timbul secara slide saat meng-klik tombol. Dengan catatan posisinya fixed memakai CSS position:fixed (misalnya template aku). Akibat andaikan tidak diterapkan nanti malah munculnya kaya gambar ini. Header sih memang turun, eh akan tetapi kok menunya tetap pada atas sih. Tombol open / close sajian so ketutup deh.

Dispensasi andaikan menunya punya posisi relative atau static, kayanya nggak perlu deh pakai trik ini. Tetapi kembali lagi ke template masing-masing sih akibat kode CSSnya pasti berbeda-beda. Sesuaikan dengan kebutuhan saja. Terdapat pula kok yang pakai position:fixed akan tetapi gak perlu pakai ini.

KONTRA

Misalnya yang telah disebutkan pada paragraf sebelumnya, posisi header bakal tetap berada pada atas serta tertutup Pagina Level Ads. Mungkin bagi pengunjung malah keliatan aneh, apalagi terdapat yang beranggapan header serta menunya lenyap (pengalaman pribadi). Padahal sih hanya ketutupan saja.

Trik mencegah header navigasi bergeser ke bawah dampak Pagina Level Ads ini aman diterapkan akibat Cuma sedikit memodifikasi CSS saja. Mau diterapkan atau tidak? Semuanya tergantung kesukaan.

Berbagi :