Menyediakan informasi seputar perkembangan mesin Blogger dan internet secara umum.

Sidebar Hanya Tampil Selain pada Halaman Artikel

Beberapa orang mungkin merasa sedikit pusing ketika menemui sebuah situs dengan elemen halaman yang super komplit di segala penjuru, baik di sisi kanan maupun sisi kiri artikel. Mungkin tujuanmu memang baik, yaitu menyediakan semua fasilitas yang ada kepada para pembaca. Monitoring komentar, posting terbaru, daftar isi, ikon-ikon jejaring sosial dan masih banyak lagi. Tapi kalian harus ingat satu hal terpenting mengenai apa itu blog: ARTIKEL!

Jangan sampai mata para pembaca gentayangan melirik sisi kiri dan kanan artikel (yang kebetulan dipenuhi oleh gambar gadis-gadis cantik), sementara artikel itu sendiri dilupakan. Sangat tidak menyenangkan apabila pada akhirnya kamu menemukan komentar-komentar yang tidak bermutu di dalam artikelmu.

Kadangkala, seseorang memutuskan untuk menuliskan komentar dahsyat tidak semata-mata karena mereka tidak menyukai artikelmu, tetapi tidak jarang juga karena mereka merasa kebingungan.

Sidebar. Sebuah blok kecil dalam blog yang seharusnya menjadi prioritas pandangan ke dua justru menjadi berkuasa penuh karena munculnya godaan-godaan setan pernak-pernik blog yang merajalela merangsang nafsu birahi umat manusia di muka bumi ini. Jika kalian merasa bahwa sidebar di blogmu itu sangat mengganggu, ayo kita hilangkan saja!

Jangan khawatir, di sini kita akan menghilangkannya dengan , jadi sidebar hanya akan menghilang pada halaman tertentu saja.

Pertama-tama, masuklah ke tab Rancangan kemudian pilih Edit HTML.

Cari baris kode yang kurang lebih tampak seperti ini:

<div id='sidebar-wrapper'> 
    <b:section class='sidebar' id='sidebar' preferred='yes'> 
        <b:widget id='Label1' locked='false' title='Kategori Posting' type='Label'/> 
        <b:widget id='BlogArchive1' locked='false' title='Arsip Blog' type='BlogArchive'/> 
        <b:widget id='Text1' locked='false' title='Obrolan Monyet' type='Text'/> 
    </b:section> 
</div>

Sisipkan tag kondisional halaman item di luar elemen tersebut, sehingga tag kondisional tersebut sekarang berperan sebagai pembungkus sidebar. Seperti ini:

<b:if cond='data:blog.pageType != &quot;item&quot;'> 
    <div id='sidebar-wrapper'> 
        <b:section class='sidebar' id='sidebar' preferred='yes'> 
            <b:widget id='Label1' locked='false' title='Kategori Posting' type='Label'/> 
            <b:widget id='BlogArchive1' locked='false' title='Arsip Blog' type='BlogArchive'/> 
            <b:widget id='Text1' locked='false' title='Obrolan Monyet' type='Text'/> 
        </b:section> 
    </div>
</b:if>

Klik Simpan Template.

Sebagai catatan, atribut id='sidebar-wrapper' itu tidak mutlak, setiap template mempunyai ID-nya masing-masing. Intinya adalah, kamu cari saja elemen <b:section> yang memiliki class='sidebar', kemudian temukan elemen divisi yang menjadi pembungkus dari tulang-belulang sidebar tersebut. Terakhir tinggal letakkan saja tag kondisional di luar objek tersebut.

Widget-widget yang berada di dalam seksi sidebar juga bisa menjadi panduan yang baik.

Berikut ini adalah contoh tampilan saat awal pertama kamu mengunjungi blogmu:

tutorial cara menampilkan sidebar hanya di halaman muka
Halaman depan.


Setelah kamu memasuki halaman artikel (menekan tombol Baca Selengkapnya atau link Komentar), maka hasil tampilannya akan berubah menjadi seperti ini:

sidebar hanya tampil di halaman muka
Setelah masuk ke halaman item.

  

Berlangganan

Berlangganan: Dapatkan berbagai materi dan informasi seputar dunia pemrograman yang tidak akan pernah bisa kalian dapatkan di buku dan di bangku kuliah.

 7 Komentar

Memuat…

Tautan (link) hidup dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan tautan dengan aman, gunakan kode [url=http://example.com]Teks Tautan[/url]
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA</i>
Untuk menyisipkan gambar, gunakan kode [img]URL GAMBAR[/img]
Untuk menyisipkan judul, gunakan tag <b rel="h4">JUDUL ANDA DI SINI…</b>
Untuk menciptakan efek tebal gunakan tag <strong>TEKS ANDA DI SINI…</strong>
Untuk menciptakan efek huruf miring gunakan tag <em>TEKS ANDA DI SINI…</em>

Khusus untuk membalas komentar disarankan menggunakan tombol balas di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur. Karena mungkin, apa yang Anda tanyakan/katakan saat ini akan sangat bermanfaat bagi pembaca lain.

:) :( ^_^ :D ;) :bd :'( :\ ;p B) :Q :Ozzz 7:( \o/ **p :* 0:) :a 7:O *fuck* x& x@ ~x( *yaya* =p*

Nama Saya Taufik Nurrohman. Sebenarnya Saya tidak bisa disebut sebagai seorang yang profesional dalam bidang ini, karena Saya tidak menguasai bidang ini melalui pendidikan formal. Saya hanyalah seorang antusias. Dibandingkan sebagai seorang desainer atau pengembang, Saya lebih suka jika disebut sebagai seorang hobiis saja yang tertarik dengan dunia web.

Daftar Tautan

Saya tidak bisa hidup tanpa JavaScript! Aktifkan JavaScript?
Ke atas!