Cara Membuat Read More pada Blog

Cara Membuat Read More pada Blog

Advertisements

Cara Membuat Read More pada Blog - Membahas tentang desain blog (Blogspot) memang susah-susah gampang. Tanpa harus belajar sangat dalam tentang HTML maupun JavaScript, kita dimudahkan karena banyak teman-teman blogger yang disana membagikan cara Membuat Read More, cara menghilangkan tulisan diberdayakan oleh blogger, desain blog dan lain-lain.
Cara Membuat Read More pada Blog
Pada kesempatan kali ini saya akan share cara membuat read more pada blog dan berikut adalah caranya:

Silahkan buka blogger.com kemudian pilih Template, Edit HTML dan jangan lupa untuk memberi tanda centang pada Expand Template Widget. Tapi sebelumnya anda perlu untuk memback up template blog anda terlebih dahulu demi keamanan template anda jika terjadi Galat (Error).
readmore

Cari kode </head> (tekan CTRL + F) dan letakkan kode dibawah ini tepat diatas kode </head>
<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 350;
summary_img = 300;
img_thumb_height = 50;
img_thumb_width = 50;
</script>

<script type='text/javascript'>
//<![CDATA[
/*
kursus komputer
http://kursuskomputerbogor.blogspot.com - kursus komputer
*/
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:0px 10px 2px 0px;"><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>

Setelah itu, cari kode <data:post.body/> jika sudah ketemu, ganti kode tersebut dengan kode dibawah ini.

<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;font:normal 9px Arial;text-transform:uppercase;padding:2px 5px 0 0;'><a expr:href='data:post.url'><img src='https://lh6.googleusercontent.com/-FwOHKtFSP5I/UObRrk3BRHI/AAAAAAAAAeI/m-C5R2snR5M/s108/Read%2520More.png'/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/>
</b:if>

Jika selesai, klik simpan! Namun jangan menyimpannya terlebih dahulu, sebaiknya pratinjau, jika anda rasa tidak ada masalah pada template anda, klik simpan!
Advertisements

Contact Us

Nama

Email *

Pesan *

Back To Top