UI blogger dibuat dengan mengunakan dokumen XML ( hanya satu file ). File dokumen ini berisi semua struktur dari website termasuk didalamnya style untuk Widget dari setiap section dari blog. Dengan semua konten website dalam satu dokumen, struktur organisasi kode adalah kunci dan menjadi sangat penting.
Layout Dasar
Berikut adalah kerangka dasar dari struktur file XML dari tema blogger.
?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:version="2" expr:dir="data:blog.languageDirection" xmlns="http://www.w3.org/1999/xhtml" xmlns:b="http://www.google.com/2005/gml/b" xmlns:data="http://www.google.com/2005/gml/data" xmlns:expr="http://www.google.com/2005/gml/expr">
<head>
<title><data:blog.pageTitle /></title>
<b:include data="blog" name="all-head-content" />
<b:include data="blog" name="google-analytics" />
</head>
<body>
</body>
</html>
XML tags b:section
Dalam file html tag body, kita dapat menempatakan XML tags b:section. Tag ini menunjukan section dalam layout Blogger dimana kita bisa menyimpan tag widget di dalamnya.
<!-- Allow user to add more widgets / gadgets to this section with showaddelement -->
<b:section class="sidebar" id="sidebar" showaddelement="yes" growth="vertical">
<!-- Nothing can go here except b:widgets -->
</b:section>
<!-- Only have widgets here that the programmer defined since showaddelement is no -->
<b:section class="main" id="main" showaddelement="no" growth="vertical">
<!-- Nothing can go here except b:widgets -->
</b:section>
Tag b:section memiliki beberapa atribut sebagai berikut:
- id: (required) sebuah identifier unik untuk suatu section. Akan menjadi atribut id dalam file html-nya.
- class: (optional) akan menjadi atribut class dalam file html-nya. Digunakan secara umum sebagai penamaan class dalam file html.
- maxwidgets: (optional) merupakan bilangan bulat dari jumlah maksimum widget yang dapat dimuat pada section ini. Apabila tidak diisi maka tidak akan ada batasan jumlah widget dalam section ini.
- showaddelement: (optional) bernilai "yes" atau "no" dengan nilai default "yes". Menentukan apakah kita dapat menambah widget dari UI admin Blogger dalam section ini.
- growth: (optional) merupakan nilai "horizontal" atau "vertikal" dengan nilai "vertikal" sebagai defaultnya. Nilai ini menentukan bagaimana setiap widget akan ditumpuk di samping satu sama lain dalam suatu bagian.
XML tags b:widget
Widget harus ditempatkan di dalam tag b:section dan digunakan untuk menampilkan konten di blog anda. Beberapa contoh widget yang tersedia adalah "Blog", "PageList", "Header", "Navbar" dan lain-lain. Widget yang ditempatkan di dalam bagian adalah widget template default dan dapat dihapus jika tidak dikunci (periksa atribut di bawah). Anda tidak perlu memodifikasi widget dan dapat menggunakannya "sebagaimana adanya" dengan menutup tag b:widget di akhir deklarasinya dan tidak memiliki elemen anak. Widget yang disesuaikan hanya disesuaikan untuk bagian itu dan untuk contoh widget itu (sejauh yang saya tahu). Widget khusus berisi tag b:includable yang memberi tahu Blogger cara menampilkan widget. b:widget memiliki beberapa atribut sebagai berikut:
- id: (required) ID untuk widget. Harus identik dengan tipe plus trailing dengan nilai numerik yang unik. Jenis Blog akan memiliki id Blog1 atau Blog2.
- type: (required) Jenis widget. Semua jenis tercantum di bawah bagian atribut ini.
- locked: (optional) Nilai "yes" atau "no" menunjukkan apakah widget dapat dipindahkan atau dihapus dari bagian yang ditentukan. Nilai defaultnya adalah "no".
- title: (optional) Judul tampilan untuk Widget. Akan muncul di layar Layout Widget di Blogger. Jika dihilangkan, akan menggunakan judul Blogger global untuk setiap widget.
- pageType: (optional) Mendeklarasikan halaman mana yang harus menampilkan widget. Dapat memiliki nilai "archive", "main", "item", atau "all". Dengan "all" menjadi nilai default. Widget akan selalu muncul di bagian Tata Letak Blogger, apa pun pageType yang disetel.
- mobile: (optional) Nilai “yes”, “no”, “default” atau “only” yang menyatakan apakah widget dapat muncul di perangkat seluler. Hanya Header, Blog, Profile, PageList, AdSense, Attribution yang akan ditampilkan di perangkat seluler saat nilainya disetel ke default.
Widget Types
- Blog
- Feed
- Header
- HTML
- Image
- LinkList
- TextList
- BloggerButton
- BlogProfile
- Navbar
- VideoBar
- NewsBar
- PageList
- BlogList
- Text
- PopularPosts
- Stats
- PlusBadge
- PlusFollowers
- PlusOne
- Translate
- Label
- Poll
- Slideshow
- CustomSearch
- FollowByEmail
- BlogArchive
<b:section class="sidebar" id="sidebar" showaddelement="yes" growth="vertical">
<b:widget type="PageList" id="PageList" locked="no">
<!-- Have Includables here for custom widget layout and styles -->
</b:widget>
</b:section>
<b:section class="main" id="main" showaddelement="no" growth="vertical">
<!-- Have Blogger use the Default Layout for the widget since no children -->
<b:widget type="Blog" id="Blog1" locked="yes" />
</b:section>
Tidak ada komentar:
Posting Komentar