Logika Pengingkaran Pada Tag Kondisional
Untuk menciptakan kondisi berbeda pada postingan, komentar, homepage dll biasanya kita menggunakan tag kondisional. Dalam tag kondisional ada yang disebut dengan pengingkaran yang ditandai dengan ! (tanda seru).
Contoh pembuka tag kondisional pada halaman posting
kode di atas artinya apabila halaman posting maka.... adapun kode seperti dibawah ini adalah sebaliknya
artinya apabila selain halaman posting... (perbedaannya terletak pada tanda seru).
Tag kondisional kadang diperlukan hanya satu saja, terkadang juga diperlukan berikut pengingkarannya. Hal ini tentunya ada beberapa tujuan seperti mempercepat loading, menyembunyikan objek tertentu dll.
Dibawah ini akan coba saya jelaskan 2 contoh penggunaan logika pengingkaran pada tag kondisional yang saya gunakan di blog ini.
Untuk lebih memahaminya, dibawah ini contoh HTML blog, saya ambil dari tag
Kemudian Anda menambahkan tag kondisional
Walaupun Anda telah menyembunyikan beberapa elemen, tetap elemen itu akan dirender oleh browser. Maka yang terjadi adalah akses yang lambat. Untuk mempercepat loading halaman ini, maka tambahkan kode pengingkaran pada elemen yang tidak ingin ditampilkan. Hasilnya seperti ini :
Contoh di atas, tidak menyertakan avatar, isi komentar, tombol reply dsb. Ini juga menggunakan pengingkaran.
Pada kasus ini tidak menggunakan tanda seru (!) sebagai pengingkaran, tapi dengan
Untuk penempatannya, saya kira Anda sudah faham dengan penjelasan saya diatas. Dibawah ini saya buat gambaran HTML pada komentar beserta penempatan tag kondisionalnya.
Contoh pembuka tag kondisional pada halaman posting
<b:if cond='data:blog.pageType == "item"'>kode di atas artinya apabila halaman posting maka.... adapun kode seperti dibawah ini adalah sebaliknya
<b:if cond='data:blog.pageType != "item"'>artinya apabila selain halaman posting... (perbedaannya terletak pada tanda seru).
Tag kondisional kadang diperlukan hanya satu saja, terkadang juga diperlukan berikut pengingkarannya. Hal ini tentunya ada beberapa tujuan seperti mempercepat loading, menyembunyikan objek tertentu dll.
Dibawah ini akan coba saya jelaskan 2 contoh penggunaan logika pengingkaran pada tag kondisional yang saya gunakan di blog ini.
Contoh 1 : Halaman Error 404
Tujuan disertakannya pengingkaran pada halaman error 404 (tidak ditemukan) adalah untuk mempercepat loading halaman. Mungkin sobat pernah mengunjungi halaman error yang lambat diakses? itu karena tidak disertakannya pengingkaran, sehingga header, navigasi, sidebar, footer, tetap dibaca oleh browser walaupun menggunakandisplay:none.
Untuk lebih memahaminya, dibawah ini contoh HTML blog, saya ambil dari tag
<body><body>
<div id='header'/>
<div id='outer-wrapper'>
<div id='main-wrapper'>
<article id='post hentry'/>
<sidebar id='sidebar'/>
</div>
</div>
</body>Kemudian Anda menambahkan tag kondisional
error_page sebelum </body> maka kode menjadi seperti ini<body>
<div id='header'/>
<div id='outer-wrapper'>
<div id='main-wrapper'>
<article id='post hentry'/>
<sidebar id='sidebar'/>
</div>
</div>
<b:if cond='data:blog.pageType == "error_page"'>
<div id='error-page'>
<h1>Halaman tidak ditemukan</h1>
</div>
</b:if>
</body>Walaupun Anda telah menyembunyikan beberapa elemen, tetap elemen itu akan dirender oleh browser. Maka yang terjadi adalah akses yang lambat. Untuk mempercepat loading halaman ini, maka tambahkan kode pengingkaran pada elemen yang tidak ingin ditampilkan. Hasilnya seperti ini :
<body>
<b:if cond='data:blog.pageType != "error_page"'>
<div id='header'/>
<div id='outer-wrapper'>
<div id='main-wrapper'>
<article id='post hentry'/>
<sidebar id='sidebar'/>
</div>
</div>
</b:if>
<b:if cond='data:blog.pageType == "error_page"'>
<div id='error-page'>
<h1>Halaman tidak ditemukan</h1>
</div>
</b:if>
</body>Contoh 2 : Deleted Comments
Mungkin Anda pernah melihat blok merah tanda komentar telah dihapus pada blog ini.
Contoh di atas, tidak menyertakan avatar, isi komentar, tombol reply dsb. Ini juga menggunakan pengingkaran.
Pada kasus ini tidak menggunakan tanda seru (!) sebagai pengingkaran, tapi dengan
<b:else/> karena pada tag kondisional deleted comment tidak ada tanda = atau !.Untuk penempatannya, saya kira Anda sudah faham dengan penjelasan saya diatas. Dibawah ini saya buat gambaran HTML pada komentar beserta penempatan tag kondisionalnya.
<b:if cond='data:comment.isDeleted'>
<b:else/>
<div class='comment-header'/>
<div class='comment-body'>
<data:comment.body/>
</div>
<div class='comment-reply'>
</b:if>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'>
<data:comment.body/>
</span>
</b:if>
Manipulasi deleted comment ini hanya bisa dilakukan pada Threaded Comments Hack.
93 komentar
2. Tinggalkan komentar sesuai topik tulisan
3. Apabila ada pertanyaan diluar artikel silahkan kunjungi Ruang Obrolan.
4. Centang Beri tahu saya untuk mendapatkan notifikasi via Email ketika ada balasan
5. Untuk menghapus komentar, geser kursor ke sebelah kanan komentar Anda.
image quote pre code
maap newbie nside
Jadi hanya bagian tertentu saja yang muncul saat diakses di mobile, jadi loadingnya bisa lebih cepat. Mohon bantuannya
padahal ane udah hapus semua cookies dan cache dll,
tapi error ini terus menghantui pos ane gan, tolong solusi nya gan
thx
Baru ngerti ane kang, xixi
Terima kasih infonya :D
mudah-mudahan dengan rujukan kali ini saya bisa membuatnya.. yah... coba lagi dan lagi :)
jadi itu termasuk full body
(maksud saya ketika kita masuk halaman erorr akan menghilangkan Sidebar,header dan sebagainya bukan kang)
atau mungkin mempunyai kode tersendiri agar terjadi seperti itu kah??
coba dulu, semoga cocok buat blog saya :) :D
Bahasa admin blog ieu mengena pisan jigana k para pembaca....
Pertahankan muridku spt ini ... ngan wayahna pasti loba nu tatanya mun elmu geus nerep k batur mah, da di dinya sumberna.
LoL
benul kang, padahal sudah banyak penjelasan masalah ini, nya mungkin karena kebanyakan bahasa kulon
tah eta kang diperyogikeun kanggo konsep blogazine hehe ..
urang cobian ahhhh
apa saja jenis jenis tag kondisional?
Makasih banget kang Ismet :)
ijin nyimak
Kang .. Gimana caranya bikin emot sepperti Kang Ismet?
Mau atuh kang script kanggo deleted coment na.
Saya coba dulu kang ;)
[img]http://i.imgur.com/oHxoy0s.png[/img]
Ini Penting pisan soal na, buat blog saya haturnuhun. :)
Buat nambah pengetahuan saya Kang terima
Kasih atas artikelnya, sangat bermanfaat.
kebetulan banget, ini dia yang saya tanya beberapa hari lalu