Apapun namanya, yang jelas tips readmore kali ini berbeda dengan tips readmore terdahulu. Jika pada tips readmore yang terdahulu, ketika kita mengklik Readmore versi duluuntuk membuka postingan secara utuh maka diperlukan waktu beberapa lama karena harus me-loading ulang postingan tersebut. Dan akan menjadi parah lagi apabila blognya termasuk blog yang berat di mana hal ini dapat membuat pengunjung tidak nyaman & akan menjadi lebih fatal jika kemudian pengunjung menjadi malas untuk melanjutkannya. Sedangkan pada versi yang kedua ini, jika kita mengklik “link readmore” maka postingan secara keseluruhan akan terpampang di bawahnya dengan seketika. Selain “link readmore”, tersedia juga “link summary” di mana jika kita mengkliknya maka postingan akan menjadi pendek (berupa ringkasan) lagi.
Pertama, login ke http://blogger.com hingga masuk Dasbor >> Tata Letak (layout) >> Edit HTML
Kedua, centangi Expand Template Widget
Ketiga, pasang kode berikut ini di atas kode </head >
<script src='http://www.geocities.com/yono_pati/readmore.js'
type='text/javascript'/ >
Keempat, temukan kode di bawah ini.
<div class='post-body entry-content' >
Kelima, sisipkan kode berikut ini
expr:id='"post-" + data:post.id' >
<b:if cond='data:blog.pageType == "item"'
pada kode di atas sehingga menjadi seperti di bawah ini.
<div class='post-body entry-content' expr:id='"post-" + data:post.id' >
<b:if cond='data:blog.pageType == "item"' >
Keenam, temukan kode berikut ini yang letaknya di bawah kode tadi.
<p > <data:post.body/ > </p >
Ketujuh, tambahkan kode berikut ini di bawah kode tersebut.
<b:else/ >
<style>#fullpost {display:none;} </style >
<p > <data:post.body/ > </p >
<span id='showlink' >
<p > <a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\ "); "' href='javascript:void(0);'> Readmore... </a > </p >
</span >
<span id='hidelink' style='display:none' >
<p> <a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);' > Summary... </a > </p >
</span >
<script type='text/javascript' >checkFull("post-" + " <data:post.id/ > ") </script >
</b:if >
Catatan
Teks “readmore” dan “summary” dapat kita ganti sesuai keinginan/selera masing-masing, misalnya menjadi “Baca selengkapnya” dan “ringkasan”.Seperti punya saya baca selengkapnya
Kedelapan, secara keseluruhan akan menjadi seperti di bawah ini, di mana kode yang berwarna merah adalah kode yang baru saja kita tambahkan.
<div class='post-body entry-content' expr:id='"post-" + data:post.id' >
<b:if cond='data:blog.pageType == "item" >
<p> <data:post.body/> </p >
<b:else/ >
<style >#fullpost {display:none;} </style >
<p > <data:post.body/ > </p >
<span id='showlink >
<p > <a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\ "); "' href='javascript:void(0);' > [+/-] Selengkapnya... </a > </p >
</span >
<span id='hidelink' style='display:none' >
<p> <a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\ "); "' href='javascript:void(0);'> [+/-] Ringkasan... </a > </p >
</span>
<script type='text/javascript'>checkFull("post-" + " <data:post.id/> ") </script>
</b:if>
Kesembilan, simpan template
Kesepuluh, ketika melakukan pempostingan, letakkan teks/tulisan yang akan disembunyikan di antara kode <span id="fullpost"> dan </span>
Sebagai contoh adalah sebagai berikut.
Antara satu blogger dengan blogger lainnya menyebut readmore versi ini dengan sebutan yang berbeda-beda, ada yang menyebut dengan readmore versi baru dan tidak sedikit pula yang menyebutnya dengan readmore versi Kedua. <span id="fullpost"> saya sendiri lebih suka menyebutnya dengan readmore versi kedua. </span>
dan edisi yang lalu
wah.. thx mas aan.. ne yg q tunggu tunggu whhwhw
ReplyDelete:))
wah code data:post.body tempat ku gak ketemu nih ... !
ReplyDeleteAku udah bisa buat read more versi ini, cuma masalahnya "read more" kadang bisa di klik, kadang macet. JS nya mungkin bandwidth exceeded :( Cara nyimpen JS sendiri gimana sob, biar ga nebeng orang lain?
ReplyDelete