بِسْــــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم
Tampilkan (Paparan) Widget Pada Halaman Tertentu: Kali ini BM ingin berkongsi satu tutorial mudah tetapi sangat berguna. Ianya amat membantu bagi mengemaskan lagi penampilan blog anda.

Ketahuilah bahawa tidak semua widget perlu ada atau ditampilkan pada setiap halaman blog. Ada diantaranya hanya perlu ditampilkan pada halaman utama (homepage) sahaja, ada juga yang perlu ditampilkan pada halaman posting sahaja dan sebagainya.

Semua itu boleh diaturkan kemunculannya dengan mudah. Ia bukan sahaja mengemaskan penampilan halaman tersebut tetapi juga membantu mengurangkan masa untuk loading kerana beberapa widget yang tidak perlu telah dikurangkan untuk muncul dihalaman tersebut.

Tampilkan Widget Pada Halaman Tertentu

Contoh mudah adalah seperti Widget Entri Terkini (recent post). Tidak perlulah ianya ditampilkan di halaman depan (homepage) kerana halaman tersebut sudah tentu memaparkan susunan entri terkini blog.

Atau mungkin juga anda ingin menampilkan widget tertentu di halaman tertentu seperti setting Widget Bloglist dan Label yang hanya muncul pada halaman statik (page) seperti di blog ini.

Begitu juga dengan beberapa widget yang anda rasakan ianya hanya perlu ditampilkan atau dipaparkan pada halaman-halaman tertentu mengikut kesesuaian kegunaannya.

Tutorial ini akan memberi tunjuk ajar bagaimana hendak melakukan setting penampilan widget tersebut. Ianya mudah tetapi perlulah cermat kerana sedikit kesilapan mungkin tidak akan berjaya atau mungkin mengubah setting yang lain pula.

Tutorial

Berikut adalah panduan atau cara menampilkan widget tersebut untuk muncul dihalaman yang anda inginkan.

Anda hanya perlu memasukkan dua kod iaitu satu dibahagian atas (permulaan kod widget) dan satu lagi dibahagian bawah (penutup kod widget) di dalam html template anda.

Pilihan kod-kod ini bergantung kepada pada paparan manakah yang anda inginkan widget tersebut muncul. Pilihan kod tersebut adalah seperti di bawah ini.

1. Widget ditampilkan HANYA pada halaman depan (homepage)
<b:if cond='data:blog.url == data:blog.homepageUrl'>
------------------------------------------
----------(kod widget anda)----------
------------------------------------------
</b:if>

2. Widget ditampilkan di semua halaman KECUALI pada halaman depan (homepage)
<b:if cond='data:blog.url != data:blog.homepageUrl'>
------------------------------------------
----------(kod widget anda)----------
------------------------------------------
</b:if>

3. Widget ditampilkan HANYA di halaman posting (setiap entri).
<b:if cond='data:blog.pageType == &quot;item&quot;'>
------------------------------------------
----------(kod widget anda)----------
------------------------------------------
</b:if>

4. Widget ditampilkan di semua halaman, KECUALI halaman posting (setiap entri).
<b:if cond='data:blog.pageType != &quot;item&quot;'>
------------------------------------------
----------(kod widget anda)----------
------------------------------------------
</b:if>

5. Widget ditampilkan HANYA pada posting (entri) tertentu.
<b:if cond='data:blog.url == &quot;url-entri&quot;'>
------------------------------------------
----------(kod widget anda)----------
------------------------------------------
</b:if>

6. Widget ditampilkan di semua halaman KECUALI pada halaman posting (entri) tertentu.
<b:if cond='data:blog.url != &quot;url-entri&quot;'>
------------------------------------------
----------(kod widget anda)----------
------------------------------------------
</b:if>

7. Widget ditampilkan hanya pada paparan Desktop (tiada pada paparan Mobile)
<b:if cond='data:blog.isMobileRequest == "false"'>
------------------------------------------
----------(kod widget anda)----------
------------------------------------------
</b:if>

8. Widget ditampilkan hanya pada paparan Mobile (tiada pada paparan Desktop)
<b:if cond='data:blog.isMobileRequest == "true"'>
------------------------------------------
----------(kod widget anda)----------
------------------------------------------
</b:if>

Panduan Masukkan Kod

Berikut adalah langkah-langkah untuk memasukkan pilihan kod-kod tersebut di dalam html widget template anda.

Pertama sekali, Log masuk ke akaun blogger anda.
  1. Klik [Template]
  2. Klik [Edit HTML]
p/s: Anda digalakkan untuk 'backup template' sebelum melakukan sebarang pengubahsuaian kod. Ianya langkah keselamatan jika berlaku sebarang masalah yang tidak diingini berlaku.

Cara Tampilkan Widget Pada Halaman Tertentu

