Cara Membuat Postingan Tanpa Sidebar


Cara Membuat Postingan Tanpa Sidebar




Ada Dua CSS

Seperti pada postingan terdahulu, jika kita menggunakan trik ini maka akan ada 2 css untuk satu id widget atau section. Yang pertama dipanggil tanpa syarat dalam keadaan umum. Yang kedua adalah dipanggil untuk syarat tertentu saja, dalam hal ini kita memberikan syarat untuk alamat postingan yang kita tentukan. Yang perlu diperhatikan ketika kita nanti menambah css jangan hilangkan css asli.



Lebar Area Postingan

Untuk mengatur lebar area postingan Anda harus mengetahui kodenya terlebih dahulu. Pada umumnya memiliki kode main-wrapper. Nah, yang perlu Anda ketahui, main-wrapper ini berada pada bagian outer-wrapper atau bisa hanya dengan kode wrap saja yang istilahnya sebagai wadah/nampan bagian-bagian template yang terdiri dari main wrapper dan sidebar. Oleh karena itu main-wrapper tidak boleh lebih lebar dari outer-wrapper. Saya misalkan kode-kode dari template minima. Jika pada bagian css ada titik-titik itu berarti kode css lain yang tidak saya tuliskan. Dalam hal ini yang saya sertakan adalah dalam hal lebar saja (berkode: width)




CSS Outer
 #outer-wrapper {
  width: 660px;
...............................
  }


CSS Main-wrapper
#main-wrapper {
  width: 410px;
...............................
  }



Nah, pada kode di atas lebar main-wrapper adalah 410px, lebih kecil dari lebar nampannya yakni 660px. Bukankah masih ada sisa? Ya kita pastikan sisa lebar itu adalah milik sidebar. Jika kita tulis cssnya



#sidebar-wrapper {

  width: 220px;

..............................

}



Jadi lebar area sidebar (220) ditambah area postingan (410) adalah 630px, masih lebih kecil dari batas yakni 660px. Sisa 30 px adalah untuk margin, yakni jarak antara tepi kiri dengan area postingan, jarak area postingan dengan sidebar dan jarak area sidebar dengan tepi kanan.







Cara Membuat Postingan Tanpa Sidebar

1. Login ke blogger

2. Tata Letak

3. Edit HTML

4. Cari kode </head>

5. Letakkan kode berikut ini di atas </head>


 <b:if cond='data:blog.url == &quot;http://urlpostingananda.com/urlpostingananda.html&quot;'>

 <style>

.sidebar{

display: none !important;

}

 #main-wrapper, .post {

width: 640px;

  }

  </style>

  </b:if>



Ganti yang berwarna merah pertama dengan alamat postingan yang ingin Anda buat penuh area postingannya dan hilangkan sidebarnya. Ganti warna merah kedua dengan lebar yang telah Anda perhitungkan.


Comments