Tutorial kali ini adalah cara mengatur potongan artikel atau snippet artikel pada blogger. Mengatur snippet artikel blogger dapat dilakukan dengan berbagai cara, baik tanpa javascipt ataupun tidak
Disini saya akan menjabarkan bagaimana cara membuat snippet sebuah artikel atau ringkasan artikel hanya dengan tag xml yang sudah disediakan oleh blogger lengkap dengan pengaturannya.
Jadi dengan menggunakan ringkasan sebuah artikel dapat menghemat penggunaan HTML pada view-source baik itu pada homepage, halaman pencarian, ataupun halaman label
Data XML
Berikut data xml yang dapat digunakan untuk membuat snippet artikel :
data:post.snippetdata:post.longSnippetdata:post.snippets.shortdata:post.snippets.longdata:post.body [snippet]
Mari Kita bahas dan pelajari data-data diatas.
data:post.snippet
data:post.snippet dapat digunakan untuk membuat sebuah ringkasan sebuah artikel.Sebenarnya data
data:post.snippet diperuntukan pada widget popular post, tapi bisa dimanfaatkan untuk membuat sebuah ringkasan artikel :
Cara penerapan :
<div class="...">
<data:post.snippet/>
</div>
Keterangan :
- Minimal widget Versi
1 - Minimal layout Versi
1atau2 - Maksimal karakter
140, tidak bisa ditambah - Minimal karakter terserah anda
- Tidak mengandung tag html dan ganti baris
Jika ingin mengurangi jumlah karakter bisa menggunakan contoh berikut :
<div class="...">
<b:eval expr='snippet(data:post.snippet, {length: 140})'/>
</div>
Silahkan ganti nilai 140 dengan yang diinginkan : 1-140
data:post.longSnippet
Cara penerapan :
<div class="...">
<data:post.longSnippet/>
</div>
Keterangan :
- Minimal widget versi
1 - Minimal layout versi
1atau2 - Maksimal karakter
1000, tidak bisa ditambah - Minimal karakter terserah anda
- Tidak mengandung tag html
Jika ingin mengurangi jumlah karakter bisa menggunakan contoh berikut :
<div class="...">
<b:eval expr='snippet(data:post.longSnippet, {length: 1000})'/>
</div>
Silahkan ganti nilai 1000 dengan yang diinginkan : 1-1000
data:post.snippets.short
data:post.snippets.short dapat digunakan untuk membuat sebuah ringkasan pendek sebuah artikel.
Cara Penerapan
<div class="...">
<data:post.snippets.short/>
</div>
Keterangan :
- Minimal widget Versi
2 - Minimal layout Versi
3 - Maksimal karakter
100, tidak bisa ditambah - Minimal karakter terserah anda
- Tidak mengandung tag html dan ganti baris
Jika ingin mengurangi jumlah karakter bisa menggunakan contoh berikut :
<div class="...">
<b:eval expr='snippet(data:post.snippets.short, {length: 100})'/>
</div>
Silahkan ganti nilai 100 dengan yang diinginkan : 1-100
data:post.snippets.long
Cara Penerapan
<div class="...">
<data:post.snippets.long/>
</div>
Keterangan :
- Minimal widget Versi
2 - Minimal layout Versi
3 - Maksimal karakter
1000, tidak bisa ditambah - Minimal karakter terserah anda
- Tidak mengandung tag html dan ganti baris
Jika ingin mengurangi jumlah karakter bisa menggunakan contoh berikut :
<div class="...">
<b:eval expr='snippet(data:post.snippets.long, {length: 1000})'/>
</div>
Silahkan ganti nilai 1000 dengan yang diinginkan : 1-1000
data:post.body [snippet]
Cara Penerapan
<div class="...">
<b:eval expr='data:post.body snippet {
length: 300,
links: true,
linebreaks: true,
ellipsis: true }'/>
</div>
Keterangan :
- Minimal widget Versi
2 - Minimal layout Versi
3 - Maksimal karakter tidak ada, menyusaikan dengan jumlah karakter artikel
- Minimal karakter terserah anda
- Mengandung tag html tertentu
- Mengandung ganti baris jika diinginkan
Penjelasan :
length: jumlah karakter yang ingin ditampilkanlinks: menentukan apakah sebuah link/url (<a>...</a>) ditampilkan pada snippet.
Nilai yang bisa berikan :
true: jika ingin ditampilkan
false: jika tidaklinebreaksmenentukan apakah ganti baris (<br/>) diperlukan atau tidak.
Nilai yang bisa berikan :
true: jika baris ganti(line break) diinginkan
false: jika tidakellipsismenentukan apakah tanda 3 poin ekspansi (...) ingin ditampilkan atau tidak
Nilai yang bisa berikan :
true: jika ya
false: jika tidak- Tag HTML yang akan tampil adalah sbb:
<b>...</b><i>...</i><u>...</u><strong>...</strong><em>...</em><strike>....</strike><s>....</s><del>...</del>- ...
bisa gak supaya pas pengaturannya pas kata terakhir lengkap "dimana"
thank you sebelumnya
Header1
Wow ini adalah kalimat pertama
Wow ini adalah kalimat kedua
Lorem ipsum (Saya ingin snippetnya muncul dari sini, sedangkan kalimat diatasnya tidak)
Jadi intinya, saya ingin Lorem ipsum yang keluar pertama sebagai snippet di homepage, sedangkan kalimat diatasnya tidak. Apa bisa mas?
Mudah-mudahan mengerti apa yang saya maksud.
Terimakasih mas sebelumnya.