Cara Memanggil Data XML Blogger

Ada beberapa metode untuk memanggil data XML Blogger sehingga data tersebut dapat ditampilkan ke dalam HTML.

Sebagai Nilai Atribut

Tambahkan namespace expr: pada setiap atribut yang ingin Anda gunakan sebagai kontainer untuk menampilkan data sebagai nilai atribut dengan nama setelah expr::

<a expr:href='data:blog.url'/>
<a expr:href='data:blog.url + "#hash"'/>

<a href='data:blog.url'/>
<a href='data:blog.url + "#hash"'/>

Hasil:

<a href='http://example.com'></a>
<a href='http://example.com#hash'></a>

<a href='data:blog.url'></a>
<a href='data:blog.url + "#hash"'></a>

Sebagai Teks

Tampilkan data apa adanya dengan cara menuliskannya sebagai tag XML biasa:

<data:blog.url/>
<data:blog.url/>#hash

<b:eval expr='data:blog.url + "#hash"'/>

Hasil:

http://example.com
http://example.com#hash

http://example.com#hash

Menggunakan `var` dan `data`

Sebelumnya: Tag <b:include> dan <b:includable> →

Atribut var dan data sangat umum dijumpai pada elemen <b:include> dan <b:includable>, dan berfungsi sebagai jalan untuk memanggil data dari luar. Hal ini sama dengan argumen dalam sebuah fungsi. Pada elemen <b:includable> dapat dituliskan sebagai berikut. Di sini, page masih bersifat abstrak dan tidak memiliki makna apa-apa:

<b:includable id='article' var='page'>
  <h3><data:page.title/></h3>
  <div><data:page.content/></div>
</b:includable>

Kemudian, saat memanggil dengan <b:include>, kita perlu menambahkan properti pada argumen tersebut (dalam hal ini adalah properti title dan content):

<article>
  <b:include name='article' data='{
    title: "Page Title",
    content: "Page content."
  }'/>
</article>

Nilai tidak harus berupa data statis, Anda juga bisa menyebutkan beberapa properti standar dari Blogger:

<article>
  <b:include name='article' data='{
    title: data:blog.title,
    content: data:blog.metaDescription
  }'/>
</article>

<b:includable id='article' var='this'>
  <h3><data:this.title/></h3>
  <div><data:this.metaDescription/></div>
</b:includable>

<article>
  <b:include name='article' data='blog'/>
</article>

Tag Kondisional Halaman Blogger 2017

Blogger memperkenalkan beberapa tag kondisional halaman baru yang semua propertinya bersarang pada grup view. Di sini Saya tidak akan menjelaskannya secara panjang lebar karena tag kondisional ini sebenarnya sangat mudah untuk dipahami.

Tag Kondisional Halaman Muka

Versi Baru

<b:if cond='data:view.isHomepage'> … </b:if>

Versi Lama

<b:if cond='data:blog.url == data:blog.homepageUrl'> … </b:if>

Tag Kondisional Halaman Indeks

Versi Baru

<b:if cond='data:view.isMultipleItems and !data:view.isArchive'> … </b:if>

Versi Lama

<b:if cond='data:blog.pageType == "index"'> … </b:if>

Tag Kondisional Halaman Item

Versi Baru

<b:if cond='data:view.isSingleItem'> … </b:if>

Versi Lama

<b:if cond='data:blog.pageType in ["item", "static_page"]'> … </b:if>

Tag Kondisional Halaman Posting

Versi Baru

<b:if cond='data:view.isPost'> … </b:if>

Versi Lama

<b:if cond='data:blog.pageType == "item"'> … </b:if>

Tag Kondisional Halaman Statis

Versi Baru

<b:if cond='data:view.isPage'> … </b:if>

Versi Lama

<b:if cond='data:blog.pageType == "static_page"'> … </b:if>

Tag Kondisional Halaman Label

Versi Baru

<b:if cond='data:view.isLabelSearch'> … </b:if>

Versi Lama

<b:if cond='data:blog.searchLabel'> … </b:if>

Tag Kondisional Halaman Arsip

