Menambah Jumlah Karakter Huruf (Snippet) di Auto Readmore

Menambah Snippet di Auto Readmore | Kali ini saya akan berbagi trik yaitu bagimana cara menambah jumlah karakter huruf atau mengubah manjang-mendek mingkasan (Snippet/Summary) mosting di momepage blog yang menggunakan auto readmore.

Idealnya jumlah sebuah ringkasan, summary, snippet, atau alinea pertama tulisan pada postingan adalah berjumlah sekitar 160 karakter atau huruf atau sekitar 25 kata, sama dengan jumlah ideal isi SMS agar efisien dan juga terlihat rapi.

Kadang jumlah karakter dari beberapa template terlalu sedikit sehingga kurang enak dipandang. Dan kadang kita bingung bagaimana cara menambahkan karakter huruf dari snippet tersebut karena ini menggunakan auto readmore.

snippet auto readmore

Jumlah karakter di auto readmore tanpa javascript rata-rata lebih sedikit lagi, yaitu sekitar 100 karakter. Ada juga yang diset menjadi 140 karakter, sama dengan popular post dan twitter seperti yang sodara lihat pada gambar diatas. Jumlah karakternya sedikit sehingga kelihatan kurang proporsional.

Cara Menambah Jumlah Ringkasan Atau Karakter Huruf (Snippet) di Auto Readmore

Nah jika template blog sodara menggunakan kode <data:post.snippet/> dan ingin menambah atau mengurangi jumlah karakter di ringkasan/summary posting di halaman depan, maka gunakan tips berikut ini:

1. Template > Edit HTML
2. Copas kode berikut ini di atas kode </head>

