Tutorial Dasar 3 Section Sidebar

Selamat pagi dan apa kabar, brother? Saya harap kamu tetap dalam keadaan sehat. Artikel kali ini saya akan memberitahu kalian seputar section. Berbaring di sofa temukan posisi yang paling nyaman untuk bersantai, ambil segelas kopi, dan mainkan musik. Lalu let's Go! Ayo kita belajar!

Section di blogger

Kalau diibaratkan sebagai jajanan, section itu bungkusannya sedangkan widget adalah isinya. Kalau saya punya sebungkus chitato, maka bungkusannya itu section sedangkan isi dari chitato itu adalah widget. Gimana? udah paham belum? >.<

Kan sebelumnya kamu sudah pernah membuat section untuk post artikel mu, kan? nah apa kamu sudah menyadarinya kalau di dalam section yang tadi di tutorial sebelumnya ada widgetnya. Nah, widget yang berfungsi untuk menampilkan sebuah postingan. Di dalam widget itu ada banyak sekali code - code yang dimana fungsi utamanya adalah untuk menampilkan data post mu seperti gambar, label, content, dan lain - lain.

Coba deh, kamu ke tata letak bloggermu. Kamu pasti sudah bisa melihat ada section yang bernama main dengan widget yang bernama Blog Post. Disitu kau bisa mengatur, postinganmu seperti apa nantinya. Mau nampilan data tanggal ketika posting? bisa, gk usah ditampilin deh? juga bisa.

Nah, basic nya section itu hanya ada 4 yaitu Header, Blog, Sidebar, dan Footer. Kalau kamu udah pernah belajar HTML. Kamu pasti sudah tahu apa artinya, kan?

Baiklah, mari kita mencoba membuat sidebar.

Copy code ini lalu paste di atas sectionnya blog posts.


<b:section class='sidebar' id='sidebar' preferred='yes' showaddelement='yes'></b:section>

Ingat, tempelin itu di atasnya blog posts. Biar kamu bisa tahu langsung perbedaannya.


<b:section class='main' id='main' showaddelement='no'>

Maksudku paste di atas section itu sectionnya blog post.

Coba simpan template nya dan coba lihat web mu.

"Nothing?"

Tunggu sebentar, itu karena kamu belum menambahkan isi di section itu oleh karena itu tidak ada kelihatan isinya. Coba deh kamu ke tata letak dan klik Add a Gadget di sectionnya Sidebar. Pilih HTML dan lalu coba ketikan ini.


<p>Hai! Ini sidebar!</p>

Simpan dan coba lihat kembali website mu.

Hola!! sidebarmu sudah muncul.

Hmm ... kau hebat. Sekarang hanya tersisa 2 section saja sekarang yang harus kamu ketahui. Untuk kedua section nya kau bisa explore sendiri.

Section Header


<b:section class='header' id='header' maxwidgets='1' showaddelement='yes'>
 <b:widget id='Header1' locked='true' title='' type='Header'/>
 </b:section>

Section Footer


<b:section class='sidebar' id='sidebar' preferred='yes' showaddelement='yes'>
</b:section>

Tunggu sebentar, section footer kok hampir sama dengan sidebar? yah emang sama, tapi kalau diletakkan paling bawah sendiri itu udah dibilang Footer. >.< Silahkan di coba dan explor diri kalian lagi dan lagi.

Saya sudahi dulu tutorial kali ini. Jika ada pertanyaan silahkan sampaikan unek - unekmu di komentar. Kalau ada kata - kata yang menyinggung perasaanmu aku minta maaf. Aku tidak memiliki niat sekalipun untuk mentinggungmu.

Terima kasih dan sampai jumpa lagi.

Semangat belajar! Have fun day! Ganbantte Minna!!