Wednesday, July 30, 2014

Conditional tag dalam template blogspot

Conditional tag merupakan suatu kondisi tag pada template blogger yang berfungsi untuk mengkondisikan elemen atau widget pada halaman tertentu.

Beberapa diantaranya fungsi dari conditional tag atau tag kondisi  adalah :
  1. Mengembunyikan widget tertentu pada halaman blog.
  2. Membuat tampilan blog berbeda pada tiap halaman.
  3. Custom halaman statis pada blog.
  4. Custom halaman blog versi mobile.
Sintak kondisi yang umumnya pada blogspot adalah :
<b:if cond='[KONDISI]'> ... </b:if>

Berikut beberapa sintak kondisi yang terdapat pada blogspot :
  1.  Menampilkan widget atau elemen pada halaman utama saja.
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <!-- elemen / gadget (jika sama dengan halaman utama maka elemen di tampilkan) -->
    </b:if>
    Bisa juga menggunakan kondisi <b:if cond='data:blog.pageType == &quot;index&quot;'> atau <b:if cond='data:blog.homepageUrl == data:blog.url'>
  2. Hanya tampil pada halaman statik.
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
    <!-- elemen / gadget -->
    </b:if>
  3. Hanya tampil pada halaman arsip.
    <b:if cond='data:blog.pageType == &quot;archive&quot;'>
    <!-- elemen / gadget -->
    </b:if>
    Misalnya, http://bloganda.blogspot.com/2014_07_01_archive.html
  4. Hanya tampil pada halaman label.
    <b:if cond='data:blog.searchLabel'>
    <!-- elemen / gadget -->
    </b:if>
    Kondisi yang menampilkan elemen ketika mengakses url http://zimnote.blogspot.com/search/label/nama_label.
  5. Hanya tampil pada halaman posting.
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <!-- elemen / gadget -->
    </b:if>
  6. Hanya tampil pada halaman versi mobile.
    <b:if cond='data:blog.isMobile'>
    <!-- elemen / gadget -->
    </b:if>
    Jika halaman blog menampilkan versi mobile atau url http://bloganda.blogspot.com/?m=1
  7. Kondisi meta description.
    <b:if cond='data:blog.metaDescription == &quot;&quot;'>
    <!-- elemen / gadget -->
    </b:if>
    Meta description ini berfungsi untuk mengetahui data pada blog, jika kita mengaktifkan description otomatis pada blog, jadi ketika kita inputkan description blog, maka data description pada blog ditampilkan.
  8. Menampilkan pada halaman url tertentu
    <b:if cond='data:blog.url == &quot;alamatURL&quot;'>
    <!-- elemen / gadget -->
    </b:if>
  9. Menampilkan elemen pada postingan pertama
    <b:if cond="data:post.isFirstPost">
    <!-- elemen / gadget -->
    </b:if>
  10. Menampilkan elemen pada halaman error 404
    <b:if cond='data:blog.pageType == &quot;error_page&quot;'>
    <!-- elemen / gadget -->
    </b:if>

Pemempatan tag kondisi.

Contoh menampilkan widget pada halaman utama saja.
Tampilan widget pada blogspot.
  <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 != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
</b:includable>
  </b:widget>

Letak penambahan tag kondisi.
<b:widget id='HTML5' locked='false' title='' type='HTML'>
 <b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
  <!-- 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:if>
</b:includable>
  </b:widget>

Sintak operator "=="

Contoh : <b:if cond='5 == 5'> angkanya adalah 5 </b:if>
Jika kondisi 5 jawaban 5. Maka tampil "angkanya adalah 5"
operator "==" jika nilainya sama atau true, maka tampilkan "angkanya adalah 5".
operator "!=" jika nilainya tidak sama.

Bersambung ke artikel berikutnya tentang menggunakan dua tag kondisi pada template blogspot