Friday, July 13, 2018

√ Cara Memakai Conditional Tag Di Blogger

Cara Menggunakan Conditional Tag  di Blogger √ Cara Menggunakan Conditional Tag  di Blogger

Conditional Tag, merupakan tag khusus yang dipakai di Blogger yang fungsinya sama ibarat logika IF. Ya ibarat namanya, tag ini bertugas menjalankan perintah apa saja pada kondisi tertentu. Makara contohnya kau sanggup memasang isyarat CSS yang hanya berlaku pada suatu halaman yang kau inginkan. Atau menyembunyikan/menampilkan sebuah widget hanya pada halaman tertentu.

Conditional tag salah satu topik yang paling sering dicari para pengguna blogger yang gemar melaksanakan modifikasi pada isyarat HTML blogger. Secara umum penggunaan conditional tag dalam HTML blogger ibarat berikut ini:

<b:if cond='kondisi_ekspresi'>     <!-- perintah ketika kondisi terpenuhi --> </b:if>

Bagian <!-- perintah ketika kondisi terpenuhi --> yakni kawasan untuk menuliskan perintah yang hanya dijalankan ketika kondisi_ekspresi terpenuhi. Selain itu berikut ini kondisi lisan apa saja yang sanggup dipakai beserta dengan fungsinya:

Daftar tipe halaman untuk Conditional tags

Archive page

Archive page atau halaman arsip merupakan halaman yang menampilkan postingan-postingan di blog menurut rentan waktu tertentu. Contohnya yakni ini atau ini.

<b:if cond='data:blog.pageType == "archive"'>     <!-- menjalankan perintah hanya di halaman arsip --> </b:if>

Error page (404)

404 merupakan halaman yang mewakili semua halaman yang tidak ditemukan atau tidak termasuk halaman yang spesifik.

<b:if cond='data:blog.pageType == "error_page"'>     <!-- menjalankan perintah di semua halaman error --> </b:if>

Index page

Halaman index merupakan istilah yang dipakai untuk menyebutkan halaman yang berisi daftar posting. Biasanya halaman ini hanya menampilkan daftar posting berupa judul dan ringkasan yang dilengkapi dengan jumplink (read more) untuk membuka posting secara lengkap. Beberapa yang termasuk halaman index yakni homepage, label, search query, dan search update.

<b:if cond='data:blog.pageType == "index"'>     <!-- semua index page --> </b:if>

Homepage

<b:if cond='data:blog.url == data:blog.homepageUrl'>      <!-- hanya di homepage --> </b:if>

Item (post) pages

Halaman yang menampilkan sebuah postingan secara penuh, contohnya yakni halaman ini.

<b:if cond='data:blog.pageType == "item"'>     <!-- semua halaman item (posting) --> </b:if>

Specific post by URL

Halaman spesifik yang didefinisikan dengan URL halaman tersebut. Artinya perintah pada conditional tag ini hanya akan tampil pada halaman yang mempunyai URL tersebut.

<b:if cond='data:blog.url == data:blog.canonicalHomepageUrl + "2014/08/foo"'>     <!-- menjalankan perintah di halaman (contoh) www.maringngerrang.com/2014/08/foo.html --> </b:if>

Label page

Salah satu halaman yang termasuk index page. Halaman ini menampilkan daftar postingan menurut label. Conditional tag ini berlaku untuk semua label. Contohnya yakni halaman ini.

<b:if cond='data:blog.searchLabel'>     <!-- semua label --> </b:if>

Spesific label page

Hampir sama ibarat label page, hanya saja lebih spesifik untuk label tertentu saja.

<b:if cond='data:blog.searchLabel == "foo"'>     <!-- hanya label 'foo' --> </b:if>

Search page

Halaman ini merupakan daftar postingan menurut kata kunci yang dimasukkan pada pencarian. Contohnya yakni halaman ini atau ini.

<b:if cond='data:blog.pageType == "archive"'>     <!-- menjalankan perintah hanya di halaman arsip --> </b:if>

Error page (404)

404 merupakan halaman yang mewakili semua halaman yang tidak ditemukan atau tidak termasuk halaman yang spesifik.

<b:if cond='data:blog.pageType == "error_page"'>     <!-- menjalankan perintah di semua halaman error --> </b:if>

Index page

Halaman index merupakan istilah yang dipakai untuk menyebutkan halaman yang berisi daftar posting. Biasanya halaman ini hanya menampilkan daftar posting berupa judul dan ringkasan yang dilengkapi dengan jumplink (read more) untuk membuka posting secara lengkap. Beberapa yang termasuk halaman index yakni homepage, label, search query, dan search update.

<b:if cond='data:blog.pageType == "index"'>     <!-- semua index page --> </b:if>

Homepage

<b:if cond='data:blog.url == data:blog.homepageUrl'>      <!-- hanya di homepage --> </b:if>

Item (post) pages

