Featured Post

Cara Mengaktifkan Fitur Https Di Blogspot/Blogger

Hei guys, tutorial kali ini Titip Teknologi akan membahas bagaimana cara mengaktifkan fitur HTTPS di blogspot/blogger. Dengan mengaktifkan fitur HTTPS (HTTP Secure) ini tentu saja akan kuat terhadap SEO blog Anda alasannya yaitu blog Anda akan dinilai lebih kondusif oleh search engine. HTTPS sanggu…

Cara Memakai Tag Kondisional Untuk Pemula - (Study Kasus)

Pernahkan anda menginginkan loading blog anda ingin menjadi lebih ringan atau anda menginginkan attribut pada tampilan blog anda tampil berbeda untuk setiap halaman?

Seperti contohnya  ingin menampilkan Widget blog tertentu hanya di halaman artikel saja sedangkan di halaman homepage tidak ditampilkan, atau ingin menampilkan desain tertentu di halaman tertentu saja sedangkan di halaman lainnya tidak, atau ingin menampilkan iklan adsense tata letak dan jenis iklan berbeda antara tampilan di homepage dengan tampilan di artikel lainnya dan kasus-kasus serupa lainnya,

Jika harapan anda kurang lebih menyerupai itu, maka sebagai solusinya anda sanggup melibatkan penggunaan tag kondisional pada arahan template blogspot anda.

Apa itu tag kondisional?
Tag kondisional bergotong-royong bukan istilah abnormal di dunia bahasa pemrograman, di algoritma dan dunia bahasa pemrograman istilah ini sering disebut dengan "flow control", bila anda seorang programmer atau yang pernah mempelajari algoritma dan bahasa pemrograman anda niscaya tidak abnormal dengan istilah "Flow control", dan anda niscaya tau apa fungsinya serta kapan harus digunakan.

Pernahkan anda menginginkan loading blog anda ingin menjadi lebih ringan atau anda menging Cara Menggunakan Tag Kondisional Untuk Pemula -  (Study Kasus)


Tapi untuk anda yang kebetulan tidak mempunyai dasar dan pengalaman di dunia bahasa pemrograman dan anda kebetulan ialah blogger pemula yang gres terjun  di dunia blogging, dan kebetulan belum familiar dengan penggunaan tag kondisional, saya yakin akan sedikit galau dengan penggunaan tag kondisional.

Melalui artikel ini saya akan jelaskan secara lengkap dan panjang lebar perihal tag kondisional ini, dan saya berharap anda sanggup memahaminya dan sanggup menerapkannya pada blog anda yang sanggup anda gunakan untuk mengatur tampilan blog anda biar sesuai dengan yang anda inginkan.

# MENGENAL APA ITU TAG KONDISIONAL?


Untuk blog berflatform blogspot tag kondisional ialah arahan khsusus (kode template) yang sanggup dipakai pada template blog anda yang berfungsi untuk mengatur tampilan di halaman-halaman tertentu atau bagian-bagian tertentu pada blog anda biar tampilannya sanggup diadaptasi dengan yang anda inginkan serta sanggup dibedakan dengan tampilan halaman-halaman lainnya pada blog anda, bahkan tag kondisional tingkat lanjut sanggup anda gunakan untuk menciptakan halaman blog menjadi lebih ringan.

Secara umum jenis-jenis format penulisan arahan tag kondisional di blogspot ialah sebagai berikut:

Satu masalah (untuk masalah sederhana):
<b:if cond='kondisi'>
     KODE
</b:if>
Rangkaian arahan ditas mempunyai pengertian, Jika kondisi terpenuhi maka proses KODE, bila tidak terpenuhi KODE tidak akan diproses

Untuk 2 kasus:
<b:if cond='suatu_kondisi'>
     KODE 1
<b:else/>
     KODE 2
