16
Trik dan Kode-kode Untuk Menampilkan dan Menghilangkan Widget Content Blog
Dipostingan kali ini kita akan membahas bagaimana cara menghilangkan dan menampilkan suatu objek diblog. Dalam mendesign sebuat template, Penggunaan Trik dan Kode-kode Untuk Menampilkan dan Menghilangkankan ,atau lebih tepatnya menyembunyikan Widget Content Blog ini sangat diperlukan agar hasil template yang kita buat tidak terlihat monoton. Sebagai contoh adalah widget slider dan salah satu sidebar yang ada pada blog ini. Widget tersebut hanya akan muncul dihalaman utama dan kategori blog dan akan menghilang jika kita masuk kehalaman posting.

Kode-kode Untuk Menampilkan dan Menyembunyikan Widget Content Blog ini biasanya pasti ada ditemplate-template dengan gaya magazine atau majalah. Seperti yang kita ketahui, template blog dengan gaya Magazine Style merupakan salah satu favorit template yang sering di pakai oleh para blogger. Salah satu ciri template blog dengan gaya Magazine Style adalah adanya widget yang muncul lalu menghilang atau awalnya menghilang lalu muncul pada suatu halaman atau postingan blog.

Berikut ini adalah jenis dan fungsi kode untuk mengatur tampilan content blog dari muncul lalu menghilang dan menghilang kemudian muncul. yang bisa Anda terapkan untuk mengatur tampilan widget blog Anda.
1. Hanya pada Halaman Utama Blog
<b:if cond="data:blog.url == data:blog.homepageUrl">
...Konten...
</b:if>
Kode ini berfungsi untuk menampilkan widget blog hanya pada halaman utama blog saja alias akan menghilang ketika kita mengklik Label Post atau membaca postingan secara keseluruhan.

2. Kategori Post dan Single Post
<b:if cond="data:blog.url != data:blog.homepageUrl">
...Konten...
</b:if>

Kode ini berfungsi untuk menampilkan widget blog pada kategori post dan single post (postingan secara keseluruhan).

3. Halama Utama Blog dan Kategori Post
<b:if cond="data:blog.pageType != &quot;item&quot;">
...Konten...
</b:if>

Kode ini berfungsi untuk menampilkan widget blog pada main post dan kategori post dan akan menghilang ketika membaca postingan secara keseluruhan.

4. Single Post atau Halaman Postingan
<b:if cond="data:blog.pageType == &quot;item&quot;">
...Konten...
</b:if>

Kode ini berfungsi untuk menampilkan widget blog hanya pada single post saja atau ketika anda membaca postingan secara keseluruhan dan tidak akan muncul pada main post atau kategori post.

5. Halama Utama Blog dan Kategori Post
<b:if cond="data:blog.pageType == &quot;index&quot;">
...Kontent...
</b:if>

Fungsi kode ini sama dengan fungsi kode pada nomer 3.

6. Menampilan Widget Blog Pada Postingan Tertentu Saja
<b:if cond="data:blog.url == &quot;URL_POST_TERTENTU&quot;">
...Konten...
</b:if>
Kode ini berfungsi untuk menampilkan suatu widget blog hanya pada suatu postingan tertentu.

7. Menyembunyikan Widget Post Pada Postingan Tertentu Saja
<b:if cond='data:blog.url != &quot;URL_POST_TERTENTU&quot;'>
...Konten...
</b:if>

Kode ini merupakan kebalikan dari kode no 6 dimana widget blog akan menghilang dari suatu postingan tertentu dan baru muncul pada postingan yang lain.

Cara penggunaan kode ini sangatlah gampang. Kita cukup menambahkan kode yang kita inginkan kewidget yang ingin kita tampilkan atau sembunyikan.

Untuk penerapan kode-kode diatas ada 2 cara yaitu langsung pada widget dan secara kelompok atau dengan memberikan perintah melalui kode CSS-nya. Namun biasanya, penerapan kode-kode ini melalui CSS hanya di gunakan untuk mengatur komposisi dari suatu kolom widget konten. Misalnya lebar dan posisi widget atau objek berbeda dihalaman utama dan postingan. Mungkin hal ini akan kita bahas di postingan berikutnya.