<script type='text/javascript'>
snippet_count = 160;
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var snippet = strx.split("<");
for(var i=0;i<snippet.length;i++){
if(snippet[i].indexOf(">")!=-1){
snippet[i] = snippet[i].substring(snippet[i].indexOf(">")+1,snippet[i].length);
}
}
strx = snippet.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSnippet(pID){
var div = document.getElementById(pID);
var summ = snippet_count;
var summary = '<div class="snippets">' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

Keterangan : Angka 160 bisa diubah menjadi 140, 180, 200, dan seterusnya tergantung keinginan sodara-sodara semua.

3. Replace atau GANTI semua kode <data:post.snippet/> dengan kode berikut ini:

<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSnippet(&quot;summary<data:post.id/>&quot;);</script>
Catatan : 
Jika tidak ketemu kode <data:post.snippet/>, maka silahkan cari dan ganti kode berikut ini :

<div class='post-snippet' expr:data-snippet='data:post.snippet'/>

atau
<meta expr:content='data:post.snippet' name='description'/>

4.  Yang terakhir jangan lupa Save Template!

sumber script : http://www.contohblog.com/2015/04/cara-menambah-jumlah-ringkasan-snippet.html

Demikian mengenai bagaimana cara merubah atau menambah karakter huruf pada auto readmore. Semoga bermanfaat buat sodara yang masih bingung. Semoga bermanfaat dan happy blogging.....


Post a Comment

36 Comments

  1. Nanti kalau saya pengen modifikasi template lagi saya gunakan trik ini Kang. Oh iya kang kemaren saya dapet inspirasi tulisan dari komentar Kang Muroi di blog saya. Kemudian saya buat artikel. Maaf belum izin. Hehehehe... Makasih kang...

    ReplyDelete
    Replies
    1. silakan mas....
      oke sip trimakasih jika komentar saya bisa memberikan inspirasi...

      Delete
    2. sepakat dengan kang diatas saya deh :)

      Delete
  2. Tipsmu sangat pintar
    Menambah karakter
    Apa kabar
    Semoga selalu seger

    ReplyDelete
  3. Nah ini kendalanya, di templateku tidak ada kode , sehingga terpaksa aku cuma dan hanya bisa menyimak saja.

    ReplyDelete
  4. wah asli saya baru tau nie kang, ternyata ada caranya yah untuk mengatur jumlah karakter huruf di auto redmore yang tampil di homepage, terimakasih kang atas sharingnya :)

    ReplyDelete
    Replies
    1. sama sama kang, semoga bermanfaat dan bisa mencoba lain kali..

      Delete
  5. Replies
    1. Kalau dah ketemu mau ngapain ..?

      Delete
    2. ya boleh coba mas, kalo mau oprek template lagi..tapi sesuai selera masing-masing sih

      Delete
  6. Trik yang mantap mas, saya juga pernah nyoba cara ini :)

    ReplyDelete
  7. Gak takut salah mas mengedit fitur readmore dari template bawaan,..? memang sih kalau karakter yg tampil pada home terlalu singkat kelihatan kurang menarik dan perlu sedikit editan pada kode sippet atau menambah jumlah angka misalnya 150 menjadi 200 biasanya jumlah angka tersebut ada pada kode script readmore..... Pokmen artikelnya....maknyos

    ReplyDelete
    Replies
    1. salah sudah biasa mas, tapi kita tidak akan bisa jika belum pernah mencobanya, semakin kita sering oprak aprek template semakin lihai :)

      Delete
    2. Ooh begitu toh mas saya kira begini....

      Delete
  8. Kebetulan di template saya sudah sesuai karakternya mas. Lebih singkat lebih baik ya. jangan terlalu panjang. supaya homepagenya tidak terlalu panjang kebawah :D

    ReplyDelete
  9. Saya seperti kok tertarik sama blog keren ini follow ah... biar adminya seneng....

    ReplyDelete
    Replies
    1. tengkyu mas sudah follow blog saya, tak folback yo

      Delete
  10. Mas cara ngilangin thumbnail di hompage biar kaya template agan gimana

    ReplyDelete
    Replies
    1. tiap template punya struktur yang berbeda gan dan beberapa cara bisa dicoba jika salah satunya gagal. cara yang sederhana agan bisa cari kode img atau yang sejenisnya lalu tempatkan kode berikut setelahnya :
      visibility: hidden; display: none

      Delete
    2. bisa juga cari di readmore, temukan kode img atau thumbnail atau sejenisnya, dan coba-coba sisipkan kode diatas setelahnya

      Delete
  11. Saya pake template mas sugeng yang kaya ente pakai jadi gimana ngilanginnya?

    ReplyDelete
    Replies
    1. coba cari kode :
      .img-thumbnail img {
      width: 130px;
      height: 130px; [sisipkan kode disini]
      }

      kode html yang harus disisipkan :

      visibility: hidden; display: none;

      Delete
  12. mas saya pernah coba kotak - katik template hasilnya malah amburadul, mungkin kurang fresh ini pikiran,hehehe
    saya bookmark dulu ya mas untuk menambah jumah karakter auto readmore ini..

    terimakasih banyak kang,

    ReplyDelete
  13. cara merubah nya dengan edit html ya mas, saya ga berani mas kalo maslah ginian, soalnya sudah pernah nyoba dulu di template dulu saya, kebetulan saya cari di google caranya, pas ke tkp hasilnya snya semua berantakan, tapi saya coba dulu ah sama blog percobaan ini :)

    ReplyDelete
    Replies
    1. boleh mas, silakan mencoba..dan jangan takut gagal :)

      Delete
  14. masih menggunakan javascript ya, tapi inilah sebuah solusi untuk menambah atau memperpanjang sumari diauto read more....makasih pencerahannya.

    ReplyDelete
  15. klo terlalu sedikit karakter yg muncul kadang memang kurang menarik,
    klo dibanyakin dikit bisa menarik pengunjung membaca secara keseluruhan
    suwun triknya

    ReplyDelete
  16. kadang memang kita merasakan bahwa jumlah karakter di snippetkurang, maka butuh tambahan kata, kaya gituh cara bikinnya ya kang

    ReplyDelete
  17. makasih gan info nya, muter2 akhir nemu yang cocok disini dan berhasil di terapkan di template evo magz

    ReplyDelete
  18. Error kang, jadinya : Normal 0 false false false IN X-NONE X-NONE ...

    ReplyDelete