Tutorial Dasar 5 Conditional Tags Blogger

Selamat pagi dan apa kabar, brother? Saya harap kamu tetap dalam keadaan sehat. Artikel ini akan menjadi yang terakhir aku akan menjelaskan tentang bagian2 blogger, setelah ini kita akan mengeksekusi langsung dengan cara membuat templeate sederhana. Berbaring di sofa temukan posisi yang paling nyaman untuk bersantai, ambil segelas kopi, dan mainkan musik. Lalu let's Go! Ayo kita belajar!

Conditional Tag

Blogger pun juga punya tag logika if ... else. Apa itu conditional ? sebuah aksi yang muncul karena kondisi yang telah terpenuhi. Seperti ketika kita lapar, jika kita lapar maka kita akan makan, jika tidak maka kita tidak akan makan.

Sudah paham apa itu conditional? Aku anggap kamu sudah paham. Lalu apa gunanya kita menggunakan conditional tag di blogger?

Jika kita ingin membuat landing page untuk homepage dan ingin menunjukkan sidebar untuk blog post atau if kita ingin menunjukkan judul untuk spesifik page di browser, kita perlu meng custom itu dengan menggunakan kondisi if else yang diperbolehkan digunakan di Blogger.

Statement if else:

<b:if condition>
 <!--Statement One-->
 <b:else />
 <!--Statement Two-->
</b:if>

Jika kondisi benar maka lakukan itu, jika kondisi salah maka jangan lakukan itu.

Index/Homepage

Targetnya ialah page meliputi halaman show label, search, dan lain - lain.

<b:if cond='data:blog.pageType == "index"'>
<!--Content for Index-->
</b:if>

Dynamic/Item page

Targetnya ialah page yang kita inginkan. Seperti contoh kita ingin salah satu page memiliki tampilan yang sangat berbeda dengan page yang lain.

<b:if cond='data:blog.pageType == "item"'>
<!--Content for Item-->
</b:if>

Kalian bisa mengisi item dengan url di blog kalian. Sebagai contoh isi item tersebut dengan url post yang paling terbaru.

<b:if cond='data:blog.pageType == "linkTarget"'>
<p>Aku paling beda dengan yang lain</p>
</b:if>

Static Page

Static page maksudnya page yang kita buat. Kalian bisa membuat page tersebut di menu blogger lalu pilih pages. Urlnya seperti ini:

http://www.sweetdream.com/p/iniPage.html

<b:if cond='data:blog.pageType == "static_page"'>
<!--Content for Static Page-->
</b:if>

Error Page

Targetnya kepada page error, error page akan muncul ketika pengunjung mengunjungi halaman atau post yang tidak pernah kita buat.

<b:if cond='data:blog.pageType == "error_page"'>
<!--Content for Error Page-->
</b:if>

Search Page

Seperti judulnya, ini menargetkan halaman pencarian.

<b:if cond='data:blog.searchQuery'>
 <!-- Content for Search Page -->
</b:if>

Label Page

Page yang menargetkan halaman label.

Kondisi untuk semua page label

<b:if cond='data:blog.pageType == "index"'>
 <b:if cond='data:blog.SearchLabel != ""'>
 <!--Content for Label Page-->
</b:if>

Kondisi untuk spesific label

<b:if cond='data:blog.searchLabel== "Label Name"'>
<!--Content for Label Name-->
</b:if>

Spesific URL Homepage

Target yang berfokus hanya kepada halaman homepage.

<b:if cond='data:blog.url == "data:blog.homepageUrl"'>
<!--Content-->
</b:if>

Spesific URL

Targetnya berfokus kepada URL yang kita miliki.

<b:if cond='data:blog.url == "linkTarget"'>
<!--Content-->
</b:if>

Dan masih banyak lagi koleksi conditional tag.

<b:if cond='data:post.showBacklinks'><!--content--></b:if>
<b:if cond='data:displayname == "specific-name"'><!--content--></b:if>
<b:if cond='data:post.numComments == [number_here]'><!--content--></b:if>
<b:if cond='data:post.hasJumpLink'><!--content--></b:if>
<b:if cond='data:post.allowComments'><!--content--></b:if>
<b:if cond='data:blog.metaDescription'><!--content--></b:if>
<b:if cond='data:mobile'><!--content--></b:if>
<b:if cond='data:title'><!--content--></b:if>
<b:if cond='data:title != ""'><!--content--></b:if>
<b:if cond='data:showThumbnails == "false/true"'><!--content--></b:if>
<b:if cond='data:showSnippets == "false/true"'><!--content--></b:if>
<b:if cond='data:post.thumbnail'><!--content--></b:if>
<b:if cond='data:display == "list"'><!--content--></b:if>
<b:if cond='data:blog.url == data:label.url'><!--content--></b:if>
<b:if cond='data:showFreqNumbers'><!--content--></b:if>
<b:if cond='data:useImage'><!--content--></b:if>

Tidak apa - apa, jangan dipelajari semua. Simpan saja untuk tutorial selanjutnya. Kita akan mempelajarinya langsung di lapangan yaitu start to build your theme.

Wah, sudah mulai gila nih? Sebentar lagi kalian sudah siap untuk menjadi dev front-end di blogger. Tetap semangat! Dan terus berjuang!

Saya sudahi dulu tutorial kali ini. Jika ada pertanyaan silahkan sampaikan unek - unekmu di komentar. Kalau ada kata - kata yang menyinggung perasaanmu aku minta maaf.

Terima kasih dan sampai jumpa lagi.