Mungkin itu saja yang saya tahu tentang Kode-kode Untuk Menampilkan dan Menyembunyikan Widget Content Blog ini. Jika teman-teman punya pendapat atau ilmu yang lain, silakan tinggalkan komentar dan url postingannya dibawah ini. Semoga bermanfaat.

Posting Komentar

  1. Bisa ditunujukan contoh hasilnya gan ?

    BalasHapus
  2. Klo hasilnya kan udah ada diblog ini.
    Lihat aja ke halaman homepage, terus buka salah satu postingan.
    Klo Anda perhatikan tu widget slider sama sidebar tengah gak lagi muncul.
    Sama halnya dengan ukuran gambar.
    Saat dihomepage ukuran gambar terlihat lebih kecil dibandingkan dengan gambar asli.

    BalasHapus
  3. trima kasih atas infonya gan...
    salam kenal...

    BalasHapus
  4. sy praktek yang biyar tampil di Home saja tp nggak bisa.. pye ki bro??

    BalasHapus
  5. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  6. djblackersz @ thanks buat komentnya... Semoga bermanfaat aja gan...
    Syariflee @ Agar bisa tampil di home page saja maka kode yang kita pakai berarti kode no 1.
    Cara penggunaannya adalah seperti ini: misalnya kita akan menyembunyikan sidebar maka yang harus kita cari pertama adalah id dari sidebar tersebut, contoh sudah ketemu maka format dari keseluruhannya akan menjadi kira2 seperti ini:

    <div id='sidebar'>
    <b:section class='sidebar' id='sidebar'>
    <b:widget id='HTML6' locked='false' title='artike terkait' type='HTML'/> </b:section>
    </div>

    maka cara penggunaannya adalah jadi seperti ini:

    <b:if cond='data:blog.url == data:blog.homepageUrl'> 
    <div id='sidebar'>
    <b:section class='sidebar' id='sidebar1'>
    <b:widget id='HTML6' locked='false' title='artike terkait' type='HTML'/>
    </b:section>
     </div>

    </b:if> 

    Jika mau melihat contoh hasilnya lihat saja diblog saya yang ini.. http://infogame-online.blogspot.com/

    BalasHapus
  7. Pasang HTMLnya di mana bos? di edit HTML kemudia Expans Widget atau di Rancangan kemudian Tambah Gadget?

    BalasHapus
  8. Syarif Lee @ Disarankan Masuk ke Rancangan -> Edit HTML, Expand Widget Gak Usah di centang.. Jadi kode yang mau disembunyikan tidak terlalu panjang..

    BalasHapus
  9. nice tips sobat met malam pa kabar mas reaalfa

    BalasHapus
  10. Download Free PC Software @ Thanks gan..
    Baik Gan..

    BalasHapus
  11. Info yang bermanfaat sob.... ditunggu kunjungan baliknya :)

    BalasHapus
  12. cara menyembunyikan widget yg ngga ada namanya, yang muncul ditiap postingan gimana?

    BalasHapus
  13. Joe @ Semoga bermanfaat aja gan..
    Aulia Ristyanti @ Hampir bisa dipastikan setiap widget pasti mempunyai nama atau id tersendiri.. Untuk hal itu disarankan untuk membaca postingan Cara Mengetahui id dan class dari suatu widget atau kolom dan sedikit memahami fitur inspect element..

    BalasHapus
  14. wah mantab gan sharenya heheh ijin praktek dulu di blog saya

    BalasHapus

Mohon maaf bila admin tidak bisa langsung membalas atau pun langsung berkunjung kembali ke blog sahabat blogger yang telah berkunjung ke sini. Kalian bisa meninggalkan komentar yang layak dengan menggunakan Nama dan URL blog sobat. Saya mengaktifkan filter dan comment moderator full sehingga setiap komentar pasti saya baca dan jika memang itu saya rasa harus dijawab, pasti saya akan memenuhinya.

Hanya komentar yang memang saya anggap pantas yang akan diterbitkan. Sekalipun itu kritikan atau ejekan, jika memang itu layak untuk di bahas.

 
Top