Thursday, October 19, 2017

Pnggunaan Tag Blogger Pada Template

Tags

PENGGUNAAN TAG BLOGGER PADA TEMPLATE


membuat-tata-letak-dengan-widget-section-


<b:section id=’sidebar’ class=’sidebar1′ showaddelement=’yes’> 
Coba perhatikan gambar! Section ini akan membuat semacam ruang. Bisa kita letakkan sebagai Main dan Sidebar. Kalau mau bikin 3 kolom, buatlah section Sidebar_Left, Main, dan Sidebar_Right. Misal dibawah Anda mau bikin Footer? Silahkan. Dibawah footer ada anaknya Footer1, Footer2, Footer3 juga bisa. Penggunaan ID dan Class bebas. Atribut showaddelement bisa yes atau no. Kalau yes, nanti akan ada tulisan “Tambahkan Widget” di setiap section bar.

format-penulisa-tag-widget-


<b:widget id=’Blog1′ locked=’true’ title=’Blog Posts’ type=’Blog’> 
Setelah kita membuat section bar, nanti kita tinggal tambahkan widget yang diinginkan. Kalau kita mau buat widget sendiri yaa gunakan saja HTML/JavaScript. Untuk ID biasanya akan otomatis diisi oleh saat kita menambah widget baru. Kalau Anda mau menambahkan atribut class sebagai kelompok CSS nantinya, iya silahkan. Locked disini berarti widgetnya tidak bisa di-drag (pindah posisi). Valuenya true atau false. Kalau Anda tidak mengisi atribut title, maka judul widget tidak akan muncul. Tag widget ini adalah child dari tag section, maka diluar section tidak bisa digunakan.

<b:includable id=’post’ var=’post’> 
Tag ini biasanya akan otomatis muncul di dalam tag widget. Saya asumsikan beberapa tag includable ini berfungsi untuk membuat baris pengaturan pada widget tersebut. Coba Anda buka menu Tata Letak, klik edit pada widget Blog Posts. Maka akan terbuka seperti gambar dibawah ini, kan?
menu-edit-widget--includable-tag
Nah, lalu coba klik juga edit pada widget HTML. Pasti tampilan baris pengaturannya berbeda. Seperti contoh format widget HTML diatas, dapat kita lihat hanya terdapat satu tag includable maindisana. Yang didalam tag includable main tersebut, ada <data:title/> dan ada <data:content/>. Kurang lebih seperti itu. Tag includable ini child dari tag widget, hanya bisa tampil setelah ada widget.

<b:include data=’top’ name=’status-message’/> 
Tag include seperti ini bisa dikatakan sebagai pemanggil. Atribut name hampir mirip fungsinya seperti atribut href yang valuenya merupakan suatu alamat. Jadi tag ini memerintahkan untuk menambahkan data tertentu. Value atribut yang digunakan, mestinya berhubungan dengan beberapa tag Blogger lain yang ada pada template atau yang dimengerti oleh sistem Blogger. Untuk beberapa tag include bisa juga tidak digunakan seperti misal <b:include name=’quickedit’/> lebih baik dihapus.

<b:loop values=’data:posts’ var=’post’> 
Tag ini fungsinya untuk melakukan perintah pengulangan. Sebagai contoh pada halaman beranda biasa Anda akan melihat beberapa konten artikel sekaligus kan? Seperti pada Beranda Javaone45 disana akan muncul 6 Artikel terbaru. Nah, di dalam source template sebenarnya kita hanya membuat satu kali susunan elemen saja. Lalu tinggal letakkan diantara tag looping ini.

<b:if cond=’data:post.url’> 
Pada template Blogger kita akan banyak sekali menggunakan tag jenis ini nantinya. Kalau Anda lihat pada bagian elemen widget Blog saja, pasti banyak dijumpai tag conditional. Untuk memahami bagaimana cara membacanya silahkan baca dulu Macam-macam Conditional Tag Blogger. Dengan adanya tag ini bisa saja kelihatan dalam satu template terdapat beberapa ID elemen yang sama. Kenapa bisa? Karena bisa jadi yang satu cuman tampil di halaman beranda dan satu lagi di halaman artikel.

<data:post.numComments/> 
Kalau yang ini mungkin sudah tahu kan fungsinya untuk apa? Seperti di penjelasan widget diatas, setiap tag berawalan <data: umumnya akan menampilkan isi yang sudah ada di database Blogger. Inilah yang sifatnya variabel. Karena datanya tidak ada pada template kita. Seperti beberapa postingan yang sudah kita tulis, seberapa banyak jumlah komentar, isi dari komentar, dsb. Semua data tersebut mesti dipanggil dengan perintah tag ini.

<link expr:href=’data:blog.homepageUrl + &quot;feeds/posts/default&quot;’ expr:title=’data:blog.title + &quot; – Atom&quot;’ rel=’alternate’ type=’application/atom+xml’/> 
Sebenarnya ini bentuk tag HTML biasa. Hanya saja untuk value dari atributnya menggunakan data: maka prinsipnya sama seperti tag data sebelumnya. Cuman lagi pada bagian atribut mesti ditambahkan expr: sebelum nama atributnya.

Contoh sebelum dan sesudah tag ini diterapkan pada template: 
<a expr:href=’data:blog.homepageUrl + &quot;p/about.html&quot;’ title=’Profil Admin Selengkapnya’> 
<a href=’http://www.javaone45.blogspot.com/p/about.html’ title=’Profil Admin Selengkapnya’> 
Dengan menggunakan tag jenis seperti ini, nantinya value atribut akan menyesuaikan dengan data yang ada pada blog.


EmoticonEmoticon