Versi Baru

<b:if cond='data:view.isArchive'> … </b:if>

Versi Lama

<b:if cond='data:blog.pageType == "archive"'> … </b:if>

Tag Kondisional Halaman Pencarian

Versi Baru

<!-- Termasuk halaman pencarian label -->
<b:if cond='data:view.isSearch'> … </b:if>

<!-- Hanya halaman pencarian -->
<b:if cond='data:view.isSearch and !data:view.isLabelSearch'> … </b:if>

Versi Lama

<b:if cond='data:blog.searchQuery'> … </b:if>

Tag Kondisional Halaman Kesalahan

Versi Baru

<b:if cond='data:view.isError'> … </b:if>

Versi Lama

<b:if cond='data:blog.pageType == "error_page"'> … </b:if>

Tag Kondisional Halaman Pratinjau

Versi Baru

<b:if cond='data:view.isPreview'> … </b:if>

Versi Lama

---

Terkait

• Tag Kondisional Halaman Label dan Pencarian
• Tag Kondisional Tingkat Lanjut

---

Lain-Lain

• data:view.url → data:blog.url
• data:view.search.query → data:blog.searchQuery
• data:view.isLayoutMode → ?

Tulis masukan dan saran di bawah! ↓↓↓

Menggunakan `b:tag` dan `b:attr`

b:tag

Tag <b:tag> digunakan untuk membuat tag HTML dengan nama tag yang dapat ditentukan berdasarkan kondisi tertentu. Secara default dapat dinyatakan sebagai berikut:

<b:tag name='span'>
  foo
</b:tag>

Hasil:

<span>
  foo
</span>

Menggunakan ternary operator, kita bisa membuat nama tag berdasarkan kondisi tertentu:

<b:tag expr:name='data:view.isSingleItem ? "span" : "a"'>
  foo
</b:tag>

Hasil ketika berada di halaman indeks:

<a>
  foo
</a>

Hasil ketika berada di halaman item:

<span>
  foo
</span>

Versi Lama

<b:if cond=' … '>
  <a>
    foo
  </a>
<b:else/>
  <span>
    foo
  </span>
</b:if>

b:attr

Tag <b:attr> digunakan untuk membuat atribut HTML yang akan ditambahkan kepada tag induknya hanya ketika memenuhi kondisi tertentu. Secara default dapat dinyatakan sebagai berikut:

<div>
  <b:attr cond='data:view.isHomepage' name='id' value='home'/>
</div>

Hasil ketika berada di halaman muka:

<div id='home'></div>

Hasil ketika berada di selain halaman muka:

<div></div>

Untuk atribut class, Blogger sudah memiliki API yang sesuai yaitu b:class. Kedua sintaks di bawah ini adalah identik:

<b:attr cond=' … ' name='class' value='home'/>

<b:class cond=' … ' name='home'/>

Versi Lama

&lt;div<b:if cond=' … '> class='home'</b:if>&gt;
  foo
&lt;/div&gt;

---

Tip

Kombinasi <b:tag> dan <b:attr> dapat meringkas beberapa markup HTML yang dulu perlu dituliskan berulang kali karena kita hanya bisa mengandalkan tag <b:if>:

Sebelum

<h3 class='post-title'>
  <b:if cond='data:blog.pageType === "item"'>
    <span>
      <data:post.title/>
    </span>
  <b:else/>
    <b:if cond='data:post.link'>
      <a expr:href='data:post.link' target='_blank'>
        <data:post.title/>
      </a>
    <b:else/>
      <a expr:href='data:post.url'>
        <data:post.title/>
      </a>
    </b:if>
  </b:if>
</h3>

Sesudah

<h3 class='post-title'>
  <b:tag expr:name='data:view.isSingleItem ? "span" : "a"'>
    <b:attr cond='data:view.isMultipleItems' name='href' value='data:post.link ?: data:post.url'/>
    <b:attr cond='data:view.isMultipleItems and data:post.link' name='target' value='_blank'/>
    <data:post.title/>
  </b:tag>
</h3>