Blogger Widgets

Cara Membuat Auto Readmore Tanpa Javascript Pada Blog

Untuk membuat auto readmore dengan thumbnail seperti ini :


silakan ikuti langkah-langkah berikut ;

1. Login seperti biasa ke blogger atau  ke https://www.blogger.com/home
2. Template -  Edit HTML
3. Cari kode dibawah ini dengan menekan ctrl + F :

]]></b:skin>

copy dan letakkan kode berikut di atas ]]></b:skin>

.thumbnail-post {
width:100px; 
height:100px; 
float:left; 
margin:0px 10px 0px 0px;
}

4. cari kode  <data:post.body/>  dan ganti dengan kode berikut :

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
  <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:post.firstImageUrl'>
      <a expr:href='data:post.url'><img class='thumbnail-post' expr:title='data:post.title' expr:src='data:post.firstImageUrl'/></a>
    <b:else/>
      <a expr:href='data:post.url'><img class='thumbnail-post' expr:title='data:post.title' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh6e4Hmge1lUJ_FLKwQk5aU21qJq1bJV_-nc0VLXIKS14eD5wNtqCN7qaGJcR3UVPAxVRLgUKhwkExlm2P673j3Ox5g9iLN5ZIoENRF3McisEsofCN-YenXiCh1KooI04hm21TxwlNMnM/s1600/noimagefound.jpg'/></a>
    </b:if>
    <div class='post-snippet'>
      <data:post.snippet/>
    </div>
    <div class='rm-button-wrap'>
      <a class='button' expr:href='data:post.url'>Baca Selengkapnya</a>
    </div>
  </b:if>
</b:if>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <data:post.body/>
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  <data:post.body/>
</b:if>

Apabila tidak berhasil lakukan dengan <data:post.body/> yang kedua, ketiga atau keempat, saya sendiri memasangnya pada <data:post.body/> yang keempat baru berhasil. 

5. Simpan template

Untuk blog yang menggunakan desain template original dari bloger biasanya berhasil dengan cara ini.

Demikian toturial Cara Membuat Auto Readmore Tanpa Javascript Pada Blog


DMCA.com Protection Status

SUBSCRIBE TO OUR NEWSLETTER