Banyak cara mempercepat loading blog, seperti yang sudah saya post sebelumnya tentang | | . Sekarang saya juga akan membahas satu topik yang fungsinya juga mengoptimalkan loading blog. Cara kerja yaitu dengan menampilkan widget atau CSS dan/atau Script hanya pada halaman yang dibutuhkan.
Misalnya saja kebanyakan memasang widget akan membuat blog anda berat. Terlebih lagi jika banyak widget social yang menampilkan gambar followersnya. Maka anda perlu mencoba widget social Mashable. Tetapi ada cara lain yang dapat kita gunakan yaitu dengan menampilkan widgetnya pada halaman tertentu saja? Misalnya saja kode iklan, newslatter atau sebagainya.
Caranya cukup gampang, anda cukup memasukan fungsi b:if pada widget yang akan diatur. Sebenarnya fungsi ini adalah fungsi kondisional pada blogspot. Kita dapat mengatur widget yang akan ditampilkan pada 5 type halaman berbeda, yaitu :
- Beranda alias homepage
- Posting artikel
- Halaman page statis (blog archive > berdasarkan tanggal publikasi)
- Halaman arsip
- Halaman artikel tertentu
Mengenal berbagai fungsi b:if
1# Menampilkan widget pada halaman homepage
<b:if cond='data:blog.url == data:blog.homepageUrl'>Kode Widget....
</b:if>
2# Menampilkan widget di semua halaman kecuali homepage
<b:if cond='data:blog.url != data:blog.homepageUrl'>Kode Widget....</b:if>
3# Menampilkan widget di semua halaman posting
<b:if cond='data:blog.pageType == "item"'>Kode Widget....</b:if>
4# Menampilkan widget di semua halaman kecuali halaman posting
<b:if cond='data:blog.pageType != "item"'>Kode Widget....</b:if>
5# Menampilkan widget di semua halaman page statis
<b:if cond='data:blog.pageType == "static_page"'>Kode Widget....</b:if>
6# Menampilkan widget di semua halaman kecuali page statis
<b:if cond='data:blog.pageType != "static_page"'>
Kode Widget....</b:if>
7# Menampilkan widget di semua halaman archive
<b:if cond='data:blog.pageType == "archive"'>Kode Widget....</b:if>
8# Menampilkan widget di semua halaman kecuali halaman archive
<b:if cond='data:blog.pageType != "archive"'>Kode Widget....</b:if>
9# Menampilkan widget di halaman tertentu
<b:if cond='data:blog.pageType == "Url halaman"'>Kode Widget....</b:if>
10# Menampilkan widget di semua halaman kecuali satu url tertentu
<b:if cond='data:blog.pageType != "Url halaman"'>Kode Widget....</b:if>
Menemukan ID widget & memasang fungsi b:if
Sebenarnya mudah menemukan ID sebuah widget dan bisa dilakukan dengan berbagai cara. ID widget bisa kita temukan karena sama dengan judul widget yang diberikan. Misalnya widget blog saya (Categories) itu adalah judul widget (title), nah disampingnya ntar ada kode Id='bla-bla-bla'.
Letak ID widget di template biasanya tersusun sama dengan posisinya pada blog. Anda dapat melihatnya di bagian Layout. Nah jika permasalahannya widget anda tidak mempunyai judul, beri judul saja dulu, nanti bisa dihapus.
<b:widget id='HTML5' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty ->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/></b:includable>
</b:widget>
Sekarang mari kita tambahkan fungsi b:if :
<b:widget id='HTML5' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'><!-- only display title if it's non-empty ->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/></b:if></b:includable>
</b:widget>
Memasang fungsi b:if pada script
<b:if cond='data:blog.pageType == "item"'><script type='text/javascript'>$(document).ready(function(){$(".toggle_container").hide();$(".trigger").click(function(){ $(this).toggleClass("triggeractive").next().slideToggle("slow"); }); });</script></b:if>
Memasang fungsi b:if pada CSS
<b:if cond='data:blog.pageType == "item"'><style type='text/css'>Kode CSS anda</style></b:if>
Tips & Last word from admin
Anda terlebih dahulu harus dapat membedakan mana script/css yang hanya berfungsi pada halaman tertentu. Harus mengetahui terlebih dahulu fungsi script/css tersebut. Misalnya saja lihat page navigation (posting baru/posting lama) dibawah postingan saya hilangkan, karena tidak begitu penting menurut saya.
Bagaimana? mengerti cara-cara diatas? Jika Anda masih menghadapi masalah untuk Cara Menampilkan Widget / CSS / Script Pada Halaman Tertentu. Maka jangan ragu untuk bertanya kepada saya. Tinggalkan komentar di bawah posting ini dan saya pasti akan membalas Anda jika ada waktu yang memungkinkan.
Bagaimana? mengerti cara-cara diatas? Jika Anda masih menghadapi masalah untuk Cara Menampilkan Widget / CSS / Script Pada Halaman Tertentu. Maka jangan ragu untuk bertanya kepada saya. Tinggalkan komentar di bawah posting ini dan saya pasti akan membalas Anda jika ada waktu yang memungkinkan.
Sekian post tentang Cara Menampilkan Widget / CSS / Script Pada Halaman Tertentu. Maaf bila ada salah-salah kata, semoga tulisan ini dapat bermanfaat bagi anda. Tetap terhubung dengan Ujangyoyo karena akan ada postingan baru yang lebih menarik. Happy Blogging friends!
AD-BLOCKER DETECTED!
