cara membuat baca selengkapnya/read more pada postingan

Bookmark and Share
Caranya :

1. Login ke Blogger. Klik menu Layout lalu klik Edit HTML. Back-up terlebih dahulu template Anda dengan cara klik pada Download Full Template untuk menyimpan file template di komputer Anda.

2. Beri tanda centang pada opsi "Expand Widget Templates" (tunggu beberapa saat hingga proses selesai).

3. Setelah itu, cari kode </head> pada template Anda. Supaya lebih mudah untuk mencarinya, tekan Ctrl+F lalu masukkan kode </head> trus klik Next.

4. Jika sudah ketemu, letakkan kode dibawah ini diatas kode </head>
Catatan: Bagi para blogger yang sudah pernah memasang kode read more harus dihapus terlebih dahulu kode read more-nya sebelum memasang kode ini
<b:if cond='data:blog.pageType != &quot;item&quot;'> <script type='text/javascript'>
var fade = false; function showFull(id) { var post = document.getElementById(id); var spans = post.getElementsByTagName('span'); for (var i = 0; i &lt; spans.length; i++) { if (spans[i].id == &quot;fullpost&quot;) { if (fade) { spans[i].style.background = peekaboo_bgcolor; Effect.Appear(spans[i]); } else spans[i].style.display = 'inline'; } if (spans[i].id == &quot;showlink&quot;) spans[i].style.display = 'none'; if (spans[i].id == &quot;hidelink&quot;) spans[i].style.display = 'inline'; } }
function hideFull(id) { var post = document.getElementById(id); var spans = post.getElementsByTagName('span'); for (var i = 0; i &lt; spans.length; i++) { if (spans[i].id == &quot;fullpost&quot;) { if (fade) { spans[i].style.background = peekaboo_bgcolor; Effect.Fade(spans[i]); } else spans[i].style.display = 'none'; } if (spans[i].id == &quot;showlink&quot;) spans[i].style.display = 'inline'; if (spans[i].id == &quot;hidelink&quot;) spans[i].style.display = 'none'; } post.scrollIntoView(true); }
function checkFull(id) { var post = document.getElementById(id); var spans = post.getElementsByTagName('span'); var found = 0; for (var i = 0; i &lt; spans.length; i++) { if (spans[i].id == &quot;fullpost&quot;) { spans[i].style.display = 'none'; found = 1; } if ((spans[i].id == &quot;showlink&quot;) &amp;&amp; (found == 0)) spans[i].style.display = 'none'; } }
</script> </b:if>


5. setelah itu cari kode ini
<div class='post-body'><p><data:post.body/></p>
6. hapus kode tersebut dan ganti dengan kode ini<div class='post-body' expr:id='"post-" + data:post.id' ><b:if cond='data:blog.pageType == "item"'><style>#fullpost{display:inline;}</style><p><data:post.body/></p><b:else/><style>#fullpost{display:none;}</style><p><data:post.body/></p><span id='showlink'><a expr:href='data:post.url'>Read More...</a></span><script type='text/javascript'>checkFull("post-" + "<data:post.id/>");</script></b:if>
catatan: kata readmore yang berwarna hitam dapat diganti sesuai keinginan anda
7. Jika sudah selesai, klik tombol Save Template. Kalau muncul "Your changes have been saved" berarti proses pengeditannya berhasil.

8. Kemudian klik Settings, lalu klik Formatting. Cari "Post Template". Kalau sudah ketemu, isi kotak kosong tersebut dengan kode berikut:
<span id="fullpost">
</span>


9. Jika sudah, klik tombol Save SettingsCara memposting supaya muncul Read More pada saat artikel ditampilkan:Pada saat Anda mau memposting, anda akan tampak 2 baris kode pada bagian Edit HTML kotak .


Letakkan postingan yang mau ditampilkan diatas kode
<span id="fullpost">
Dan yang mau disembunyikan letakkan diantara
<span id="fullpost">

dan
</span>

Klik Publish Post, lalu klik (in a new window) untuk melihat hasilnya pada halaman baru

Catatan:Artikel yang sudah diposting sebelum memasang kode Read More akan tetap tampil penuh dihalaman muka. Untuk mengeditnya, Anda bisa menggunakan cara berikut:

1. klik Edit Posts pada menu posting

2. Klik Edit pada artikel yang ingin dipasang Read More

3. Klik mode Edit HTML, lalu pindahkan kode <span id="fullpost"> dibawah postingan yang mau ditampilkan dan letakkan kode </span> diakhir artikel

4. Klik tombol Publish Post, lalu klik (in a new window) untuk melihat hasilnya berhasil atau tidak. Jika tidak, mungkin ada bagian yang terlewatkan atau salah. Coba liat kembali langkah diatas.

{ 0 komentar... Views All / Send Comment! }

Posting Komentar

Powered By Blogger