Selamat sore sobat belajarcorner (pas buat post ini sore hari) :D
Nah itu ya contohnya read more di artikel kita sob hehe jadi tidak terlalu panjang kan tampilan home page blog kita.
Kali ini saya akan posting bagaimana cara membuat artikel di blog kita menjadi ada read more nya. Apa ya namanya pokoknya supaya tidak terlalu panjang artikel yang tampil di home page blog kita hehe
Membuat readmore di blog kita ini juga bisa menambah SEO blog kita lho. Ada beberapa cara untuk membuat readmore ini, tapi kali ini saya akan share cara yang tidak menggunakan javasripct, jadi lebih gampang.
Nah itu ya contohnya read more di artikel kita sob hehe jadi tidak terlalu panjang kan tampilan home page blog kita.
Sekarang sudah banyak template template blog yang otomatis ada read more nya seperti itu, tapi ada juga yang perlu ditambah dengan cara manual.
Berikut cara otomatis membuat read more di artikel blog kita :
- Log In ke Blogger
- Setelah masuk pilih Template
- Kemudian pilih Edit HTML
- Silahkan cari kode ]]></b:skin> (Gunakan CTRL + F supaya lebih cepat)
- Jika sudah ketemu, silahkan Copy kode dibawah ini dan Paste kan diatas kode ]]></b:skin>
.post-thumbnail{float:left;margin-right:20px}
6. Kemudian cari kode <data:post.body/> jika sudah ketemu silahkan sobat ganti kode tersebut dengan kode yang ada dibawah ini
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<div>
<b:if cond='data:post.thumbnailUrl'>
<img class='post-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' width='72px' height='72px'/>
</b:if>
<data:post.snippet/>
</div>
<div class='jump-link'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
<b:else/>
<data:post.body/>
</b:if>
<b:else/>
<data:post.body/>
</b:if>
<b:if cond='data:blog.pageType != "static_page"'>
<div>
<b:if cond='data:post.thumbnailUrl'>
<img class='post-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' width='72px' height='72px'/>
</b:if>
<data:post.snippet/>
</div>
<div class='jump-link'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
<b:else/>
<data:post.body/>
</b:if>
<b:else/>
<data:post.body/>
</b:if>
7. Jika sudah silahkan SAVE
NOTE :
Biasanya terdapat kode <data:post.body/> lebih dari satu, silahkan dicoba ganti dimulai dari kode yang paling bawah.
Gampang bukan? Semoga bermanfaat sobat
0 comments:
Post a Comment