tRikSonic
Informasi : saat ini anda mengakses blog ini untuk halaman yang di percepat penggunaannya untuk mobile/handphone (AMP) atau akses mobile dengan kecepatan internet yang rendah, mungkin beberapa fitur diblog ini belum tersedia, silahkan ganti Thema untuk mengaktifkan beberapa fitur lainnya. Terimakasih

b:section - Blogger Tutorial

Terakhir diperbarui : 25 Juli 2019 - 01.46

Penjelasan

Tag Blogger <b:section> adalah Tag yang digunakan untuk membentuk elemen tata letak dimana nantinya dapat diisi oleh gadget atau widget.

Syntax

<b:section id='...' showaddelement='...'>
  ...
</b:section>
  • Penulisan dilakukan didalam rentang tag <body>...</body>
  • Penulisan tidak bisa dilakukan secara bersarang
  • Dari keseluruhan template/tema xml, wajib memiliki minimal 1 tag <b:section>

Atribut

Berikut atribut xml yang dapat digunakan pada tag <b:section> beserta penjelasannya :
class Awalan expr :
Tidak bisa diterapkan
digunakan untuk menambahkan nama kelas.

Nilai atribut ini adalah teks atau angka + section
Keterangan : relative, bisa ditulis ataupun tidak
cond Awalan expr :
Bisa diterapkan
Digunakan untuk menentukan suatu kondisi apa yang akan diterapkan pada <b:section>

Nilai atribut ini adalah kondisi
Keterangan : relative, bisa ditulis ataupun tidak
id Awalan expr :
Tidak bisa diterapkan
Digunakan untuk menentukan suatu identitas atau tanda pengenal pada <b:section>

Nilai atribut ini adalah teks atau angka
Keterangan : wajib ada
maxwidgets Awalan expr :
Tidak bisa diterapkan
Digunakan untuk menentukan jumlah maksimal gadget atau widget (<b:widget>) yang ada didalam tag <b:section>.

Nilai atribut ini adalah angka
Keterangan : relative, bisa ditulis ataupun tidak
name Awalan expr :
bisa diterapkan
Digunakan untuk memberikan nama pada <b:widget>. Atribut ini nantinya akan tampil pada tata letak, dengan tampilan teks tebal. Dapat dilihat pada gambar dibawah ini :
Nilai atribut ini adalah : teks

Jika atribut ini tidak ditulis maka atribut id akan mengantikan tugasnya.
Keterangan : relative, bisa ditulis ataupun tidak
preferred Awalan expr :
Tidak bisa diterapkan
Digunakan untuk menentukan apakah <b:section> yang ditulis merupakan bagian yang diutamakan pada blog atau tidak.

Nilai atribut ini adalah yes atau no
Keterangan : relative, bisa ditulis ataupun tidak
showaddelement Awalan expr :
Tidak bisa diterapkan
Digunakan untuk menentukan apakah <b:section> yang ditulis nantinya apakah bisa ditambahakan sebuah gadget/widget

Nilai attribut ini adalah (yes/true) atau (no/false)
Keterangan : relative, bisa ditulis ataupun tidak

Render HTML

Pada render html tag <b:section> akan menjadi <div>
Nilai section akan otomatis diberikan pada atribut class disertai nama kelas tambahan jika diberikan

Contoh :

<b:section id='sidebar' showaddelement='yes'>

</b:section>

Hasil render html

<div class='section' id='sidebar'>
 ...
</div>

Contoh :

<b:section class='sidebar' name='Sidebar Area' id='sidebar' showaddelement='yes'>
  ...
</b:section>

Hasil render html

<div class='sidebar section' name='Sidebar Area' id='sidebar'>
  ...
</div>

Contoh Penerapan

<b:section class='posting-area' id='posting-area-section' showaddelement='yes'>
  <b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog' version='2' visible='true'>
    ...
  </b:widget>
</b:section>
Selamat berkreasi dan semoga bermanfaat

Informasi :

Artikel ini merupakan panduan tidak resmi tentang xml blogger template.
Untuk mendapatkan informasi yang lebih tepat, sangat disarankan mencarinya pada tautan dibawah ini :

  1. Blog Blogger
  2. Pusat Bantuan Blogger
  3. Forum Bantuan Blogger
  4. Forum Bantuan Google
  5. Stack Overflow

22 komentar

Ismoyo10/23/2018Balas Komentar ini
jangan lupa mampir om http://lenglish-room.ind2906.online
Adi Jaya11/21/2018
Situs tidak dapat dijangkau.
Dista11/23/2018Balas Komentar ini
Cara memasang <b:section> di dalam tag <head> bagaimana ya pak?
Terimakasih ^_^
Adi Jaya11/24/2018
pakai <b:tag name='head'>...</b:tag>
Jika gak bisa disimpan pakai ini
&lt;!-- <head/> --&gt;
<b:tag name='head'>...</b:tag>

