Mari Berbagi: CARA MENAMBAHKAN READ MORE.../BACA SELENGKAPNYA

Kamis, 19 Agustus 2010

CARA MENAMBAHKAN READ MORE.../BACA SELENGKAPNYA

Sering kali kita melihat postingan baik dalam blog ataupun web hanya muncul sebagian kata kata saja namun apabila kita klik pada bagian read more atau baca selengkapnya maka muncul banyak postingan lebih lengkapnya.Hal ini penting digunakan agar tampilan blog lebih maksimal.
TDRVNR28RB2D

Sudahkah blog anda berisikan Read More,atau mungkin bagi anda yang sudah pernah membuat Read More tapi belum maksimal silahkan bisa ikuti cara di bawah ini:

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. Selanjutnya cari kode

<div class='post-body'>

<p><data:post.body/></p>

atau


<div class='post-body entry-content'>

<p><data:post.body/></p>

6. Kalau sudah ketemu, hapus kode tersebut lalu ganti dengan kode yang dibawah 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 Read More yang dicetak tebal diatas bisa anda ganti dengan kata lain misalnya Baca Selengkapnya, Selanjutnya, Lanjut membaca, dan lain-lain.
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 Settings

Cara 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 posting seperti pada gambar dibawah ini.


Letakkan postingan yang mau ditampilkan diatas kode <span id="fullpost">

Dan sisanya (yang mau disembunyikan) 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. Selamat Mencoba. Semoga berhasil...!!