Tôi đã từng thử nhiều cách như hướng dẫn tại các blog khác nhau như quả thật không hề dễ và đôi khi còn làm cho blog của mình bị lỗi và không thể sửa chữa được
Cho dù có dùng thủ thuật gì thì các bạn để phải làm bằng tay cho từng bài viết khi muốn tại một đoạn tóm tắt cho bài viết đó giống như trên WordPress (”Read More”). Đôi khi tôi làm như thế nhưng vẫn hiện ra cả bài và đến khi phải viết trên môi trường html thì mới giải quyết được. Quả thật là nan giải!!!
Công cụ này sẽ mang lại những tính năng sau cho blogger sử dụng Blogger.com làm môi trường viết blog cho mình:
- Chỉ cần 2 bước đơn giản là thêm vào được!
- Độ dài (và các lựa chọn khác) của đoạn trích dẫn/tóm tắt hoàn toàn có thể hiệu chỉnh trong mẫu blog (không cần chỉnh sửa các file JavaScript!)
- Chúng ta có thể mở rộng đoạn trích dẫn/tóm tắt trên cùng trang đó hoặc thêm một link “Đọc cả bài/Đọc tiếp” ở cuối mỗi bài tùy thích.
- Các thẻ HTML và các từ hoàn chỉnh sẽ được giữ đúng trật tự (không giống như nhiều mẫu của WordPress)
- Không càn thêm bất kỳ thẻ bổ sung nào hay chỉnh sửa các bài viết: công cụ này hoạt động ngay tức thì sau khi cài đặt!
- Có thể hiệu chỉnh độ dài của các trích đoạn trong các mẫu dành cho báo trí.
Hướng dẫn cài đặt
Việc cài đặt phụ thuộc nhiều cách mà bạn muốn đoạn trích dẫn/tóm tắt của các bài việt hiển thị như thế nào. Do đó mà sẽ có 2 cách cài đặt để bạn chọn lựa.
Dù bạn chọn cách nào đi chăng nữa, thì kết quả sẽ rất hấp dẫn và chắc chắn hơn hẳn các phương pháp thủ công mà các bạn từng làm trước đây
Hướng dẫn chi tiết: Mở rộng các đoạn trích dẫn/tóm tắt
Phương pháp này là đơn giản nhất giúp các bạn sử dụng blog của blogger.com có khả năng thêm tính năng tự động chèn một đoạn trích dẫn/tóm tắt cho mỗi bài viết trên blog của mình!
Trước hết, đăng nhập vào blogger.com, chọn Layout>Edit HTML trong Blogger Dashboard và đánh dấu vào mục “expand widget templates“.
Sau đó, bạn tìm tới thẻ </head> trong mẫu blog của mình và chèn đoạn code dưới đây ngay trước thẻ </head> này:
Tiếp đó, bạn tìm tới phần có đoạn code như sau (đoạn code này có thể khác nếu bạn dùng các mẫu blog dạng XML. Để dễ dàng tìm được trong mẫu, bạn chỉ cần nhấn tổ hợp phím Ctrl+F và nhập code dưới vào box và nhấn Enter (Chỉ áp dụng khi bạn dùng FireFox thôi nhé):
<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>
Tiếp đó tìm đoạn code sau:
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Nếu bạn sử dụng các mẫu blog phức tạp thì đoạn code này có thể bị thay đổi hoặc điều chỉnh, trong trường hợp không tìm được cả đoạn code trên bạn chỉ cần tìm đoạn code sau:
<data:post.body/>
Hoặc tương tự như sau:
<div class=’post-body’>
<p><data:post.body/></p>
<div style=’clear: both;’/> <!– clear for photos floats –>
</div>
Bạn thay đoạn code tìm được bằng đoạn code đưới đây:
<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>
Bây giờ bạn sẽ xem thử bằng phím Preview ngay bên cạnh phím Save Template.
Khi bạn nhấn chuột vào chỗ [...] thì cả bài viết sẽ được trải rộng ra mà không càn mở trang mới.
Đang cập nhật, xin chờ nhé 19
Chúc các bạn thành công!
Xem DEMO tại http://www.vietad.co.cc

Đang tải xin vui lòng chờ...
0 comments:
Post a Comment
[▼/▲] Chèn biểu tượng vui