Ẩn hiện bài viết khi click vào button
Với thủ thuật này blog của bạn sẽ trở nên khác biệt hơn so với các blog khác. Bình thường các bài viết ẩn nhưng với thủ thuật này mặc định ta sẽ cho bài ẩn đi, và sẽ được hiển thị khi ta click vào button. Và ở thủ thuật này mình chỉ làm ẩn phần body của bài viết mà thôi. Đây là một ứng dụng từ thủ thuật "Ẩn hiện widget" mà mình đã đăng.
Các bạn hãy xem các hình minh họa bên dưới để thấy rõ hơn tiện ích.
Hình minh họa:
Trước khi bấm vào nút xem bài.
Ẩn hiện bài viết khi click vào button
Sau khi ấn vào xem bài.
☼ Bây giờ ta đi vào thủ thuật:
1. Vào bố cục
2. Vào chỉnh sửa code HTML
3. Nhấp chọn mở rộng mẫu tiện ích
4. Tìm đoạn code như bên dưới:
<b:if cond='data:post.title'>

<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>

</b:if>
5. Thêm đoạn code màu đỏ vào như bên dưới:
<b:if cond='data:post.title'>

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<script type='text/javascript'>
//<![CDATA[
if(typeof(rnd) == 'undefined') var rnd = '';
rnd = Math.floor(Math.random()*1000);
rnd = 'id-' + rnd;
document.write('<a
 href="#" onclick="tmp = document.getElementById(&quot;' + rnd + 
'&quot;); tmp.style.display = (tmp.style.display == 
&quot;none&quot;) ? &quot;block&quot; : 
&quot;none&quot;; return false;" 
style="float:left;margin-right:5px;">');
//]]>
</script>[&#9660;]
<script type='text/javascript'>
//<![CDATA[
document.write('</a>');
//]]>
</script>

</b:if>

<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>

</b:if>
6. Tiếp tục xuống dưới tìm đoạn code sau:
<data:post.body/>
7. Vào thay thế nó bằng code bên dưới :
<b:if cond='data:blog.url == data:blog.homepageUrl'>

<script type='text/javascript'>
//<![CDATA[
document.write('<div id="' + rnd + '" style="display:none;">');
//]]>
</script>

<data:post.body/>

<script type='text/javascript'>
//<![CDATA[
document.write('</div>');
//]]>
</script>

<b:else/>
<data:post.body/>
</b:if>
- Lưu ý: đối với các blog có tiện ích "Readmore..." thì các bạn di chuyển code của nó vào sau dòng code <data:post.body/> , giống như bên dưới:
<b:if cond='data:blog.url == data:blog.homepageUrl'>

<script type='text/javascript'>
//<![CDATA[
document.write('<div id="' + rnd + '" style="display:none;">');
//]]>
</script>

<data:post.body/>
{Code của thủ thuật readmore}
<script type='text/javascript'>
//<![CDATA[
document.write('</div>');
//]]>
</script>

<b:else/>
<data:post.body/>
{Code của thủ thuật readmore}
</b:if>
Code của thủ thuật readmore có dạng như bên dưới:
<span class='rmlink'><a expr:href='data:post.url'/>Read more...</span>
8. Save template.

- Lưu ý: thủ thuật này mình chỉ cho phép hiển thị ở trang chủ, nếu các bạn muốn hiển thị thủ thuật này ở tất cả các trang (trừ bài viết) thì các bạn thay đổi code như bên dưới:
Đổi dòng:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Thành
<b:if cond='data:blog.pageType != "item"'>
Chúc thành công!
Nguồn: Fandung.com