Pages

Auto Read More Tanpa JavaScript

Pemasangan read more merupakan pemasangan sepenggal kalimat yang dituliskan dalam artikel blogger. Biasanya ini digunakan oleh pengguna blogger pada home page saja. Alasan kebanyakan dari mereka adalah memperingkas home page (halaman depan) blogger. Tak jarang dari kebanyakan tutorial yang sudah memberikan tips untuk pemasangan read more ini. Baik read more yang diganti oleh gambar ataupun read more manual.

Pada tutorial ini, murni menggunakan tag data default dari blogger. ini bisa memperingan pemasangan read more dengan javascript. Berikut demo yang bisa anda liat dari pemasangan read more otomatis tanpa javascript.



Cara membuatnya adalah :

Edit HTML template anda dan jangan lupa centang Expand Widget Templates dan cari kode berikut <data:post.body/> dan ganti dengan kode dibawah ini :

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:post.thumbnailUrl'>
        <a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' expr:src='data:post.thumbnailUrl'/></a>
    <b:else/>
        <a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVyrIo3dlzXPmenRtQr3guI4eKyfcf9p5aX6moJm-Orrcur2W9PrZHN7MsSzDX1RfWxc0NXjaZ-8BHvZYjyyn8kSlaKNtYbFWm_6_4c-MYOJAXVeLvX2zjwUHSpyEmMkFA8XsAcl9SdYs/s1600/no-image.png'/></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:else/>
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
        <data:post.body/>
    </b:if>
</b:if>

Jika template anda sudah menggunakan auto readmore dengan javascript silakan cari kode berikut :

<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>

dan ganti semua kode diatas sehingga menjadi seperti ini :

<b:if cond='data:post.thumbnailUrl'>
    <a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' expr:src='data:post.thumbnailUrl'/></a>
<b:else/>
    <a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVyrIo3dlzXPmenRtQr3guI4eKyfcf9p5aX6moJm-Orrcur2W9PrZHN7MsSzDX1RfWxc0NXjaZ-8BHvZYjyyn8kSlaKNtYbFWm_6_4c-MYOJAXVeLvX2zjwUHSpyEmMkFA8XsAcl9SdYs/s1600/no-image.png'/></a>
</b:if>
<div class='post-snippet'><data:post.snippet/></div>

Langkah terakhir, silakan modifikasi auto read more template anda dengan sentuhan CSS berikut yang biasanya diletakkan sebelum kode ]]></b:skin>

.post-thumbnail {
  width:72px;
  height:72px;
  float:left;
  margin:0px 10px 0px 0px;
}
 
Simpan Template anda dan lihat hasilnya.

Share it:
Sobat sedang membaca artikel tentang Auto Read More Tanpa JavaScript. Silahkan baca artikel bloger sejati Tentang yang lainnya.
Anda baru saja membaca artikel yang berjudul Auto Read More Tanpa JavaScript.Anda boleh copy paste artikel ini dengan menyertakan link http://lisaariyansyah.blogspot.com/2013/03/auto-read-more-tanpa-javascript.html sebagai sumbernya.Dan Jika Anda ingin berlangganan Artikel dari blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel terbaru setiap ada artikel yang terbit di blog ini.

0 comments:

Kode Smiley Untuk Komentar


:a :b :c :d :e :f :g :h :i :j :k :l :m :n :o :p :q :r :s :t

Post a Comment

 

bloger sejati Copyright © 2008-2009 | Edited By : arieadie