Trước đây, khi nói về cách tạo đoạn trích và read more (đọc tiếp) trên blogspot, các blogger sẽ cảm thấy ngán ngẩm bởi nó không hề đơn giảm và đôi khi phải làm rất thủ công. Đó là điều gây cản trở và tốn thời gian cho các problogger và cũng khó để tạo các trang blogspot chuyên nghiệp hơn.
Tuy vây, CNTT ngày càng phát triển dẫn đến các thủ thuật cũng ngày một nhiều. Điều này cũng đã được phản ánh khá rõ đối với giới blogger đang dùng blogspot của Google. Họ đã có thể thoải mái hơn khi tạo các magazine blog trên chính nền tảng blogger.com mà không bị cản trở nhiều. Tuy nhiên, để so sánh về độ linh hoạt thì chắc blogspot vẫn chưa thể theo kịp WordPress.
Hôm nay, blogviet xin chia sẻ lại một cách mới giúp tạo đoạn trích cho các bài viết một cách hoàn toàn tự động do Bloganol giới thiệu. Nó không khác gì các phương pháp trước đây nhưng theo mình là đơn giản hơn về cài đặt trong thủ thuật này. Hầu hết các phương pháp khó khi triển khai trên blogspot đều phải nhờ đến 1 script bên ngoài và thủ thuật này cũng không phải là ngoại lệ.
Thủ thuật này sẽ tự động rút ngắn các bài viết ở dạng tóm tắt có kèm các hình ảnh thumbnail giống như trên các blog hay trang tin tổng hợp giúp blog của bạn ngày một chuyên nghiệp hơn.
Trước khi triển khai bất kỳ một thủ thuật nào trên blogspot, bạn cần backup cái template hiện tại để phòng khi có điều bất trắc xảy ra trong quá trình triển khai thủ thuật mới nhé.
Bạn vào Edit HTML và tìm đến thẻ sau:
<data:post.body>
Tiếp đó, bạn thay đoạn thẻ trên bằng đoạn code sau:
<b:if cond="’data:blog.pageType">
<div id="’”summary”"><data:post.body></data:post.body></div>
<script type="’text/javascript’">createSummaryAndThumb(”summary<data:post.id/>”);</script>
<span class="’rmlink’" style=""><a href="http://www.blogger.com/%E2%80%99data:post.url%E2%80%99">Read more>></a></span>
</b:if>
<b:if cond="’data:blog.pageType"><data:post.body></data:post.body>
</b:if>
Bây giờ bạn đoạn mã sau vào trước thẻ </head> là xong.
<div class="codeview"><script type="’text/javascript’">
summary_noimg = 450;
summary_img =350;
img_thumb_height = 100;
img_thumb_width = 100;
</script>
<script src="’http://deineshd.110mb.com/read-more_auto.js’" type="’text/javascript’/"></div>
Các bạn có thể thay đổi kích thước của hình ảnh bằng cách thay các chỉ số chiều cao (height) và chiều rộng (width) mặc định hoặc độ dài ngắn của đoạn trích. VD: summary_noimg =450 (đoạn trích không kèm hình ảnh) và summary_img = 350 (đoạn trích có kèm hình ảnh)
Trước khi Save Changes, các bạn nên Preview trước, nếu đã ok thì hãy Save Changes, còn không thì xem lại mình đã làm đúng chưa nhé.
Bạn có thể tải file: http://deineshd.110mb.com/read-more_auto.js và upload lên host nào mà bạn tin tưởng để tránh bị quá tải cho host vì có thể sẽ có nhiều người dùng host này.
Theo BlogViet
0 nhận xét:
Đăng nhận xét