Hai Sobat RahmanCyber.NET , kali ini kita akan membahas tentang Struktur Dasar Blogger.
{getToc} $title={Table of Contents}
Struktur Template Blogger
Ketika mempelajari Struktur sebuah Framework, disini saya anggap seperti itu, karena pada kenyataannya... template blogger itu seperti halnya framework yang sudah disusun strukturnya, sehingga ketika kita ingin mengembangkan template sendiri, perlu memahami struktur tersebut... supaya tidak salah kamar.
Kalo framework yang dikenal di dunia pemprograman seperti Laravel, CodeIgniter, Yii sendiri memang lebih kompleks karena berhubungan dengan database, sedangkan kalo blogger ini anggap aja merupakan versi paling basic lah dan hanya berurusan dengan frontend saja.
Loh bang, kan di Blogger ketika desain template itu kita juga desain halaman admin loh?
Apa itu Front-End
FrontEnd atau Pengembangan web front-end adalah praktik mengubah data ke antarmuka grafis, melalui penggunaan HTML (HyperText Markup Language), CSS (Cascading Style Sheets), dan JavaScript , sehingga pengguna dapat melihat dan berinteraksi dengan data tersebut. Sumber langsung dari Wikipedia (Inggris)
Jadi jelas ini berkaitan dengan User Interface. Dari apa yang saya pelajari di sekolah ( hehe ) Front End itu tujuannya untuk membuat tampilan website maupun aplikasi yang menarik dan user friendly.
Pernah liat Profesi UI UX DESIGNER?
Nah, itu berkaitan dengan front end ini sob.
Apa sih itu UX? UX itu merupakan User Experience gan.. atau pengalaman pengguna.
Kedua itu UI dan UX Designer saling berkaitan dalam mengembangkan front end yang bagus
Tugasnya seperti apa sih bang?
Disini kita gak bahas itu detail ya, karena konsen utama kita kita kali ini adalah memahami struktur template blogger, kalo kalian penasaran dengan UI UX, silahkan cari di LOWONGAN KERJA UI dan UX, disitu nanti kemungkinan akan ada paparan JOB DES UI dan UX nya.
"Semakin besar perusahaannya, biasanya nanti bakalan lebih spesifik lagi, sehingga pekerja bisa lebih fokus dan riset secara mendetail dan professional karena fokusnya sudah jelas"
Sssst, gaji UI UX Designer itu juga gede loh.. dari info yang saya dapatkan ketika liat liat di situs pencari kerja, bisa kisaran 6 - 14 juta per bulan ( jika apply di perusahaan bonafide )
https://www.jobstreet.co.id/id/job-search/ui-ux-web-designer-jobs/
Coba deh liat sendiri!
Sedangkan Apa itu Back-End?
Kalau back end setahu saya adalah Bagian belakang layar.. enggak keliatan.. hehe. Biasanya bahasa pemprograman yang di kuasai seperti PHP, Ruby, Phyton yang berhubungan langsung ke server.
Lah bang kalo saya sih bisa Front-End ( CSS, HTML, Javascript ) dan Back-End ( PHP )...
Berarti itu kamu namanya Full Stack!
Kamu bisa Front-End dan Back-End, Karena Full Stack sendiri adalah sebutan bagi mereka yang menguasai Front-End dan Back End.. seperti pada kasusmu.
Wah kenapa jadi melebar ke Front End, Back End dan Full Stack!!!
Balik lagi ke Struktur Template Blog!!!!
Halaman Blogger sendiri memiliki Struktur yang mirip mirip dokumen HTML pada umumnya, yaitu Header, Bagian Posting, dan Footer..
Sedangkan untuk struktur Templatenya, jauh lebih kompleks lagi,,
Sebenarnya dari melihat sekilas saja, jika kita sudah terbiasa nguprek template blog, merubah tampilan... mungkin sobat pada paham ya.. tapi supaya lebih lengkap.. kita jelaskan satu persatu...
Penjelasan Bagian dari infografis struktur template tersebut :
Body
Kalo didalam pemprograman template, ketika kalian menuju bagian edit html, kalian bakalan menemui pola <html><head></head><body></body></html> sebenarnya body ini merupakan badan halaman ( mencangkup tampilan header, title, isi postingan, komentar, sidebar, footer dan berbagai widget (pada dasarnya merupakan seluruh layar dari komputer = body).
Outer-wrapper
Kalo outer wrapper ini merupakan bagian yang melingkupi template (bagian dari batas luar template). Secara umum,wrapper digunakan untuk menempatkan blok-blok yang lebih kecil yang ada didalamnya. Blok yang paling umum didalam Outer-wrapper adalah Header,Content, dan Footer.
Header
blok ini adalah bagian paling atas. Didalam Header dapat juga memiliki sub-blok, misalnya: Header Judul, Deskripsi blog, dan lain-lain seperti banner Google Adsense, menu bar, dll. Diluar header atau untuk membungkus semua sub-blok didalam header biasanya dinamakan Header-wrapper.
Content
Letaknya dibawah Header biasanya memiliki penamaan Content-wrapper- Pada dasarnya ini merupakan bagian dari blok yang paling penting. Secara umum bagian wrapper ini didalamnya terdiri dari blok Sidebar (bisa 1,2 atau lebih sidebar... biasanya sih rata rata maksimal 3, karena jika lebih dari itu maka bagian main nya pun semakin kecil) dan blok Main (yang berisi hasil posting artikel, blok komentar, atau beberapa ruang ads/iklan).
Main
Biasanya ditulis Main-wrapper merupakan bagian luar dari blok Main yang didalamnya terdapat Content-wrapper. Didalam Content-wrapper terdapat blok Post, blok Comment, Date Header, dan bagian lain yang dapat dibuat dari opsi Menambah Page Element. Pada bagian main ini juga kita bisa selipi widget lainnya
Blog Post
Bagian blok ini berisi fungsi yang paling penting, seperti Posts Titles (judul artikel), Post(artikel), Post Author (Penulis artikel),
Sidebar
Ini merupakan bagian yang dapat berisi semua widget samping, seperti: About Me, Labels, Archive, Text, HTML, Adsense, tetapi tidak menutup kemungkinan juga bisa berisi 1 widget saja. Di dalam standard template dari Blogger, biasanya ditemukan 1 sidebar, jika terdapat 1 sidebar maka template terdiri dari 2 kolom, yaitu Main dan Sidebar. Tetapi jumlah sidebar dapat ditambahkan dengan mudah. Yang paling umum seperti contoh gambar infografis yang dibuat oleh R4CProject adalah memiliki 2 sidebar atau berarti template memiliki 3 kolom.
Footer
Kalau footer ini merupakan bagian bawah dari template. Seperti halnya blok elemen yang ada di Header, dibutuhkan juga Footer-wrapper yang berisi bagian-bagian dari footer.
Hierarki Template Blogger
Masih belum paham? berikut ini Struktur dari template blogger, jika dilihat secara hierarki, dapat ditampilkan sebagai berikut ( Hierarki ini dimulai dari Tag Body ya setelah tag penutup Head kalo di Edit HTML.. )
Semoga udah dapet gambarannya ya...
Sebenarnya dengan memahami struktur dasar template blogger ini, kita akan menjadi lebih mudah dalam melakukan desain template maupun melakukan pengeditan terhadap template tampilan blog kalian saat ini sesuai keinginan sobat, karena sudah memahami pos posnya atau letaknya, jadi lebih mudah untuk melakukan improvisasi.
Terlebih kita menjadi belajar membuat rangkaian kode yang terstruktur dan terorganisir.
Silahkan saya dikoreksi jika ada yang salah dalam pemahaman...
Sebenarnya saya pernah membahas tentang cara membuat Template Blogger dari dasar dan basic
Jadi disitu bisa sobat jadikan referensi sebagai dasar membuat template blogger dari nol.
Dan pada halaman ini, saya mencoba menjelaskannya secara lebih runtut... dan agar mudah dipahami..
F.N.A-RED
pas banget gi butuh nih artikel buat kustom web ane kak... nuhun 🙏🏻
BalasHapus