</b:if>
Rangkaian arahan diatas mempunyai pengertian:
Jika suatu_kondisi terpenuhi maka yang akan diproses ialah KODE 1, bila tidak terpenuhi maka yang akan diproses ialah KODE 2. Kode <b:else/> sanggup anda artiken bila tidak.

Atau tag kondisional bersarang (tag kondisional yang diletakan di dalam tag kondisional lainnya):
<b:if cond='kondisi'>
     <b:if cond='kondisi2>
         KODE ANDA
    </b:if>
<b:else/>
     KODE ANDA2
</b:if>
Pengertian tag kondisional bersarang bersarang sama halnya dengan tag kondisional diatas, yang membedakannya ialah pada suatu arahan tag kondisional terdapat tag kondisional di dalamnya.

Kode diatas hanyalah beberapa format arahan penulisan tag kondisional secara umum dan hanya untuk beberapa masalah saja, pada kenyatannya tag kondisional sanggup diadaptasi dan sanggup kita atur sedemikain sehingga sesuai dengan kondisi-kondisi yang diinginkan, terutama untuk kasus-kasus yang berkaitan dengan customisasi halaman blogg berflatform blogspot.

#Penggunaan Operator pada tag Kondisonal

Beberapa format tag kondisional menyerupai pola Titip Teknologi di atas hanya memakai operator == atau sanggup diartikan sebagai sama dengan,
Contoh dari tag kondisional dengan operator ==
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
         KODE
    </b:if> 
Kode di atas sanggup diartikan:
Jika halaman ialah halaman static maka sanksi atau proses KODE, artinya KODE yang anda bungkus dengan tag kondisional di atas akan di proses bila halaman blog yang dibuka ialah halaman static.

Ada kalanya jenis operator yang dipakai ialah operator != atau <> (baca: tidak sama dengan), tentu saja pengertiannya akan berbeda dengan tag kondisional yang memakai operator jenis == (baca: sama dengan)

Contoh tag kondisional dengan operator != (baca tidak sama dengan atau bukan)
    <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
         KODE
    </b:if>
Kode diatas sanggup diartikan:
Jika Halaman bukan halaman static maka jalankan KODE, artinya KODE yang dibungkus tag kondisional gres akan di proses oleh mesin blogger bila halaman yang dibuka bukan halaman static.


Tidak usah khawatir bila anda galau dengan kode-kode diatas, yang harus anda ingat ialah format nya saja dan logikanya, silahkan dilanjut membaca untuk lebih memahami lebih detail.

# KAPAN TAG KONDISIONAL DIGUNAKAN?

Seperti yang telah disinggung diatas, tag kondisional salah satunya sanggup anda gunakan saat anda menginginkan sebuah tampilan tertentu (misalnya sebuah widget khusus, iklan adsense, atau desain tampilan blog lainnya), dimana tampilan tersebut hanya ingin tampil di halaman-halaman tertentu saja sanggup di satu halaman tertentu saja sedangkan di halaman lainnya jangan ditampilkan.

Beberapa masalah kita harus memakai tag kondisional ialah sebagai berikut:
Contoh 1:
Misalkan anda ingin menampilkan descripsi judul berbeda, untuk halaman homepage dengan halaman artikel, contohnya saat yang dibuka halaman homepage maka deskripsi harus bertuliskan "abc", sedangkan saat yang dibuka  halaman postingan atau halaman artikel maka descripsi judul harus bertuliskan "xyz".

Contoh 2:
Saya ingin menampilkan widget recent post, hanya tampil di halaman postingan saja, tapi saat di halaman homepage widget tersebut jangan ditampilkan.

Beberapa masalah menyerupai di atas sanggup diselesaikan memakai tag kondisional yang harus anda tambahkan di arahan template blog anda sesuai dengan pengaturan yang anda inginkan.

# CARA MENGGUNAKAN TAG KONDISIONAL DI HALAMAN BLOG ANDA

