Tampilkan postingan dengan label posting. Tampilkan semua postingan
Membuat Read More di Blogspot
Buat
temen-temen yang lagi pada belajar nge-Blog . Di postingan ini , saya mencoba
membagi cara membuat read more ke postingan blog kita , karena secara
defaultnya biasanya postingan kita dimunculkan semuanya sehingga home blog kita
pasti penuh dan panjang ke bawah ... Hehe .
 |
| Read more picture |
Nah
tanpa basa-basi langsung aja deh ini cara nya .
- Masuk ke Dashboard Blog kita
- Pilih Menu Template
- Pilih Edit HTML
- Maka akan muncul tampilan
script dari template yang kita gunakan .
- Nah mulai lah proses edit kita
disini
- Cari </head>
- Tambahkan
script dibawah ini tepat di atas </head> .
<!--ReadMore -->
<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:400px;height:250px;}
</style>
<script
type='text/javascript'>
var thumbnail_mode =
"yes"; //yes -dengan gambar, no -tanpa gambarsummary_noimg =
300; //banyaknya huruf jika tidak ada gambarsummary_img = 250; //banyaknya
huruf jika ada gambarimg_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>
<!--Auto Read More Akhir-->
- Jika sudah , coba SAVE terlebih dahulu template anda .
Selanjutnya Coba cari potongan script dibawah ini :
<b:widget id='Blog1'
locked='true' title='Blog Posts' type='Blog'>...</b:widget>
- Nah kata kuncinya adalah Blog Posts / Postingan Blog . disesuaikan
dengan settingan bahasa yang digunakan pada Blog kita . Nah klo sudah
ketemu , mari kita lanjutkan proses nya .
- Klik pada anak panah yang ada di
sebelah nomor baris . kemudian cari script berikut ini :
<data:post.body/>
- Nah , klo sudah ketemu . ganti
script barusan dengan script berikut ini :
<!-- Auto read more Mulai -->
<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'>Baca Selengkapnya
»</a>
</div>
</b:if>
</b:if>
<!-- Auto read more Akhir -->
- Nah klo sudah , silahkan di SAVE dan lihat hasilnya . :D
Nah semoga panduan ini
bermanfaat bagi teman-teman . Saya dapat referensi nya dari website di bawah
ini nih :
Terima Kasih .
My First Post
Ini posting pertama ku di blog ini .
Pada blog ini , akan disimpan informasi yang saya temui sehari-hari. selama dalam hal yang positif dan bermanfaat tentunya , semoga bisa berguna juga ke orang lain yang membaca blog ini ..
Pada blog ini informasi akan disampaikan secara acak , dengan berbagai macam kategori yang mungkin akan beragam-ragam bentuknya .
Jadi untuk teman-teman yang membaca blog ini .... selamat menikmati blog ini :D
