Belajar dari kesuksesan orang lain merupakan hal yang biasa dilakukan, apalagi jika orang yang dijadikan sebagai sumber inspirasi

CARA MEMBUAT AUTO REDMORE PADA POSTINGAN BLOG

Cara membuat Auto Redmore pada postingan blog ,potingan gue kali ini merupakan lanjutan dari postingan yang lalu pada Cara Mudah Modifikasi Templat Bawaan Blogger, templat yang kemaren kan keliatan polos tuh, nah biar lebih keren lagi tampilanya sob, kini gue akan tambahin dengan Auto Redmore biar lebih cakep sob, walaupun templat bawaan blogger cuman kayak gitu tapi kalo di modivikasi sedemikian rupa akan tampak lebih profesional Kalo di liat dari segi tampilanya sob. Kalo baca artikel artikel dari tetangga sebelah kabarnya mbah google itu suka templat yang sederhana templat bawaan blogger, katanya sih gampang di trima buat ikut berpartisipasi di program google adsense.

Templat blog bawaan blogger memang keliatan panjang banget postingan yang tampil pada mode Home, nah biar lebih singkat tapi masih bisa menampilkan beberapa judul postingan, kita buat Auto Redmore kaya gini nih sob tampilanya;
Setelah di kasih Auto redmore jadinya kayak gini sob:
Lebih keren kan sob?  
Pengen tau caranya?  Silahkan di simak ya sob?
Pertama sobat copas kode di bawah ini ,latakkan di atas kode </head>
<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 50;
img_thumb_width = 50;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
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 5px 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>
Keterangan:
summary_noimg = 250 (panjangnya teks pada post yg tidak mempunyai gambar)
summary_img = 250 (panjangnya teks pada post yang mempunyai gambar)
img_thumb_height = 50 (ukuran tinggi gambar/tumbnail pada tulisan)
img_thumb_width = 50 (ukuran lebar gambar/tumbnail pada tulisan)
Trus abis itu sobat cari kode <data:pos.body/> di templat blog dobat ,biasanya kode tersebut lebih dari satu, ada tiga kalo gak salah, kalo udah ketemu hapus kode tersebut kode yang ke dua atau yang ke tiga, trus ganti dengan kode di bawah ini:
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/><b:else/> <b:if cond='data:blog.pageType != &quot;item&quot;'><style type='text/css'>.post-footer {display:none;}</style><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'><a expr:href='data:post.url'>READ MORE</a></span></b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if></b:if>
Biar tampilanya lebih ganteng tambahin kode dibawah ini sob:
/* Read more----------------------------------------------- */
.rmlink a{font-family:cuprum; background-color:#45818e; color:#FFF; font-size:12px; padding:1px 3px 1px; text-transform:none}
.rmlink a:hover{background-color:#2E5760}
Taroh kode tersebut di atas kode ]]></b:skin>
Yang terakhir save templat,  gimana sob gampang kan silahkan di coba, kalo ada pertanyaan silahkan komen di bawah ya...salam sukses selalu.

Tidak ada komentar:

Posting Komentar

Berkomentarlah dengan sopan dan relefan agar komentar anda tidak masuk ke kotak Spam

Copyright © Solenk Blog: CARA MEMBUAT AUTO REDMORE PADA POSTINGAN BLOG. All rights reserved. Template by Darmudi Blog.