Berikut kumpulan dan macam-macam penggunaan tag kondisional untuk halaman-halaman tertentu pada blog anda:

a. Penggunaan Tag Kondisional pada Halaman Homepage

Halaman homepage atau halaman muka atau sanggup juga disebut sebagai halaman index ialah halaman utama blog anda, halaman ini terbuka saat anda mengakses blog anda memakai alamat utama blog anda, misalkan blog saya : halaman homepagenya ialah https://titipteknologi.blogspot.com

Jika anda menginginkan sebuah tampilan (widget tertentu, iklan adsense, text atau tampilan lainnya), hanya ingin muncul di halaman utama, maka arahan yang anda ingin tampilkan harus dibungkus dengan tag kondisional untuk halaman homepage.
<b:if cond='data:blog.pageType == &quot;index&quot;'>
     KODE ANDA
</b:if>
Terjemahan arahan diatas:
Jika halaman ialah halaman index (salah satunya homepage) maka proses KODE ANDA.

KODE ANDA, sanggup anda isi dengan arahan apapun misal arahan iklan adsense, arahan widget, atau arahan apapun.

Dengan membungkus Kode anda dengan arahan di atas maka tampilan yang anda inginkan untuk arahan tersebut akan muncul di halaman utama blog anda.

b. Penggunaan Tag Kondisional pada Halaman Artikel Postingan

Halaman artikel / halaman postingan atau juga sanggup disebut dengan halaman item ialah halaman pada blog anda yang khusus menampilkan artikel postingan blog anda, untuk blog berflatform blogspot sebuah halaman sanggup digolongkan menjadi halaman item saat halaman tersebut dibentuk memakai sajian Entri.

Pada umumnya untuk blog berflatform blogspot halaman artikel postingan atau halaman item mempunyai format url sebagai berikut:
https://titipteknologi.blogspot.com/search?q=

Untuk mengatur sebuah tampilan (misal: sebuah widget khusus, arahan unit iklan adsense, atau tampilan lainnya) biar tempilan tersebut hanya muncul di halaman artikel saja maka arahan untuk tampilan tersebut harus anda bungkus dengan tag kondisional untuk halaman artikel sebagai berikut:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
      KODE ANDA
</b:if>
KODE ANDA. sanggup anda isi dengan arahan apapun yang anda inginkan, sehingga tampilan untuk arahan tersebut hanya akan muncul di halaman item atau di halaman artikel blog anda saja tidak dihalaman selain artikel.

c. Penggunaan Tag Kondisional pada Halaman Static

 Halaman sanggup dikategorikan sebagai halaman static saat sebuah halaman dibentuk memakai sajian Page/ Laman.

Halaman static biasanya dipakai untuk menciptakan halaman khusus menyerupai halaman about, halaman contact us halaman privacy policy dan halaman serupa lainnya.

Untuk blog berflatform blogspot format URL halaman static ini biasanya mempunyai format:
http://namabloganda.blogspot.com/p/nama_halaman.html

Jika anda menginginkan sebuah tampilan misal: sebuah widget khusus, arahan unit iklan adsense, atau desain tampilan blog lainnya, dan tampilan tersebut hanya ingin tampil atau muncul di halaman static saja tidak dihalaman lainnya, maka anda perlu membungkus arahan perintah tampilan tersebut dengan tag kondisional untuk halaman static, sebagai berikut:
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
     KODE ANDA
</b:if>
KODE ANDA, sanggup diisi dengan arahan tampilan apapun yang anda inginkan, sehingga tampilan untuk arahan tersebut hanya akan muncul di halaman static blog anda saja, tidak di halaman lainnya.

c. Penggunaan Tag Kondisional pada Halaman Error Page (page not found 404)

Halaman error page merupakan halaman khusus yang akan tampil saat url didalam artikel blog anda tidak ditemukan.

