Cara Membuat Posting Artikel Lebar Penuh

Menampilkan artikel/posting 1 halaman penuh tanpa sidebar caranya agak mirip dengan cara mengubah lebar posting yang pernah saya tulis sebelumnya. Tujuan membuat artikel atau posting dengan lebar halaman penuh pada artikel tertentu dengan menghilangkan sidebar bisa bermacam-macam. Ada yang bertujuan supaya loading halaman pada artikel tertentu menjadi lebih cepat, ada pula yang hanya untuk menghemat ruang karena tulisan/artikel yang panjang. Sebagai langkah awal dalam membuat artikel penuh ini, sebelumnya sobat harus mengetahui lebar halaman posting (content) pada template. Lebar content biasanya ditandai dengan kode #content-wrapper dan dibagi lagi menjadi 2 atau 3 bagian yaitu dengan kode #main-wrapper dan #sidebar-wrapper. Pada setiap template ada perbedaan kode, tapi coba aja dicari kode yang mirip atau sejenis.   

Contoh kode pada template Thesis : (1)

#content-wrapper {

.........

width:900px;

}

#main-wrapper {

.........

width:507px;

}

#sidebar-top {

.........

width:362px;

}

#sidebar-wrapper1 {

..........

width:160px;

word-wrap:break-word;

}

#sidebar-wrapper2 {

.........

width:182px;

}

#sidebar-bottom {

.........

width:362px;

}

Kalau kode ini saya sederhanakan menjadi 1 sidebar saja, jadinya seperti ini : (2)

#content-wrapper {

.........

width:900px;

}

#main-wrapper {

.........

width:507px;

}

#sidebar-wrapper {

.........

width:362px;

}

Nah untuk membuat lebar posting penuh tinggal menambahkan lebar (width) bagian #main-wrapper dan #sidebar-wrapper menjadi 507+362 = 869px. Dari lebar  #content-wrapper 900px berarti masih ada sisa 31px yang merupakan sisa ukuran margin,padding dan border.

Cara Membuat Artikel / Posting 1 Halaman Penuh :

1.     Login ke dashboard blogger

2.  Pada menu sidebar kiri tampilan antar muka blogger yang baru, pilih Template > Edit HTML > Lanjutkan dan centang kotak Expand Template Widget.

3.   Buat kode seperti dibawah ini dengan memasukkan link url artikel yang ingin ditampilkan secara penuh pada bagian yang berwarna merah, letakkan tepat diatas kode </head> pada template.

<b:if cond='data:blog.url == &quot;URL artikel yang ditampilkan penuh&quot;'>

<style>

#sidebar{display: none !important;}

#main-wrapper{width: 869px;}

</style>

</b:if>

4.  Maksud dari kode seperti diatas adalah bagian bagian #main-wrapper dilebarkan sedangkan bagian #sidebar-wrapper dihilangkan.

5.      Save / Simpan template anda.

Untuk contoh demonya sobat dapat melihat pada artikel Iklan Internet Murah Efektif Berkualitas Indonesia, dimana saya melebarkan posting dari 497px menjadi 667px dengan menghilangkan 1 sidebar yang berukuran 160px. Saya juga menyembunyikan widget tertentu pada halaman ini untuk mempercepat loading.

Demikian Cara Membuat Menampilkan Posting 1 Halaman Penuh pada artikel tertentu ini saya tuliskan untuk sobat yang ingin berkreasi membuat artikel yang tampil beda. Selamat mencoba yach..!!

Posted in: Blogspot