Cara Membuat Tampilan Postingan Berbeda-beda di Blogger

Cara Membuat Tampilan Postingan Berbeda-beda di Blogger
Umumnya setiap tampilan atau style pada halaman postingan blogger yaitu sama. Baik dari bentuk, warna, ukuran, dan elemen-elemen lainnya.

Bagi yang sudah sering mengotak-atik template blogger mungkin pernah menemukan atau mendengar yang namanya tag kondisional.
Umumnya tag kondisional ini digunakan untuk membuat style yang berbeda-beda pada setiap halaman. Biasanya digunakan pada halaman home page, postingan, dan laman.



Tag kondisional halaman home page, postingan, dan laman mungkin sudah sangat umum. Bisa dikatakan juga penulisan kode disetiap template juga sama. Jadi penggunaannya pun tidak terlalu sulit menurut saya.



Pertanyaannya bagaimana membuat style yang berbeda dalam satu jenis halaman yg sama?

Awalnya saya juga sempat kebingungan cari sana-sini dan mencoba menggunakan tag kondisional data:view.postId namun ternyata gagal juga.

Setelah beberapa kali riset dan explorasi akhirnya saya menemukan solusinya. Walaupun bisa dibilang lumayan ribet sih..

Tag Kondisional Halaman Tertentu

Untuk membuat style atau tampilan postingan berbeda-beda di blogger saya menggabungkan atribut kondisional dengan data url blogger.

Kurang lebih bentuk umum atribut conditional beserta ekpresinya seperti ini

cond='data:view.url == url_postingan_atau_laman'
Untuk url lebih dari satu menjadi seperti ini

cond='data:view.url in ["url","url","url"]'
Langkah selanjutnya teman-teman bisa menambahkan tag di depan atribut tersebut, biasanya yang sering kita pakai adalah b:if atau b:class. Silahkan sesuaikan dengan keperluan sobat.

Berikut contoh tag kondisional halaman postingan tertentu menggunakan tag b:if
1 halaman saja

<b:if cond='data:view.url == &quot;https://rebozasambirejo.blogspot.com/2021/04/membuat-template-blog-sendiri.html&quot'>
kode
</b:if>
&quot sama dengan tanda petik (")

Banyak Halaman

<b:if cond='data:view.url in [&quot;https://rebozasambirejo.blogspot.com/2021/04/membuat-template-blog-sendiri.html&quot;,&quot;https://rebozasambirejo.blogspot.com/2021/04/css-dasar-template-blogger.html&quot;,&quot;https://rebozasambirejo.blogspot.com/2021/05/cara-termudah-mengganti-font-blogger.html&quot;,&quot;https://rebozasambirejo.blogspot.com/2021/05/mendesain-header-blogger.html&quot;]'>
kode
</b:if>
Untuk contoh atau hasil implementasi dari tag kondisional halaman postingan tertentu, teman-teman bisa bandingkan tampilan halaman ini dengan halaman postingan berikut
https://rebozasambirejo.blogspot.com/2021/04/membuat-template-blog-sendiri.html

Jika masih kesulitan atau jika ada request seputar tutorial blog bisa isi komentar dibawah.

2 comments

  1. Easy SEO Solutions
    This comment has been removed by a blog administrator.
  2. Anonymous
    This comment has been removed by a blog administrator.
Post a Comment