Untuk anda yang menginginkan tampilan khusus dimana tampilan tersebut hanya ingin anda munculkan di halaman not found 404 saja, maka anda harus membungkus arahan tampilan tersebut dengan tag kondisional untuk halaman error page, sebagai berikut:
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
     KODE ANDA
</b:if>

Terjemahan arahan diatas:
Jika halaman ialah halaman error page maka proses KODE ANDA.
Silahkan Anda isi bab KODE ANDA dengan arahan tampilan yang anda tampilannya muncul di halaman page not found saja.

d. Penggunaan Tag Kondisional pada Halaman Tertentu

Bagaimana bila saya hanya ingin menampilkan suatu tampilan iklan, widget khusus atau desain tampilan lainnya tapi tampilan tersebut hanya ingin muncul di salah satu halaman tertentu saja, apakah bisa?

Tentu saja bisa.

Ada tag kondisional khusus yang sanggup anda gunakan untuk menampilkan suatu tampilan biar hanya sanggup tampil di suatu halaman tertentu saja yang anda inginkan.

Format tag kondisional yang sanggup anda gunakan ialah sebagai berikut:
 <b:if cond='data:blog.url == &quot;URL HALAMAN&quot;'>
       KODE ANDA
</b:if>
Atau memakai format:
 <b:if cond='data:blog.canonicalUrl == &quot;URL HALAMAN&quot;'>
      KODE ANDA
</b:if>

Terjemahan arahan diatas:
Jika halaman ialah halaman dengan url URL HALAMAN maka proses KODE ANDA.

URL HALAMAN, sanggup anda isi dengan url halaman blog untuk tampilan yang anda inginkan muncul.

Misal, saya ingin memasang sebuah iklan tapi iklan tersebut hanya ingin muncul di halaman about yang mempunyai url https://titipteknologi.blogspot.com/p/about.html, maka arahan tag kondisional yang sanggup dipakai ialah sebagai berikut:
Anda sanggup menentukan salah satu format tag kondisional diatas, contohnya menyerupai dibawah ini:
<b:if cond='data:blog.canonicalUrl == &quot;https://titipteknologi.blogspot.com/p/about.html&quot;'>
      KODE IKLAN
</b:if>
Dengan memasang arahan tag kondisional di atas pada template blog anda, maka arahan iklan akan tampil hanya di halaman about yang mempunyai url https://titipteknologi.blogspot.com/p/about.html.


e. Penggunaan Tag Kondisional Pada Halaman Label

Halaman label biasanya akan muncul atau tampil saat yang diakses ialah label artikel blog yang digunakan, atau saat anda mengakses sajian blog yang memakai pengkategorian sajian dengan label, atau halaman hasil pencarian pada blog.

Halaman ini biasanya mempunyai format URL menyerupai berikut:
https://titipteknologi.blogspot.com/search/label/nama_label
Jika anda ingin menampilkan sesuatu contohnya iklan, widget khusus yang hanya ingin muncul di halaman label saja, maka anda sanggup membungkus arahan anda dengan tag kondisional untuk label sebagai berikut:
<b:if cond='data:blog.searchLabel'>
     KODE ANDA
</b:if>
Terjemahan arahan diatas:
Jika halaman ialah halaman hasil pencarian maka proses KODE ANDA.
 
KODE ANDA, silahkan anda masukan arahan yang anda gunakan untuk menampilkan sesuatu contohnya iklan, widget atau apapun.

f. Penggunaan Tag Kondisional pada halaman Arsip 

Di blogspot juga mengenal halaman arsip, halaman ini akan muncul saat archive blog anda diakses,
format url untuk halaman arsip blog biasanya mempunyai format url, menyerupai dibawah ini:
https://titipteknologi.blogspot.com/2016_01_archive.html
Jika anda menginginkan tampilan di halaman tersebut berbeda dengan tapilan halaman lainnya maka anda harus memasang arahan tampilan dengan tag kondisional untuk halaman archive sebagai berikut:
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
     KODE ANDA
