Tutorial Blogger

Cara Memasang Read More Otomatis di Blogspot


Inwepo Tutorial – Untuk para pengguna Blogger, kali ini penulis ingin berbagi cara sangat mudah untuk membuat read more otomatis di Blogspot.


Read More (Baca lebih lanjut) yang berfungsi untuk memotong postingan agar terlihat setengah di halaman depan atau beranda. Dengan memasukan kode Auto Read More di template, kamu tidak usah repot lagi membuat Read More secara manual. Berikut tutorialnya :


1. Login ke blogger dan masuk ke Template –> Edit HTML, kemudian centang Expand Template Widget.


2. Untuk mengantisipasi adanya kekeliruan atau kesalahan, sebaiknya lakukan backup template dahulu.


3. Untuk memudahkan pencarian kode HTML, tekan Ctrl+F. Dan selanjutanya cari kode </head> .


4. Kemudian copy paste kode berikut ini sebelum kode </head> .


<b:if cond=’data:blog.pageType != &quot;item&quot;’><script type=’text/javascript’>var thumbnail_mode = &quot;float&quot; ;summary_noimg = 450;summary_img =300;img_thumb_height = 110;img_thumb_width = 130;</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(img.length>=1) {imgtag = ‘<span style=”float:left; padding:0;margin:0 10px 0 0″><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></b:if>



5. Kemudian cari dan hapus kode di antara <div class=’post-header-line-1’/></div> hingga <b:if cond=’data:post.hasJumpLink’>

6. Ganti dengan kode berikut ini


  <div class=’post-body entry-content’>     <b:if cond=’data:blog.pageType == &quot;static_page&quot;’><data:post.body/><b:else/><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;padding-top:5px;’><a expr:href=’data:post.url’>Readmore &#8594;</a></span></b:if><b:if cond=’data:blog.pageType == &quot;item&quot;’><data:post.body/></b:if></b:if>      <div style=’clear: both;’/> <!– clear for photos floats –>    </div>


7. Simpan Template dan selesai.


nulis di inwepo


Fadli
The best way to multiply your happiness is to share it with others.



1 Comment

1 Comment

  1. Mantap kang

Leave a Reply

Your email address will not be published. Required fields are marked *

Inwepo adalah media platform yang membantu setiap orang untuk belajar dan berbagi tutorial cara penyelesaian suatu masalah di kehidupan sehari-hari dalam bentuk teks, gambar. dan video.

Dengan bergabung bersama kami dan membuat 1 tutorial terbaik yang kamu miliki dapat membantu jutaan orang di Indonesia untuk menyelesaikan masalahnya. Ayo berbagi tutorial terbaikmu.

Download Aplikasi Inwepo

Copyright © 2017 Inwepo. Server by GoCloud

To Top