Halaman yang menampilkan sebuah postingan secara penuh, contohnya yakni halaman ini.

<b:if cond='data:blog.pageType == "item"'>     <!-- semua halaman item (posting) --> </b:if>

Specific post by URL

Halaman spesifik yang didefinisikan dengan URL halaman tersebut. Artinya perintah pada conditional tag ini hanya akan tampil pada halaman yang mempunyai URL tersebut.

<b:if cond='data:blog.url == data:blog.canonicalHomepageUrl + "2014/08/foo" target="_blank">Custom Search Engine, maka conditional tag ini tidak berlaku.

<b:if cond='data:blog.searchQuery'>     <!-- semua hasil pencarian --> </b:if>

Specific Search Query page

Sama ibarat search page hanya saja lebih spesifik untuk query tertentu.

<b:if cond='data:blog.searchQuery == "foo"'>     <!-- hanya pencarian dengan query 'foo' --> </b:if>

Static page

Merupakan halaman yang dibentuk oleh user. Melalui blogger dengan menciptakan halaman gres di bab Halaman. Contohnya yakni ini.

<b:if cond='data:blog.pageType == "static_page"'>     <!-- semua halaman statis --> </b:if>

Spesifi static page by URL

Sama ibarat static page hanya saja spesifik menurut URL tertentu

<b:if cond='data:blog.url == data:blog.canonicalHomepageUrl + "p/foo.html"'>     <!-- halaman statis dengan alaman (contoh) www.maringngerrang.com/p/foo.html --> </b:if>

Mobile page

Seperti yang kita ketahui bahwa sebagian besar tampilan PC dan tampilan di Mobile mempunyai beberapa perbedaan, termasuk perbedaan kode. Khususnya bagi pengguna AMP HTML. Untuk mengatur mana yang tampil di mobile dan mana yang tidak sanggup memakai conditional tag di bawah, ganti dengan true untuk tampilan mobile dan false untuk selain tampilan mobile:

<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>     <!-- perintah ini hanya tampil pada tampilan mobile --> </b:if>

Fungsi NOT, OR, AND, dan ELSE

NOT

Fungsi NOT sanggup dibilang sebagai fungsi "pengecualian" atau fungsi "kebalikan". Conditional tag ini akan menjalankan perintah kecuali pada kondisi yang disebutkan. Bagian yang membuktikan NOT yakni penggunaan == diganti dengan !=.

<b:if cond='data:blog.pageType != "item"'>     <!-- perintah untuk semua halaman kecuali halaman item (posting) --> </b:if>

atau

<b:if cond='data:blog.url != data:blog.homepageUrl'>     <!-- semua halaman kecuali homepage --> </b:if>

OR

Fungsi OR yakni sesuai artinya yaitu "atau". Makara perintah hanya dijalankan salah satunya saja, bila salah satu kondisi terpenuhi, maka kondisi lainnya diabaikan.

<b:if cond='data:blog.url == data:blog.homepageUrl'>     <!-- baris perintah hanya dijalankan bila halaman ini yakni homepage --> <b:elseif cond='data:blog.pageType == "static_page"'>     <!-- baris perintah hanya dijalankan bila halaman ini yakni halaman statis --> </b:if>

AND

Fungsi AND yakni untuk kondisi berganda. Makara perintah akan dijalankan bila dan hanya bila semua kondisi terpenuhi. Contoh kasus berikut ini, perintah akan dijalankan pada semua index_page (homepage, label, search query, dan search update) DAN terkecuali sebuah halaman label, yaitu halaman label 'foo'. Makara perintah hanya berlaku bila kedua kondisi tersebut terpenuhi.

<b:if cond='data:blog.pageType == "index"'>     <b:if cond='data:blog.searchLabel != "foo"'>         <!-- perintah dijalankan di semua index_page (termasuk label), kecuali label 'foo' -->     </b:if> </b:if>

ELSE

Fungsi Else yakni untuk menjalankan perintah bila semua kondisi yang disebutkan tidak terpenuhi. Atau dengan kata lain, selain semua kondisi yang disebutkan.

<b:if cond='data:blog.pageType == "item"'>     <!-- perintah bila halaman ini halaman posting (item) --> <b:elseif cond='data:blog.pageType == "static_page"'>     <!-- perintah bila halaman ini halaman statis --> <b:else/>     <!-- perintah bila ini bukan halaman posting dan bukan halaman statis --> </b:if>

Contoh Pengaplikasian

Conditional tags sanggup diaplikasikan untuk menjalankan perintah tertentu pada Blogger, seperti:
  • Menampilkan widget pada halaman tertentu
  • Menggunakan isyarat CSS hanya pada halaman tertentu
  • Menambahkan meta tag Facebook dan tag kartu Twitter
  • Load JavaScript pada halaman tertentu saja (bisa mempercepat loading blog pada halaman yang tidak perlu load JS tersebut)
  • Menampilkan tag 'title' sesuai jenis halaman (Optimasi tag Title SEO)