</b:if>
Terjemahan arahan diatas:
Jika halaman ialah halaman arsip maka proses KODE ANDA.

KODE ANDA, Anda sanggup isi dengan arahan yang anda gunakan untuk menampilkan sesuatu, dengan memakai tag kondisional di atas maka tampilan hanya akan muncul di halaman archive saja.

g. Penggunaan Tag Kondisional Di Halaman Mobile

Halaman mobile ialah setiap halaman, baik itu halaman archive, halaman muka (homepage), halaman pencarian, atau page not found 404 atau halaman lainnya namun muncul saat halaman tersebut diakses memakai perangkat mobile.

Anda sanggup memakai tag kondisional untuk kasus-kasus tertentu biar suatu tampilan halaman hanya akan muncul saat diakses memakai perangkat mobile menyerupai smartphone, tablet atau perangkat mobile lainnya.

Format tag kondisional untuk halaman mobile ialah sebagai berikut:
 <b:if cond='data:blog.isMobile'>
        KODE ANDA
</b:if>
Terjemahan arahan diatas:
Jika halaman diakses melalui perangkat mobile maka proses KODE ANDA.

Kode diatas hanya berlaku bila template perangkat mobile blog anda diaktifkan
melalui sajian Template > Klik Gambar roda gigi untuk template seluler, kemudian pilih "Ya tampilkan template seluler di perangkat seluler,

Seperti terlihat pada gambar dibawah ini:

Pernahkan anda menginginkan loading blog anda ingin menjadi lebih ringan atau anda menging Cara Menggunakan Tag Kondisional Untuk Pemula -  (Study Kasus)

# STUDI KASUS BEBERAPA PENGGUNAAN TAG KONDISIONAL

 Berikut beberapa studi masalah untuk memakai tag kondisional di blogspot anda:

Contoh Kasus #1:

Saya ingin menampilkan Widget RecentPost di sidebar tapi hanya tampil di halaman Postingan Saja, sedangkan bila di halalaman Muka (homepage) widget tersebut jangan tampil.

Untuk menuntaskan masalah diatas langkah-langkahnya ialah sebagai berikut:
a. Silahkan buat sebuah widget memakai sajian layout/tata letak pada akun blogspot anda, kemudian klik tombol tambah gadget, pilih widget HTML/Javascript, kasih nama judul pada kotak yang disediakan, kemudian kopikan arahan widget anda dan simpan.

b. Sekarang masuk ke editor template anda.
Pilih sajian template > Edit HTML, lakukan pencarian dengan judul widget yang Anda buat. format arahan widget biasanya menyerupai ini
<b: widget id=......
 silahkan anda tampilkan Titip Teknologi widget tersebut menyerupai ilustrasi dibawah ini:

Pernahkan anda menginginkan loading blog anda ingin menjadi lebih ringan atau anda menging Cara Menggunakan Tag Kondisional Untuk Pemula -  (Study Kasus)
Kurang lebih akan terlihat menyerupai gambar di atas, isi widget yang saya beri kotak biasanya dibungkus dengan <b:includable id='main'> lihat tanda panah, dan di tutup dengan arahan </b:includable>

Sesuai dengan studi masalah biar widget hanya muncul di halaman artikel saja, maka isi widget (lihat yang di beri kotak), harus dibungkus dengan tag kondisional untuk halaman item atau artikel postingan (lihat arahan warna merah dibawah ini)

Silahkan ganti atau modifikasi arahan yang diberi tanda kotak menyerupai terlihat pada gambar diatas, kurang lebih harus terlihat menyerupai arahan diabawh ini:
        <b:if cond='data:blog.pageType == &quot;item&quot;'>
            <!-- only display title if it's non-empty -->
            <b:if cond='data:title != &quot;&quot;'>
                 <h4 class='title'><data:title/></h4>
           </b:if>
           <div class='widget-content'>
           <data:content/>
          </div>     

       </b:if>
