Tùy chỉnh rút gọn bài viết blog như ý

Các bạn thấy phần "Đọc thêm" (readmore) mình đẹp chứ. Các bạn có tùy chỉnh độ lớn và màu chữ theo ý thích nè, nó hoàn toàn tự động rút gọn bài đấy. Cách thực hiện như sau:




Vào thiết kế>>>Chỉnh sửa HTML, chèn đoạn code sau trước </head>
(bấm Ctrl+F kiếm /head cho nhanh)

<script language='javascript' src='http://sites.google.com/site/love4all1080/Home/jquery-1.2.3.pack.txt?attredirects=0' type='text/javascript'/>
<script language='javascript' src='http://sites.google.com/site/love4all1080/Home/jquery.extractor.txt?attredirects=0' type='text/javascript'/>

<script type='text/javascript'>
$(document).ready(function() {

$('.excerpt').expander({
slicePoint: 450, // default is 100
expandEffect: 'fadeIn',
expandText: '', // default is '....'
userCollapseText: '[^]' // default is '[collapse expanded text]'
});

});
</script>

Lưu lại. Rồi tiếp tục chọn ô Mở rộng Mẫu Tiện ích, kiếm đọan sau

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

bấm Ctrl + F, kiếm data:post.body sẽ nhanh hơn

Ta xóa đoạn đó, thay vào code nà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>
<a expr:href="data:post.url">Đọc Thêm....</a>
<b:else/>
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</b:if>

Lưu là ok ra xem blog thấy gọn gàng hơn 

Giờ sẽ chỉ các bạn tùy chỉnh chữ Đọc Thêm . Chúng ta chỉ chỉnh sửa dòng sau ko cần chỉnh nguyên đọan,à nếu ko thích chữ đọc thêm thì xóa chữ đó gõ gì tùy thích

<a expr:href="data:post.url">Đọc Thêm....</a>

- Theo cách trên thì khi bấm vào "Đọc thêm" thì bài load trang vừa bấm, để khi bấm vào thì mở trang mới ta xóa code trên copy dòng này

<a expr:href='data:post.url' target='_blank'>Đọc thêm...</a>

Lưu ok

- Giờ chỉnh kích cỡ lớn nhỏ, Tô đen code cần chỉnh trên, copy paste code này. Ở cái phần 100% là chỗ tùy ý tăng giảm chữ theo mong muốn. Ví dụ: chữ nhỏ thì chọn 90%, lớn thì 120% vậy đó

<span style='font-size:100%;'><a expr:href='data:post.url'>Đọc Thêm....</a></span>

- ÁP dụng 2 cái cùng lúc

<span style="font-size:100%;"><a expr:href='data:post.url' target='_blank'>Đọc thêm...</a></span>

-  Giờ ta sẽ thêm màu chữ, để dc màu thì chọn Phần đăng bài mới mục Viết ta gõ chữ bất kì tô đen lên màu rồi sang Chỉnh sửa HTML sẽ hiện dòng màu Ví du tớ làm màu cam, đây là mã tớ có dc ở phần đăng bài, có thể làm gì tùy thích

<span style="color: #f1c232;">Đọc thêm...</span>

Về thiế kế chỉnh sửa nào, mã trước của chúng ta là đoạn này

<a expr:href="data:post.url">Đọc Thêm....</a>

giờ thêm màu vào

<a expr:href="data:post.url"><span style="color: #f1c232;">Đọc thêm...</span></a>

Tèng téng teng chữ màu xanh quen thuộc đã màu cam như ý muốn

- Áp dụng 3 cách trên cùng lúc

<span style="font-size:100%;"><a expr:href='data:post.url' target='_blank'><span style="color: #f1c232;">Đọc thêm...</span></a></span>

Đoạn code trên có chữ đậm rồi đó, đây mã đậm, nếu ko thích đậm thì xóa

<b:if cond='data:blog.pageType != "item"'></b:if>

  nhớ lưu lại sau khi làm. Good luck . Tham khảo thêm cách nâng cao khác
http://forum.bloggervn.tk/t48-topic#143