Misalnya, saya akan menghilangkan widget HTML2 pada tampilan seluler (HTML2 merupakan ID widget tersebut, ini atau ini.

<b:if cond='data:blog.pageType == "archive"'>     <!-- menjalankan perintah hanya di halaman arsip --> </b:if>

Error page (404)

404 merupakan halaman yang mewakili semua halaman yang tidak ditemukan atau tidak termasuk halaman yang spesifik.

<b:if cond='data:blog.pageType == "error_page"'>     <!-- menjalankan perintah di semua halaman error --> </b:if>

Index page

Halaman index merupakan istilah yang dipakai untuk menyebutkan halaman yang berisi daftar posting. Biasanya halaman ini hanya menampilkan daftar posting berupa judul dan ringkasan yang dilengkapi dengan jumplink (read more) untuk membuka posting secara lengkap. Beberapa yang termasuk halaman index yakni homepage, label, search query, dan search update.

<b:if cond='data:blog.pageType == "index"'>     <!-- semua index page --> </b:if>

Homepage

<b:if cond='data:blog.url == data:blog.homepageUrl'>      <!-- hanya di homepage --> </b:if>

Item (post) pages

Halaman yang menampilkan sebuah postingan secara penuh, contohnya yakni halaman ini.

<b:if cond='data:blog.pageType == "item"'>     <!-- semua halaman item (posting) --> </b:if>

Specific post by URL

Halaman spesifik yang didefinisikan dengan URL halaman tersebut. Artinya perintah pada conditional tag ini hanya akan tampil pada halaman yang mempunyai URL tersebut.

<b:if cond='data:blog.url == data:blog.canonicalHomepageUrl + "2014/08/foo" target="_blank">pelajari lebih lanjut cara mengetahui ID widget di blogger)

Pertama-tama buka Tema pada Blogger kemudian klik Edit HTML, kemudian temukan ID blog yang dicari - dalam pola ini yakni HTML2 -, kau sanggup klik tombol Lompat ke widget pada bab atas sajian Edit HTML. Kode widget tersebut kurang lebih ibarat ini:

<b:widget id='HTML2' locked='false' title='' type='HTML'>   <b:widget-settings>     <b:widget-setting name='content'>...</b:widget-setting>   </b:widget-settings>   <b:includable id='main'>     <!-- only display title if it's non-empty -->     <b:if cond='data:title != &quot;&quot;'>       <h2 class='title'><data:title/></h2>     </b:if>     <div class='widget-content'>       <data:content/>     </div>      <b:include name='quickedit'/> <!-- hilangkan ini bagi pengguna AMP HTML -->   </b:includable> </b:widget>

Setelah itu tambahkan isyarat conditional cond='data:blog.isMobileRequest == &quot;true&quot;' sebagai atribut pada tag b:widget. Lalu kodenya akan terlihat ibarat ini:

<b:widget cond='data:blog.isMobileRequest == &quot;true&quot;' id='HTML2' locked='false' title='' type='HTML'>

Kamu sanggup mengganti nilai true menjadi false. True berarti widget tersebut tampil di ponsel dan tidak tampil bila dibuka di PC, sedangkan false yakni sebaliknya.

Selain itu untuk menghindari isyarat AMP HTML, kau juga perlu menghapus <b:include name='quickedit'/> pada setiap widget yang ada di HTML blog kamu.

Tips dan Peringatan

Tips

Saat kau menyalin conditional tag di atas ke dalam HTML blog kau di Blogger, secara otomatis editor akan mengkonversi semua simbol kutip ganda " menjadi &quot;. Oleh alasannya yakni itu sebelum memasukkan conditional tag di atas ke blog kamu, ganti semua kutip ganda " menjadi &quot;. Anda sanggup mengaturnya dengan gampang di sini.

Peringatan

Mungkin dengan salah satu pola kondisi untuk widget blog di atas, kau sanggup lebih mengerti wacana peletakan conditional tag pada HTML blogger beserta fungsi penggunaannya. Selalu ingat untuk memperhatikan dengan baik derma isyarat epilog pada conditional tag yaitu isyarat </b:if> yang membuktikan final perintah conditional tag tersebut. Pastikan tidak ada tag yang saling berseberangan akhir meletakkan tag epilog yang tidak pada tempatnya.

Penutup

Itulah beberapa hal yang sanggup kau pelajari wacana Conditional Tag di Blogger beserta fungsi dan cara penggunannya. Dengan demikian kau sanggup mencoba berguru memodifikasi HTML blogger sesuai kebutuhan dan impian kamu. Jangan lupa tinggalkan komentar terbaik kau di bawah atau di halaman contact blog ini. Terima kasih, biar bermanfaat dan hingga jumpa!
Sumber http://www.maringngerrang.com/