Hua Minh Toan-Blog Chia Se

* Các bạn có thể Chat cộng đồng tại đây => Click
Chia sẽ cảm xúc, thủ thuật...

Thêm Recent Posts bài mới nhất vào dưới mỗi bài viết trong blog

Bạn nào đang dùng sense blogger template mà Tuấn đã share nếu muốn thêm  Recent Posts hay gọi là các bài viết mới nhất vào cuối bài đăng trong blog. Áp dụng phương pháp này giúp người đọc tiếp cận bài mới nhanh hơn hơn nữa không phải thêm widget.


Đầu tiên các bạn đăng nhập vào blog chuyển đến phần Mẫu chỉnh sửa HTML nhấn tổ hợp phím Ctrl+F tìm đoạn mã <data:post.body/> và thêm đoạn code vào dưới thẻ </span> như hình


<p class='title title-medium'>
 <h2><span>Tin mới đăng</span></h2>
</p>                                                    
<style scoped='' type='text/css'>
ul#recent-posts{list-style:none;margin:0;padding:0}li.recent-posts{display:block;clear:both;overflow:hidden;list-style:none;border-bottom:1px solid #fff;word-break:break-word;padding:10px 0;margin:0;}
li.recent-posts:last-child{border-bottom:0;}
li.recent-posts a{color:#0078d7;text-decoration:underline}li.recent-posts a:hover{color:#0078d7;text-decoration:underline}
</style>
<ul id='recent-posts'/>
<script>
//<![CDATA[
var homePage = "https://blogthuthuatwin10.blogspot.com/",
numPosts = 5;
function recentPosts(a){if(document.getElementById("recent-posts")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("recent-posts");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<li class="recent-posts"><a href="'+link+'" title="'+title+'" target="_blank" rel="nofollow">'+title+'</a></li>'}ct.innerHTML=content}}var rcp=document.createElement('script');rcp.src=homePage+'/feeds/posts/summary?alt=json-in-script&orderby=published&max-results='+numPosts+'&callback=recentPosts';document.getElementsByTagName('head')[0].appendChild(rcp);
//]]>
</script> 

Thay link Blog màu đỏ bằng link blog của bạn rồi lưu template lại

Để thu nhỏ kích thước dòng tiêu đề Tin mới đăng tìm dòng /* heading */ và sửa thành h2{font-size:120% là xong.

Share on Google Plus

Thông Tin: Unknown

Xin chào tất cả các bạn, cảm ơn tất cả mọi người đã ghé thăm Blogs của Toàn, Mình là dân công nghệ nên rất đam mê tìm tòi nghiên cứu nhiều thứ về công nghệ để chia sẽ và Support cho nhiều người, "nếu cần tôi giúp đỡ điều gì hãy để lại Comment " hoặc qua Zalo: 01885533411! Thân chào.
    Blogger Comment
    Facebook Comment

0 Nhận xét :

Đăng nhận xét