Read more v2

.

Ada terdapat pelbagai cara untuk membuat read more.Penulis juga telah beberapa kali mencuba dan menukar cara membuat read more agar post nampak lebih kemas dan sedap mata memandang.Oklah untuk tutorial kali ini penulis namakan aje sebagai read more V2...Lets go to tutorial..

1.Pergi ke blogger dashboard, klik layout---edit html, tandakan pada'expand widget template'.


2.Cari kod ini </head> dan copy script dibawah ini dan pastekan diatas kod tadi </head>

<script language='javascript' src='http://halotemplates.s3.amazonaws.com/jquery-truncator/jquery-1.2.3.pack.js' type='text/javascript'/> <script language='javascript' src='http://halotemplates.s3.amazonaws.com/jquery-truncator/jquery.expander.js' type='text/javascript'/> <script type='text/javascript'> $(document).ready(function() { $('.excerpt').expander({ slicePoint: 280, // default is 100 expandText: '[...]', // default is 'read more...' }); }); </script>

3.Kemudian cari kod dibawah ini..dan highlight kannya ( lihat rajah)

<div class='post-body entry-content'> <data:post.body/> <div style='clear: both;'/> <!-- clear for photos floats --> </div>

4. Gantikan kod yang telah di highlight tadi dengan kod dibawah ini..

<b:if cond='data:blog.pageType != "item"'> <div class='excerpt post-body entry-content'> <data:post.body/> <div style='clear: both;'/> <!-- clear for photos floats --> </div> <b:else/> <div class='post-body entry-content'> <data:post.body/> <div style='clear: both;'/> <!-- clear for photos floats --> </div> </b:if>

5. Preview dulu hasil kerja kamu, jika berjaya hasilnya akan kelihatan seperti rajah dibawah..kemudian baru save template kamu...Nah mudahkan

# Kamu boleh menukar tanda '[...]' dengan tulisan seperti read more atau baca seterusnya..Sekian moga berhasil..

Mungkin artikel dibawah yang sedang anda cari



3 comments:

Naqib Mohamad berkata...

saya dah cuba banyak kali... tapi tak dapat...
harap dapat bantu...

deenoh berkata...

setiap template mempunyai kod html yang berbeza kerana modifikasi dan tambahan widget yg kita lakukan.cuba Naqib cari kod yang agak sama seperti ini, <div <data:post.body/>....sehingga </div>
dan gantikan dengan kod pd tutorial no 4.

Naqib Mohamad berkata...

saya x jumpa apa yang dimaksudkan... bahagian mana hendak cari...?

:)) ;)) ;;) :D ;) :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Catat Ulasan

Komenlah sesuka hati anda kerana tuan empunya blog ini buta hati dan buta perasaan tetapi tidak buta mata.

 

Pelawat

free counters
BlogInfoTips

Pengikut

Recent Comments

Powered by Deenoh

© Copyright 2007-2009. Blog tutorial . All rightsreserved | Bloginfotips.com is proudly powered by Blogger.com | Template redesign by Deenoh