tRikSonic
Tema

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.
b:section - Blogger Tutorial

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 :
b:section Attribut Name
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

Ismoyo
Ismoyo10/23/2018ReplyBalas Komentar ini
jangan lupa mampir om http://lenglish-room.ind2906.online
Adi Jaya
Adi Jaya11/21/2018
Situs tidak dapat dijangkau.
Dista
Dista11/23/2018ReplyBalas Komentar ini
Cara memasang <b:section> di dalam tag <head> bagaimana ya pak?
Terimakasih ^_^
Adi Jaya
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 Jaya
Adi Jaya11/24/2018
visit ==> b:tag
Dista
Dista11/24/2018
Saya ingin mengambil data widget "Blog" supaya bisa dipasang di tag head seperti blog ini. Gimana ya Pak, hhe
Dista
Dista11/24/2018
Apa harus menggunakan template layout v3 Pak?
Adi Jaya
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 Jaya
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 Jaya
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>
lutfiyah
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>
Dista
Dista11/25/2018ReplyBalas Komentar ini
Terimakasih banyak Pak.. 🙏🙏
Adi Jaya
Adi Jaya11/25/2018
Sama sama mas
Senang bisa membantu
lutfiyah
lutfiyah1/20/2019ReplyBalas 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 Jaya
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.
lutfiyah
lutfiyah1/21/2019ReplyBalas 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 Jaya
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 Mentari
Tessah Mentari4/09/2019ReplyBalas 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 ?
Triksao
Triksao8/23/2019
masih tunggu jawaban
rambo madin
rambo madin3/26/2022ReplyBalas 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 Jaya
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 Liadi
Arya Kusuma Liadi5/27/2024ReplyBalas Komentar ini
Sangat bermanfaat
Comment Form

Posting Komentar

  1. Untuk menyisipkan sebuah link atau tautan gunakan <i rel="link=//example.com">teks disini</i>
    • Tanpa menggunakan https: dan http:
  2. Untuk menyisipkan sebuah kode yang pendek gunakan <i rel="code">kode disini</i>
  3. Untuk menyisipkan sebuah kode yang panjang gunakan <i rel="pre">kode disini</i>
  4. Untuk menyisipkan sebuah teks Tebal gunakan <strong>teks tebal disini</strong>
  5. Untuk menyisipkan sebuah teks Miring gunakan <em>teks miring disini</em>
  6. Untuk menyisipkan sebuah gambar gunakan <i rel="image">url gambar disini</i>

Ketentuan Komentar

  • Pengguna yang dapat berkomentar adalah pengguna yang memiliki akun google
  • Guna mengurangi komentar yang bersifat spam, maka akan diberlakukan langkah verifikasi kata.
  • Pengguna bertanggung jawab atas komentar yang dikirim
  • Admin dan penulis blog mempunyai hak untuk menampilkan, menghapus, menandai spam, pada komentar yang dikirim
  • Dengan mengirimkan sebuah komentar, maka pengguna dianggap menyetujui semua ketentuan diatas

Poin ketentuan diatas tidak bersifat tetap, dan dapat berubah kapan saja

Konversi Kode
Kode yang ingin dikonversi

Loading.....
X
Run
Klik tombol Run, untuk menampilkan hasil editing, atau menyegarkan editor.