Cara Memasang Read More Otomatis di Blogspot

Untuk para pengguna Blogger, kali ini penulis ingin berbagi cara sangat mudah untuk membuat read more otomatis di Blogspot.

Read More (Baca lebih lanjut) yang berfungsi untuk memotong postingan agar terlihat setengah di halaman depan atau beranda. Dengan memasukan kode Auto Read More di template, kamu tidak usah repot lagi membuat Read More secara manual. Berikut tutorialnya :


1. Login ke blogger dan masuk ke Template –> Edit HTML, kemudian centang Expand Template Widget.


2. Untuk mengantisipasi adanya kekeliruan atau kesalahan, sebaiknya lakukan backup template dahulu.


3. Untuk memudahkan pencarian kode HTML, tekan Ctrl+F. Dan selanjutanya cari kode </head> .


4. Kemudian copy paste kode berikut ini sebelum kode </head> .


<b:if cond=’data:blog.pageType != &quot;item&quot;’><script type=’text/javascript’>var thumbnail_mode = &quot;float&quot; ;summary_noimg = 450;summary_img =300;img_thumb_height = 110;img_thumb_width = 130;</script><script type=’text/javascript’>//<![CDATA[
function removeHtmlTag(strx,chop){if(strx.indexOf(“<“)!=-1){var s = strx.split(“<“);for(var i=0;i<s.length;i++){if(s[i].indexOf(“>”)!=-1){s[i] = s[i].substring(s[i].indexOf(“>”)+1,s[i].length);}}strx = s.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 createSummaryAndThumb(pID){var div = document.getElementById(pID);var imgtag = “”;var img = div.getElementsByTagName(“img”);var summ = summary_noimg;if(img.length>=1) {imgtag = ‘<span style=”float:left; padding:0;margin:0 10px 0 0″><img src=”‘+img[0].src+'” width=”‘+img_thumb_width+’px” height=”‘+img_thumb_height+’px”/></span>’;summ = summary_img;}var summary = imgtag + ‘<div>’ + removeHtmlTag(div.innerHTML,summ) + ‘</div>’;div.innerHTML = summary;}//]]></script></b:if>

5. Kemudian cari dan hapus kode di antara <div class=’post-header-line-1’/></div> hingga <b:if cond=’data:post.hasJumpLink’>

6. Ganti dengan kode berikut ini


  <div class=’post-body entry-content’>     <b:if cond=’data:blog.pageType == &quot;static_page&quot;’><data:post.body/><b:else/><b:if cond=’data:blog.pageType != &quot;item&quot;’><div expr:id=’&quot;summary&quot; + data:post.id’><data:post.body/></div><script type=’text/javascript’>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script><span class=’rmlink’ style=’float:right;padding-top:5px;’><a expr:href=’data:post.url’>Readmore &#8594;</a></span></b:if><b:if cond=’data:blog.pageType == &quot;item&quot;’><data:post.body/></b:if></b:if>      <div style=’clear: both;’/> <!– clear for photos floats –>    </div>


7. Simpan Template dan selesai.

1 Comment

1 Comment

  1. fir ring

    Desember 24, 2013 at 23:27

    Mantap kang

Leave a Reply

Your email address will not be published. Required fields are marked *

Trending Minggu Ini

Inwepo adalah media platform yang membantu setiap orang untuk belajar dan berbagi tutorial, tips dan trik cara penyelesaian suatu masalah di kehidupan sehari-hari dalam bentuk teks, gambar. dan video.

Dengan bergabung bersama kami dan membuat 1 tutorial terbaik yang kamu miliki dapat membantu jutaan orang di Indonesia untuk mendapatkan solusinya. Ayo berbagi tutorial terbaikmu.

Ikuti Kami di Sosmed

Inwepo Navigasi

Tentang Kami             Beranda

Hubungi Kami             Panduan Penulis

Kebijakan Privasi

FAQ

Partner

Copyright © 2014 - 2023 Inwepo - All Rights Reserved.

To Top