Loading post navigation ...
 
 

Pro page

16
Nhận xét

Tiện ích Automatic Post Summary cho blog (sử dụng javascript)

| by Phan Dũng | views

Hãy nhấn thanks để ủng hộ tác giả

[FD's BlOg] - Lang thang trên mạng 1 hồi, mình tìm được tiện ích này. Tiện ích này sẽ tự tạo bài viết kiểu thu gọn ở các trang. Một dạng giống như kiểu thêm tiện ích "Read more...". Nhưng ở đây dùng javascript để tự động thu gọn bài viết với ảnh thumbnail.



Hình ảnh minh họa:

trước khi thêm tiện ích vào blog

sau khi thêm tiện ích vào blog


- Như đã nói ở trên, đây là thủ thuật mình tìm được trên mạng, và sau khi test mình tìm thấy 1 lỗi nhỏ từ thủ thuật này. Đó là khi ta nhấp vào xem bài viết thì không thể xem được toàn bộ bài viết, mà vẫn chỉ là dạng summary post giống như ngoài trang chủ.

Hình minh họa:



Đây là 1 sơ xuất nhỏ, nên mình có chỉnh sửa lại (xem hình minh họa bên dưới)


- Lưu ý: nếu blog của bạn đã có thêm tiện ích "Readmore" thì hãy gỡ bỏ nó đi trước khi thực hiện thủ thuật này cho blog của bạn.

☼ Sau đây là các bước thực hiện:
1. Đăng nhập blog
2. Vào bố cục
3. Vào chỉnh sửa code HTML
4. Chọn mở rộng mẫu tiện ích
5. Chèn đoạn code javascript bên dưới vào sau thẻ đóng </head>

<script type='text/javascript'>
var thumbnail_mode = "no-float" ;
summary_noimg = 230;
summary_img = 200;
img_thumb_height = 80;
img_thumb_width = 80;
</script>

<script src='http://data.fandung.com/js/autoreadmorethumb.js' type='text/javascript'/>

- Bạn có thể thay đổi các thông số thiết lập nếu bạn muốn.

6. Xuống dưới tìm đoạn code sau:
<data:post.body/>


7. Và thay thế nó bằng đoạn code bên dưới:

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>

<div expr:id='"summary" + data:post.id'>
<p><data:post.body/></p>
</div>

<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>

</b:if>


8. Save template.

Tác giả của thủ thuật Anhvo (Vietwebguide.com)
Chúc các bạn thành công.


Enter your mail address:

16

Thành Công

Rất hay, Póc tem cái ;)

Comedown

Cái này có lâu rồi mà FD, trước đây nhavo cũng đã giới thiệu rồi. Hiện tại một số template mới mặc định đã được add nó. :)

fandung

Vậy hả Comedown :). Thì coi như là lấy thủ thuật của template này áp dụng cho template kia. Giống như 1 số thủ thuật trước mình đã giới thiệu.

Anhvo

Ặc, cái code đó chính là do Anhvo viết chứ không phải thằng Blogger Trick nào đó đâu, nó copy mà không ghi nguồn, chắc chắn Blogger Trick là của Việt Nam rồi.

fandung

Ủa vậy hả Anhvo nó để source file javascript của trang nào đó, làm mình tưởng...

Nói sao thấy cái này giống giống cái Recent posts của Anhvo , đúng là Anhvo giỏi về javascript thiệt.

Vậy để mình sửa nguồn lại. :D

Anhvo

Uhm cám ơn Fan Dũng nhiều nha! ;)) Site cậu phát triển nhanh thật đó!

fandung

@Anhvo : Site mình phát triển vậy cũng bình thường mà, chứ không nói là chậm.

Không biết Anhvo có biết điều này ko, tụi mình cùng quê đó, từ hồi làm quen với blogger đến giờ biết đc 2 blog ở Tây Ninh là của Anhvo và NgânKVN, 2 blog này đều "pự", dùng sao cũng được thơm lây 1 ít hehehe. Còn NgânKVN thì gần chỗ mình luôn, cũng ở Châu Thành như mình :D

Anhvo

ồ, thiệt hả. Hehe đã thiệt, kiểu này chắc dân Tây Ninh mình trùm blogger luôn quá :D Hy vọng sau này sẽ thế. Anhvo ở Trảng Bàng, hồi xưa học THPT Nguyễn Trãi. Hồi trước cũng có vài lần lên Hoàng Lê Kha ở thị xã học, mà đi trên quốc lộ 22B thôi, chưa đi tới Châu Thành.

fandung

Anhvo lên trường Hoàng Lê Kha học gì trên đó, mình là dân Hoàng Lê Kha chính gốc nè, học ở đó từ năm lớp 6 lên tới 12 luôn. :D

Anhvo

Hehe hồi đó cũng đua đòi lên đó thi Học sinh giỏi :D Đi lên đi xuống hàng ngày ở trên đó kaka. Đó là năm 2003.

Phan Dũng

@Anhvo: siêng vậy à,từ trảng bàng mà đi lên đi xuống hàng ngày tới thị xã sao??? cực nhỉ. Nếu Anhvo và mình học cùng thời chắc sẽ biết nhau đấy, tại mình cũng thị học sinh giỏi mà :D. Và mình cũng 1 thời làm quán quân môn Lý ở Tây Ninh đó (từ năm lớp 9 tới 12 :D). Nổ chút :)) . Chắc cũng có thể vào thời của mình ko có ai chịu thi nên mình mới "làm trùm" đc :)).

Nói vậy thôi chứ đó đã là quá khứ rồi, và giờ nhìn lại thấy hơi thất vọng về bản thân mình.

Anhvo

hồi đó Anhvo thi học sinh giỏi Tón :D Lúc đó đi học trên đó mệt nhưng vui lắm, đi chung với mấy em đẹp trong trường mà :D Cậu nay học đại học hay học cao học vậy?

Phan Dũng

Đại học thôi Anhvo à :(, mê chơi quá nên giờ chưa ra đc :(

Anhvo

Hehe, ráng lên nhé! Anhvo thì giờ ra trường rồi nhưng chưa có pằng :D

fandung

ờ, chúc mừng Anhvo :D

MegaMovies

anh ơi cho em hỏi làm sao chỉnh được độ dài ngắn của đoạn văn bản ?



☺ Các bạn có thể viết lời bình của mình cho bài viết, và tuân thủ một số quy tắc sau:
» Các bài comment phải nghiêm túc, không dung tục, không spam.
» Nội dung phải liên quan tới chủ đề bài viết.
» Có thể sử dụng thẻ trích dẫn [quote], cấu trúc thẻ như bên dưới :

[quote=AUTHOR name=fdquote]NỘI DUNG[/quote]

» Có thể sử dụng các thẻ <b>,<i>,<a>.


BlOg FD chính thức đóng comment của khách ẩn danh.

BlOg FD.

[▼/▲] More Emoticons
:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Newer Posts Older Posts Home