Hanya menampilkan judul posting pada pencarian label

Arti dari judul diatas adalah, postingan yang terdapat pada label tersebut hanya menampilkan judulnya, seperti yang pernah dibahas oleh o-om. Apabila kita melakukan klik pada label, maka yang akan tampil hanya judul postingan label tersebut tidak menyertakan isi dari postingannya, contohnya klik disini...bagaimana cara membuatnya?

Kemaren-kemaren o-om menjelaskan cara hanya menampilkan judul postingan seperti ini :

Pertama :

Buka Template -> Edit HTML -> Jangan lupa lakukan backup template :) -> kemudian beri tanda cek pada 'Expand Widget Templates'



Kedua :


Lihat kode dibawah ini:

<!-- posts -->
<div class='blog-posts hfeed'>

<b:include data='top' name='status-message'/>

<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

<b:include data='post' name='post'/>



Kemudian cari kode warna merah diatas, jika sudah ketemu ganti kode warna merah diatas dengan kode dibawah ini :



<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>


Ketiga :


Jangan lupa disimpan dan lihat hasilnya. selamat mencoba :)

Sekarang kita akan membuatnya lebih cantik menawan

1. Buka template->Edit hmtl kemudian klik expand widget template
[jangan lupa di backup dulu]

2. Cari kode dibawah ini :

<!-- posts -->
<div class='blog-posts hfeed'>

<b:include data='top' name='status-message'/>

<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

<b:include data='post' name='post'/>

3. Kemudian ganti kode yang berwarna merah dengan kode di bawah :

<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<div style='border: 2px solid rgb(230, 230, 230); width:100%; height:20px; overflow:auto;'><a expr:href='data:post.url'>
<img alt='' border='0' id='BLOGGER_PHOTO_ID_5256418093055728178' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6d7LoZKK4ypjyYm7ddRIzIdb4HMGIErsLBlQw9mn71EuzrpO82ee3pitJuDIuYJ4g-zRx5Hr42hIh6M7n7dRqa9_hDSBQYphgQTBJz83DmPkDEQpPYAFURLoqsZdhA0Gp7cUx5nEYlA/s200/panah2.jpg' style='margin: 0pt 10px 10px 0pt; float: left; cursor: pointer; width: 32px; height: 20px;'/> <b><data:post.title/></b></a></div>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

Penjelasannya :

@ <div style='border: 2px solid rgb(230, 230, 230); width:100%; height:20px; overflow:auto;'> adalah border judul tersebut.
@ <img alt='' border='0' id='BLOGGER_PHOTO_ID_5256418093055728178' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6d7LoZKK4ypjyYm7ddRIzIdb4HMGIErsLBlQw9mn71EuzrpO82ee3pitJuDIuYJ4g-zRx5Hr42hIh6M7n7dRqa9_hDSBQYphgQTBJz83DmPkDEQpPYAFURLoqsZdhA0Gp7cUx5nEYlA/s200/panah2.jpg' style='margin: 0pt 10px 10px 0pt; float: left; cursor: pointer; width: 32px; height: 20px;'/> Adalah gambar pada tampilan judul potingan itu, gambar berada di sebelah kiri.
@ <b><data:post.title/></b> <b> adalah efek penebalan pada judul yang tampil, kita bisa memodifikasinya dengan judul yang berkedip, garis bawah, tulisan miring, dan coretan tengah.

cara penulisannya ganti kode ungu diatas dengan kode hijau dibawah ini :

Judul berkedip <blink><data:post.title/></blink>

Judul dengan garis bawah <u><data:post.title/></u>

Judul tulisan miring <i><data:post.title/></i>

Judul dengan coretan tengah <s><data:post.title/></s>

Pilih yang mana ya? terserah selera aja deh :)

Setelah itu simpan dan lihat hasilnya, klik salah satu label kamu...yang sudah kamu buat adalah [seperti ini].
Selamat mencoba...

Read this | Baca yang ini

Widget by [ Tips Blogger-Tutorial Blogger Pemula ]