Adi Jaya11/24/2018
visit ==> b:tag
Dista11/24/2018
Saya ingin mengambil data widget "Blog" supaya bisa dipasang di tag head seperti blog ini. Gimana ya Pak, hhe
Dista11/24/2018
Apa harus menggunakan template layout v3 Pak?
Adi Jaya11/24/2018
<html>
<b:tag name="">
<title>...</title>
<b:comment> jika halaman post dan statis <b:comment>
<b:if cond='data:view.isPost or data:view.isPage'>
<b:section class='hide' id='posting-meta' maxwidgets='1' preferred='no' showaddelement='no'>
<b:widget id='Blog2' locked='true' title='Posting Blog' type='Blog' version='2' visible='true'>
<b:widget-settings>...</b:widget-settings>
<b:includable id='main' var='this'>...</b:includable>
<!-- kosongkan kode b:includable default -->
<b:includable id='addComments'/>
<b:includable id='commentAuthorAvatar'/>
<!-- kode lainnya -->

Adi Jaya11/24/2018


<!-- add data yang mau dibuat dan kirim ke b:includable id='main' -->
<b:includable id='nextprev-meta'>
kode kamu
</b:includable>
</b:widget>
</b:section>
</b:if>

</b:tag>



<body>

</body>
<html>
Adi Jaya11/24/2018
Untuk <b:tag>...</b:tag> berlaku untuk v2 dan v3. Layout berpengaruh pada isi data yang dirender, salah satunya nantinya tag <b:widget>..</b:widget>
lutfiyah1/28/2019
Saya tidak pakai fitur apakun, bisa cek teks disini. Ketika saya lihat konstruksi Triksonic, tidak ada tautan https://www.blogger.com/dyn-css/authorization.css. Apakah tersebut akibat AMP? Atau remove pakai js, Mas? Di tema yang saya coba buat, saya pakai:

&lt;!-- --&gt;

CSS Blogger masih dirender, meski menjadi komentar.

Pakai b:tag juga sama, dirender, bukan menjadi komentar, tetapi menjadi aktif seperti halnya ketika tanpa memakai b:tag

<b:tag name='head'>...</b:tag>

Sama dengan ketika:

<head> .... </head>
Dista11/25/2018Balas Komentar ini
Terimakasih banyak Pak.. 🙏🙏
Adi Jaya11/25/2018
Sama sama mas
Senang bisa membantu
lutfiyah1/20/2019Balas Komentar ini
Mas, caranya menyembunyikan tag noscript css Blogger gimana ya?

<link href='https://www.blogger.com/dyn-css/authorization.css?targetBlogID=453444426567687934534626&amp;zx=290392dfd17-3007-425a-96f7-b8c0a6832e3a' media='none' onload='if(media!=&#39;all&#39;)media=&#39;all&#39;' rel='stylesheet'/><noscript><link href='https://www.blogger.com/dyn-css/authorization.css?targetBlogID=453444426567687934534626&amp;zx=290fef39217-3007-425a-96f7-b8c0a6832e3a' rel='stylesheet'/></noscript>
Adi Jaya1/20/2019
Coba tambahkan attribute amp di tag html

<html amp='amp' .....>

atau

backup tema kamu, terus ganti ke tema default blogger (sesuaikan versi layout [rekom versi 3 jika tema kamu versi 3]), simpan, reload.

terus kembalikan kode tema yang sudah di backup tadi dengan cara copy paste, jangan menggunakan upload.

jika masih gak mau, komentar aja lagi disini.
lutfiyah1/21/2019Balas Komentar ini
Saya coba pakai template versi 3. CSS dan JS saya matikan semua. Problemnya,jika blog tanpa postingan, css authorization tidak ada. Tapi, jika blog ada postingan minimal satu, css authorization masih keluar. Jika pakai &lt;head&gt;, css authorization otomatis jadi komentar HTML. Jika pakai <b:tag name='head'>, css authorization masih aktif sama halnya ketika menggunakan tag <head> normal.
Adi Jaya1/21/2019
Mungkin beberapa faktor yang mempengaruhi

1. widget gplus, widget conter aktif
2. beberapa pengaturan di widget type blog, misal reaksi.
3. profil author menggunakan blogger.
4. [...]

ini hanya mungkin.
Tessah Mentari4/09/2019Balas Komentar ini
mas untuk ubah tag img otomatis untuk amp gimana ?
kaya blog ini kalo di buka menggunakan amp tag img nya berubah sendiri jadi amp-img ?
Triksao8/23/2019
masih tunggu jawaban
rambo madin3/26/2022Balas Komentar ini
izin bertanya,
saya sekarang lagi coba mengedit tema contempo (bawaan dari blogger),

nah, saya ingin menghapus bagian sidebarnya,

setelah saya coba dan menghapus element :


tiba-tiba semua bagian postingan jadi hilang, kira-kira itu kenapa ya ??

terima kasih.
Adi Jaya3/27/2022
Coba dicek lagi bagian
<b:widget id='...' type='Blog'>
...
</b:widget>


Mungkin ada yang bagian yang terhapus.

Biasanya bagian Sidebar dengan postingan berbeda widget.

Atau mungkin hanya terhidden oleh CSS saja.. coba inspect element
Arya Kusuma Liadi5/27/2024Balas Komentar ini
Sangat bermanfaat
Add New Comment