» » » Membuat Auto Readmore dengan Post Snippet

Membuat Auto Readmore dengan Post Snippet - Banyak cara yang dilakukan untuk membuat read more , ada yang menggunakan java script . ada yang menggunakan bantuan textarea dan masih banyak lagi . namun kali ini saya akan membagikan readmore yang sangat simple dan fast loading karena hanya menggunakan post snippet saja .

Membuat Auto Readmore dengan Post Snippet

Berikut Cara Membuat Auto Readmore dengan Post Snippet :

1. Pasang CSS-nya telebih dahulu . ( pasang kode dibawah ini diatas kode ]]</b:skin> )

.thumb img{float:left;margin-right:10px;width:72px;height:72px}
.jump-link{display:inline;float:right;padding:5px;background:#ddd;margin-top:20px}

2. Kemudian sobat cari kode

<b:includable id='post' var='post'>

3. Setelah ketemu kode <b:includable id='post' var='post'> tersebut , maka nanti dibawahnya akan terdapat dua kode <data:post.body/>, kemudian replace kode <data:post.body/> yang kedua dengan kode berikut ini:

<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:post.hasJumpLink'>
<data:post.body/>
<b:else/>
<b:if cond='data:post.snippet'>
<b:if cond='data:post.thumbnailUrl'>
<div class='thumb'>
<a expr:href='data:post.url' expr:title='data:post.title' expr:alt='data:post.title'><img expr:src='data:post.thumbnailUrl'/></a>
</div>
<b:else/>
<div class='thumb'>
<a expr:href='data:post.url' expr:title='data:post.title' expr:alt='data:post.title'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgLPGf9M9ZQTAWymKUOQxwDBmTSqZfVK7KX40DjR2aorbSGBvkKpt_2t3_A5NqksiAudP6CT9VJSeCNTt1BwJb-FtEFAnZ7KM8RVG-hgABdJK1f19QyBbYhhIR-Wig0XaeQKR5ySqbp7M/h120/no-image.jpg'/></a>
</div>
</b:if>
<data:post.snippet/>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
<b:else/>
<data:post.body/>
</b:if>
</b:if>
</b:if>
</b:if>

4. Langkah terakhir simpan template dan lihat hasilya

Catatan Kecil
Auto Readmore dengan Post Snippet di atas merupakan dasar , jika anda ingin agar readmorenya keren , silahkan anda modif sendiri css-nya dengan penambahan background, border,dll

About Redi

Hi there! I am Hung Duy and I am a true enthusiast in the areas of SEO and web design. In my personal life I spend time on photography, mountain climbing, snorkeling and dirt bike riding.
«
Next
Newer Post
»
Previous
Older Post

No comments:

Leave a Reply