Cara Menciptakan Redmore Otomatis Di Blog
Teknik Membuat Redmore Otomatis di Blog- Readmore yaitu salah satu upaya untuk membuat template kelihatan manis dan keren readmore atau juga sering di buat dengan goresan pena "baca selengkapnya", atau lanjut membaca, atau next read, dan lain sebagainya yaitu instruksi untuk merubah tampilan artikel blog di hompage sehingga artikel lebih ringkas dan lebih pendek, menyerupai ada di blog saya ini memakai script readmore dan tolong-menolong berbagai blogger yang memasang readmore di blog mereka dan mereka pada umumnya mempunyai readmore yang tidak sama-beda dan ini yaitu salah satunya diberikut yaitu cara membuat nya kalau sahabat bersahabat ingin melihat hasilnya.
Berikut adalah
Berikut adalah
Teknik Membuat Readmore / Baca Selengkapnya
- Pertama yaitu masuk ke blogger milik sahabat dekat
- Pilih TEMPLATE dan "EDIT TEMPLATE" kemudian cari kode </head> gunakan tombol CTRL + F pada keyboard untuk mencari instruksi </head> nya, kemudian copy instruksi warna biru di awah ini pastekan di atas instruksi </head>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style>
.post-body{text-align:justify;}
.post-body img{max-width:none;width:auto;}
.read-more{float:left; padding-top: 10px;}
.read-more a{ color: #fff!important;text-shadow:0 1px 0 rgba(0,0,0,0.5);background:#0457A9; text-decoration:none;font:bold 13px Arial;padding:5px;}
.read-more a:hover{text-decoration:none;background:#666;}
.pic{border: 10px solid #fff;float:left;height:165px;width:250px;margin-right: 20px;margin-bottom:10px;overflow:hidden;box-shadow: 5px 5px 5px #111;}
.grow img{height:165px;width:250px;transition: all 2s ease;}
.grow img:hover{width:300px;height:250px;}
</style>
<script type='text/javascript'>
var thumbnail_mode = "yes"; //yes -dengan gambar, no -tanpa gambar
summary_noimg = 200; //banyaknya karakter kalau tidak ada gambar
summary_img = 190; //banyaknya karakter kalau ada gambar
img_thumb_height = 165;
img_thumb_width = 250;
</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(thumbnail_mode == "yes"){if(img.length>=1){imgtag = '<div class="grow pic"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></div>';summ = summary_img;}}var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';div.innerHTML = summary;}
//]]></script>
</b:if>
</b:if>
Keterangan : Silahkan ganti instruksi yang berwarna merah dengan mengatur sesuai harapan sahabat dekat. - Lalu diberikut yaitu dengan mencari instruksi <data:post.body/> (cara mencarinya sama dengan cara pada nomer 2 dengan menekan tombol pada keyboard CTRL + F ) kalau sudah ketemu silahkan ganti kode <data:post.body/> dengan instruksi warna biru di bawah ini. note : karena setiap template tidak sama karena kode <data:post.body/> ini ada lebih dari satu maka teman bersahabat dapat mencoba dari mulai yang paling bawah
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb("summary<data:post.id/>");
</script>
<div class='read-more'>
<a expr:href='data:post.url'>Read More.. »</a>
</div>
</b:if>
</b:if>
silahkan ganti kata readmore dengan kata sesuka sahabat dekat - Jangan lupa untuk menyimpan template nya. .

Komentar
Posting Komentar