Lompat ke konten Lompat ke sidebar Lompat ke footer

B:Attr - Blogger Tutorial

Penjelasan

<b:attr> dipakai untuk menciptakan atau memperbaharui sebuah attribut html yang berlaku untuk tag induk.

Attribut

  • cond
  • name
  • value

Attribut cond

Digunakan kalau suatu konsisi diperlukan.
Nilai : kondisi
Keterangan : relative, dapat disebutkan ataupun tidak

Attribut name

Digunakan untuk menuliskan nama attribut yang ingin disematkan.
Nilai : nama_attribut. Misal : class, id, data-*, href, dll.
Keterangan : wajib disebutkan, awalan expr: dapat diberlakukan.

Attribut value

Digunakan untuk menuliskan nilai dari attribut yang disematkan.
Nilai : nilai
Keterangan : wajib disebutkan, awalan expr: dapat diberlakukan.

syntax

<b:attr name='....' value='...'/>
<b:attr cond='...' name='....' value='...'/>
<b:attr cond='...' expr:name='....' expr:value='...'/>

Kumpulan teladan <b:attr>

Menambahkan class

<div>   <b:attr name='class' value='container'/> </div>
Hasil yang diharapkan
<div class='container'>  </div>

Menambahkan id

<div>   <b:attr name='id' value='container'/> </div>
Hasil yang diharapkan
<div id='container'>  </div>

Menambahkan banyak attribut

<div>   <b:attr name='class' value='container'/>   <b:attr name='data-this' value='article'/>   <b:attr name='id' value='wrapper'/> </div>
Hasil yang diharapkan
<div class="container" data-this="article" id="wrapper">  </div>

Menambahkan attribut menurut Kondisi

<article class='article'>    <b:attr cond='data:view.isHomepage' name='id' value='article-home'/>    <b:attr cond='data:view.isPost' name='id' value='article-post'/>    <b:attr cond='data:view.isPage' name='id' value='article-page'/>    <b:attr cond='data:view.isSearch' name='id' value='article-search'/> </article>
Hasil yang diharapkan kalau di halaman Home
<article class='article' id='article-home'>  </article>
Hasil yang diharapkan kalau di halaman post
<article class='article' id='article-post'>  </article>
Hasil yang diharapkan kalau di halaman Page statis
<article class='article' id='article-page'>  </article>
Hasil yang diharapkan kalau di halaman pencarian
<article class='article' id='article-search'>  </article>
Hasil yang diharapkan kalau tidak di halaman Home, post, page dan pencarian
<article class='article'>  </article>

Menggunakan awalan expr:

<a>    <b:attr name='href' expr:value='data:view.url'/>    <b:attr name='target' value='_blank'/>    <b:attr name='title' expr:value='data:view.title'/>    Text Link </a>
Contoh Hasil
<a href="https://parasitonlen.blogspot.com" target="_blank" title="Triksonic">    Text Link </a>
Bagaimana kalau dipakai untuk Tag HTML yang tidak memiliki Tag penutup, ibarat <img>, <input>, <link>, <meta> dll.

Untuk mengatasinya, gunakan <b:tag> dalam menciptakan Tag HTML, selengkapnya mengenai <b:tag>

Contoh :

<b:tag name='input'>   <b:attr name='placeholder' value='Insert Text'/> </b:tag>
Hasil
<input placeholder="Insert Text">
Selamat berkreasi.