Jika kebetulan anda memiliki postingan yang sangat panjang, dan ingin menyingkatnya menjadi sedikit artikel, tanpa harus menghapusnya. Cara berikut cukup baik untuk dicoba.
sebetulnya tehnisNya hampir mirip dengan penggunaan readmore, hanya saja pada readmore, artikel yang diringkas hanya tampil pada halaman home saja, sehingga pada saat link artikel yang dituju diklik, seluruh isi dari artikel tersebut akan tampil seluruhnya (bayangkan saja jika ternyata artikel anda panjang sekali).
Sedangkan dengan cara ini, artikel tetap dihiden(disembunyikan), dan akan tampil hanya jika diklik saja.
contoh :
sebetulnya tehnisNya hampir mirip dengan penggunaan readmore.
» tampilkan/sembunyikan
Untuk membuatnya ikuti cara berikut :
Masuk ke Blogger » Tata letak » Edit HTML
lalu ceklist Expand Template Widget dan jangan lupa, Download Template Lengkap untuk menghindari error.
Setelah itu cari kode CSS berikut : body {
setelah ketemu, copy kode berikut
.articlehidden {display:none}
.articleshown {display:inline}
lalu paste tepat diatasnya
Berikutnya cari kode berikut : </head>
dan letakan kode dibawah ini, tepat diatasnya
<script type="text/Javascript">
function expandcollapse (postid) {
whichpost = document.getElementById(postid);
if (whichpost.className=="articleshown") {
whichpost.className="articlehidden";
}
else {
whichpost.className="articleshown";
}
}
</script>
Setelah itu save terlebih dahulu,
lalu masuk ke Tab Edit Entri atau Entri Baru.
buat sebuah artikel, yang kemudian sisipkan sebuah kode seperti contoh berikut :
sebetulnya tehnisNya hampir mirip dengan penggunaan readmore.
<span class="articlehidden" id="1">, hanya saja pada readmore, artikel yang diringkas hanya tampil pada halaman home saja., sehingga pada saat link artikel yang dituju diklik, seluruh isi dari artikel tersebut akan tampil semua. Sedangkan dengan cara ini, artikel tetap dihiden, dan akan tampil hanya jika diklik saja.<br/></span>
<a href="javascript:expandcollapse('1')"> » tampilkan/sembunyikan</a>
save dan terbitkan artikel anda, dan cek hasilnya...
selamat mencoba......
Tambahan :
untuk memperjelas fungsi kode diatas, pada postingan yang akan di edit, pilih tab edit html (sebelah compose) masukan kode berikut :
<style type="text/css">
.articlehidden {display:none}
.articleshown {display:inline}
</style>
Pastikan kode tersebut berada di posisi paling atas postingan anda,
Tidak ada komentar:
Posting Komentar