Setelah masuk ke halaman HTML, terus kepada kod widget anda sama ada dengan cara :
  1. Scroll ke bawah, atau
  2. Klik [Jump to widget] dan pilih widget yang ingin diubah.
Cara Tampilkan Widget Pada Halaman Tertentu
Boleh juga guna carian dengan tekan [CTRL+F]

Contoh:
Widget ditampilkan di semua halaman KECUALI pada halaman depan (homepage)
<b:if cond='data:blog.url != data:blog.homepageUrl'>
------------------------------------------
----------(kod widget anda)----------
------------------------------------------
</b:if>

Caranya:
1. Letakkan kod <b:if cond='data:blog.url != data:blog.homepageUrl'> di atas kod berikut:
<!-- only display title if it's non-empty -->
2. Letakkan kod </b:if> di atas kod berikut:
</b:includable>
3. Klik [Save template]

Cara Tampilkan Widget Pada Halaman Tertentu
Penting! Pastikan kod diletakkan pada tempat yang betul!

Kini, ianya sudah selesai dan anda boleh mengujinya dengan melihat sama ada ianya berfungsi dengan baik atau tidak.

Ianya amat mudah dan bagi mereka yang takut-takut untuk mengusik kod html ini, inilah masanya untuk mencuba. Jangan risau kerana jika sudah 'backup template', sebarang kesilapan atau error berlaku, anda hanya perlu 'Restore' sahaja semula.

Widget Tertentu Untuk Halaman Tertentu

Semoga tutorial ini dapat memberi manfaat kepada yang memerlukan. Sesetengah widget amat berat masa loadingnya dan sesetengahnya pula tidak penting untuk dipaparkan di semua halaman blog.

Melalui setting di dalam tutorial ini, ianya dapat memberi pilihan buat kita untuk mengemaskan lagi penampilan blog dan mengurangkan masa loading pada halaman-halaman tertentu.

Sebenarnya, jika anda faham akan fungsi kod-kod di atas, ianya bukan sahaja boleh digunakan untuk widget tetapi apa jua bahagian di dalam template anda boleh di setkan paparannya di mana-mana halaman tertentu yang anda inginkan.

Selamat mencuba dan semoga berjaya! 

16 comments - "Cara Tampilkan Widget Pada Halaman Tertentu"

paridah delete icon 09:51

assalam..terima kasih banyak perkongsiannya...amat bermenafaat tutorialnya...akan rujuk lagi jika nk tambah widget..

dah lama akak tak mengodek HTML kat blog...
sesekali buka,berpinar mata..terus off...

pergh...terbaik la BM..

Etuza delete icon 13:27

Memang hebat perkongsian Blogger BM ni..sangat halus seni..karya, teliti dan kemas..tahnia ya.Pasti Etuza klik lagi nak ilmu ini..baru ada extra ilmu baru..

Saya pun guna setting ni untuk hide beberapa widget dimuka hadapan.

Waalaikumsalam,
Semoga ianya berguna apabila diperlukan...

Haha... Memang berpinar2 biji mata bila lihat huruf dan nombor yang pelbagai warna tu!

Apa yang terbaik tu...kureng jelas le?

Perkongsian biasa jer... dah banyak dikongsikan oleh blogger lain... Semoga berguna ya... :)

Bagi mereka yang tahu kegunaannya memang terasa ianya satu setting yang sangat membantu... :)

ooo...sebenarnya boleh ye buat camni
saya kena belek lama ni nak kasi paham
nak usik sangat tak berani plak

Jangan takut. Yang penting dah back up... Lepas tu cubalah!
Walaupun sampai tunggang terbalik, kalau dah tak boleh... Restore jer, baliklah kepada asal semula.
Kalau tak buat sendiri sampai bila2 pun xkan berani!

bgsnya BM siap ada tutorial lengkaap,
terima ksh atas perkongsian ilmu..
bgs utk sy yg newbie ni..maknanya nk kena main koding la ye,,,hehhehehe

Wah siap buat turorial lagi ni..ok laaa nnt bls refer sini..tq BM 2

Mrs. A delete icon 16:59

"Semua itu boleh ditampilkan dengan mudah"
Tidak semudah itu for dummy HTML macam Mrs. A hiks!

Saya klo bab HTML kod ni memang tak pandai ☺

Komen anda amat-amat dihargai. Terima kasih bersama 'Blog BinMuhammad - “Jazakumullah Khairan Katsiran Wa Jazakumullah Ahsanal Jaza”

p/s: Komen berserta link url aktif ( <a href=http://..... ) akan terus dianggap spam. Harap maklum

 
Copyright © 2015 BinMuhammad - Ilmu Dikongsi Bersama - All Rights Reserved - About Me - Policy - Disclaimer - Sitemap