twitterfacebookgoogle pluslinkedinrss feedemail

Senin, 02 September 2013

Cara Menghilangkan Read More Dari Laman/Page Blog

Hai sobat blogger, pada kesempatan kali ini saya akan share ke sobat semua bagaimana caranya menghilangkan tombol read more otomatis pada Page atau Halaman Blog sobat semua. disini, kita tidak menghilangkan Tombol read more pada Artikel atau Postingan Blog, Tetapi yang akan kita hilangkan yaitu tombol read more / baca selengkapnya yang ikut muncul di halaman blog. Ini sangat riskan, mengingat bahwa tombol read more yang ada pada page atau halaman blog sobat tersebut membuat isi halaman konten blog pada halaman tersebut tidak akan bisa dilihat oleh pembaca. 




Nah saya akan mencoba bersama sobat tentunya untuk Menghilangkan tombol atau tulisan Read More / Baca Selengkapnya pada Halaman Blog sobat. 
Disini kita akan menggunakan condition tag <b:if... untuk menghilangkan read more / baca selengkapnya dari halaman blog
.

Pada tutorial ini sangat dibutuhkan pemahaman dan analisa juga karena mengingat sistem read more disetiap blog itu belum tentu sama, tetapi metode nya tetap sama saja.

1. Masuk Dashboard Blogger > Template > Edit HTML > Centang Expand Widget Templates seperti biasa.
2. Mari kita cari javascript read more / baca selengkapnya yang digunakan untuk memotong artikelnya, caranya sobat cari kode (gunakan CTRL+F untuk mencari kode) yang kira-kira seperti ini:
var thumbnail_mode
kode lengkapnya biasanya seperti kode dibawah ini:
<script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 300; summary_img = 250; img_thumb_height = 100; img_thumb_width = 110; </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"); if(img.length<=0) { imgtag = '<div class="thumb-post"><span style="float:left;margin-right:5px;"><img src="http://2.bp.blogspot.com/-9Xg0MpzZxyM/T8A9iN25FhI/AAAAAAAABJw/WIL-BYfo10c/s000/diary.jpg" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span></div>'; var summ = summary_noimg; } if(img.length>=1) { imgtag = '<div class="thumb-post"><span style="float:left;margin-right:15px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span></div>'; summ = summary_img; } var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>'; div.innerHTML = summary; } //]]> </script>
3. Ge mana?? ketemu? Kalau sudah ketemu kode yang kira-kira seperti diatas.
Selanjutnya letakkan kode berikut tepat diatas kode lengkap pada langkah nomer 2 tadi
<b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
lalu letakkan juga kode berikut tepat dibawah kode lengkap pada langkah nomer 2 tadi
</b:if></b:if>
sehingga hasilnya kira-kira seperti ini
<b:if cond='data:blog.pageType != &quot;item&quot;'> <
b:if cond='data:blog.pageType != &quot;static_page&quot;'> <script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 300; summary_img = 250; img_thumb_height = 100; img_thumb_width = 110; </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"); if(img.length<=0) { imgtag = '<div class="thumb-post"><span style="float:left;margin-right:5px;"><img src="http://2.bp.blogspot.com/-9Xg0MpzZxyM/T8A9iN25FhI/AAAAAAAABJw/WIL-BYfo10c/s000/diary.jpg" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span></div>'; var summ = summary_noimg; } if(img.length>=1) { imgtag = '<div class="thumb-post"><span style="float:left;margin-right:15px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span></div>'; summ = summary_img; } var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>'; div.innerHTML = summary; } //]]> </script> </b:if></b:if>
Oke sobat, sampai disini kita sudah berhasil membuat agar halaman / page blog tidak terpotong oleh read more. Nah, berikutnya kita akan menghilangkan tombol read more nya dari halaman / page blog nya.. 
 4. Cari kode yang kira-kira seperti ini
<span class='rmlink'
atau kode lengkapnya kira-kira seperti ini:

Catatan, Setiap Blog Mungkin Berbeda-beda.
<span class='rmlink' style='float:right;font-size:13px;font-weight:bold;'><a expr:href='data:post.url'>Read more</a></span>
5. Kalau sudah ketemu, letakkan kode berikut tepat diatas kode lengkap pada langkah nomer 4
<b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
lalu letakkan kode berikut tepat dibawah kode lengkap pada langkah nomer 4
</b:if></b:if>
sehingga hasilnya akan jadi seperti ini:
<b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <span class='rmlink' style='float:right;font-size:13px;font-weight:bold;'><a expr:href='data:post.url'>Read more</a></span> </b:if></b:if>
6. Klik simpan template, dan lihat halaman / page blog sobat apakah read more nya sudah hilang atau belum.. 
Jika sudah.. Ya Alhamdulillah.. 
Semoga Berkenan dan bermanfaat.

0 komentar:

Posting Komentar