Jika diterjemahkan arahan diatas ialah sebagai berikut:
Jika jenis halaman ialah halaman artikel postingan, maka tampilkan widget
Dengan cara di atas maka widget yang bersangkutan hanya akan muncul di halaman artikel postingan saja, anda sanggup juga memodifikasi widget-widget lainnya sesuai dengan yang anda inginkan.

Contoh Kasus #2:

Saya ingin menampilkan deskripsi judul blog berbeda, saat yang dibuka ialah halaman homepage maka deskripsi judul harus sesuai yang saya seting di pengaturan seting blog, sedangkan bila yang dibuka ialah halaman artikel postingan maka deskripsi judul harus judul artikel yang bersangkutan.

Untuk masalah tersebut langkah-langkahnya ialah sebagai berikut:

a. Masuk ke akun blogspot anda

b. Pada bilah sajian sisi kiri pilih sajian template > Edit HTML untuk menampilkan editor HTML

c. Lakukan pencarian Klik Editor HTML 1 kali, kemudian tekan CTRL+F untuk mengaktifkan kemudahan pencarian.
Silahkan lakukan pencarian   <data:description/>
untuk blog saya saya temukan Titip Teknologi html untuk deskripsi kurang lebih menyerupai gambar dibawah ini:

Pernahkan anda menginginkan loading blog anda ingin menjadi lebih ringan atau anda menging Cara Menggunakan Tag Kondisional Untuk Pemula -  (Study Kasus)

Kode diatas akan menciptakan deskripsi judul untuk setiap halaman pada blog selalu sama, biar deskripsi blog antara halaman index (homepage, halaman pencarian atau label) berbeda dengan halaman artikel postingan maka kita harus melibatkan tag kondisional pada arahan diatas.

Agar sesuai dengan masalah diatas, bila yang diakses halaman homepage maka yang keluar ialah deskripsi blog, sedangkan bila diakses halaman artikel postingan maka untuk deskripsi judul kita mengambil judul artikel yang bersangkutan.

Silahkan ganti arahan yang diberi kotak menyerupai terlihat pada gambar diatas dengan arahan dibawah ini:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:blog.pageName/>
<b:else/>
<data:description/>
</b:if>

Kode ditas bila diterjemahkan ialah sebagai berikut:
Jika jenis halaman ialah halaman artikel (...==&quot;item&quot;'), maka tampilkan judul artikel yang bersangkutan untuk deskripsi judul (<data:blog.pageName/>), namun bila bukan (<b:else/>) maka tampilkan deskripsi blog (<data:description/>) untuk deskripsi judul.

PENUTUP

Contoh-contoh di atas hanyalah sebagian kecil dari penggunaan tag kondisional untuk kasus-kasus sederhana, dan hanya memakai operator == (sama dengan) , sanggup juga memakai operator (!= tidak sama dengan) sesuai dengan kondisi-kondisi yang anda inginkan.
 
Ada banyak masalah yang sanggup dipecahkan dengan tag kondisional, pada dasarnya tag ini sangat bermanfaat untuk menampilkan desain halaman atau tampilan bagian-bagian tertentu pada halaman tertentu sehingga kondisinya tidak sama dengan halaman-halaman lainnya, bahkan penggunaan tag kondisional tingkat lanjut sanggup anda gunakan untuk menciptakan halaman blog anda menjadi lebih ringan.

Tag kondisional bergotong-royong hanya sebagian kecil dari perintah arahan template pada blog anda, bila anda memahami secara baik perihal penggunaan tag kondisional sederhana dan tingkat lanjut, maka akan sangat gampang sekali melaksanakan customisasi tampilan halaman blog anda.

Demikian artikel perihal Penggunaan tag kondisional di blogspot untuk pemula semoga bermanfaat untuk anda.

Related Posts

Posting Komentar

Subscribe Our Newsletter