Sitemap Based Ajax - Thêm một mẫu sitemap mới cho Blogger

Like Rê chuột vào nút Like để chọn biểu tượng cảm xúc
Загрузка...
Sơ đồ trang web là phải có trang cho mỗi blog, nó có thể giúp cải thiện điều hướng blog của bạn và cũng để giảm tỷ lệ trả lại của blog.
Hôm nay lại thêm một SITEMAP nữa từ các Blog nước ngoài mang về cho các bạn.
Sitemap Based Ajax này sẽ cho thấy một danh sách các bài viết về trình tự đã xuất bản mới nhất theo từng loại. Các bạn xem hình Demo bên dưới nha!

Sitemap Based Ajax - Thêm một mẫu sitemap mới cho Blogger

Thực hiện
Bước 1: Các bạn vào Blog > Chủ đề > Chỉnh sửa Template và dán đoạn code sau lên trên thẻ đóng </head>
<style type='text/css'>
.btnt-sitemap { border-bottom: 4px solid #444; }
.btnt-toc-wrap { display: inline-block; font-family: "Century Gothic",sans-serif; width: 100%; }
.btnt-toc-wrap .btnt-cat { background: #333; border-radius: 2px; color: #fff; font-size: 15px; font-weight: bold; padding: 10px 20px; text-transform: capitalize; }
.btnt-toc::before { background: #333; bottom: 0; content: ""; left: 20%; margin-left: -10px; position: absolute; top: 0; width: 4px; }
.btnt-toc { margin: 0; padding: 30px 20px; position: relative; }
.btnt-toc li { list-style: none; margin: 0; padding: 0; position: relative; }
.btnt-toc > li .toc-date { color: #999; display: block; font-size: 14px; font-weight: bold; position: absolute; text-transform: uppercase; top: 25px; width: 15%; }
.btnt-toc > li .btnt-icon { background: #fff; border-radius: 50%; box-shadow: 0 0 0 4px #333; color: #fff; font-size: 1.4em; font-style: normal; font-variant: normal; font-weight: normal; height: 10px; left: 20%; line-height: 10px; margin: 0 0 0 -25px; position: absolute; text-align: center; text-transform: none; top: 30px; width: 10px; }
.btnt-toc > li .btnt-post::after { border-color: transparent #f5f5f5 transparent transparent; border-style: solid; border-width: 10px; content: " "; height: 0; pointer-events: none; position: absolute; right: 100%; top: auto; width: 0; }
.btnt-toc > li .btnt-post { background: #f5f5f5; border-radius: 5px; display: block; font-size: 15px; line-height: 15px; margin: 0 0 15px 23%; padding: 25px 30px; position: relative; }
.btnt-toc > li .btnt-post a { color: #333; font-weight: bold; }
.btnt-toc > li .btnt-post a:hover { color: #999; }
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js' type='text/javascript'/><b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<script type='text/javascript'>
  /*<![CDATA[*/
$(document).ready(function(){var static_page_text=$.trim($(".post-body").text());var text_month=[,"Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sept","Oct","Nov","Dec"];if(static_page_text==="[sitemap]"){var postbody=$(".post-body");$.ajax({url:"/feeds/posts/default?alt=json-in-script",type:"get",dataType:"jsonp",success:function(e){var t=[];for(var n=0;n<e.feed.category.length;n++){t.push(e.feed.category[n].term)}var t=t.join("/");postbody.html('<div class="btnt-sitemap"></div>');$(".post-body .btnt-sitemap").text(t);var r=$(".btnt-sitemap").text().split("/");var i="";for(get=0;get<r.length;++get){i+="<span>"+r[get]+"</span>"}$(".btnt-sitemap").html(i);$(".btnt-sitemap span").each(function(){var e=$(this);var t=$(this).text();$.ajax({url:"/feeds/posts/default/-/"+t+"?alt=json-in-script",type:"get",dataType:"jsonp",success:function(n){var r="";var i='<ul class="btnt-toc">';for(var s=0;s<n.feed.entry.length;s++){for(var o=0;o<n.feed.entry[s].link.length;o++){if(n.feed.entry[s].link[o].rel=="alternate"){r=n.feed.entry[s].link[o].href;break}}var u=n.feed.entry[s].title.$t;var a=n.feed.entry[s].published.$t,f=a.substring(0,4),l=a.substring(5,7),c=a.substring(8,10),h='<span class="day">'+c.replace(/^0+/,"")+'</span><span class="month">'+text_month[parseInt(l,10)]+' </span><span class="year">'+f+"</span>";i+='<li><div class="toc-date">'+h+'</div><div class="btnt-icon"></div><span class="btnt-post"><a href="'+r+'">'+u+"</a></span></li>"}i+="</ul>";e.replaceWith('<div class="btnt-toc-wrap"><div class="btnt-cat">'+t+'</div>'+i+"</div>")}})})}})}});
  /*]]>*/
</script>
</b:if>
Chú ý: Các bạn để ý phần mình đã bôi đỏ, nếu các bạn có thư viện này rồi thì xóa nó đi.

Bước 2: Các bạn vào Trang > Trang mới > HTML và thêm đoạn code hiển thị đơn giản sau vào
[sitemap]
Sitemap Based Ajax - Thêm một mẫu sitemap mới cho Blogger

Xuất bản và xem kết quả. Chúc các bạn thành công!
Nguồn: blogtipstricks

Đăng nhận xét

9 Nhận xét

» Hướng dẫn nhúng hình ảnh: chỉ cần sử dụng link ảnh dán vào, vd: http://domain.com/image.png
» Tham trang khảo ảnh động cực cute: Qoobee
» Hướng dẫn nhúng link trang web: <a href="url" rel="nofollow">Link</a>
» Không chửi tục, nói bậy, quảng cáo thông qua khung Comment.
» Không spam link, chia sẻ các link không liên quan đến bài viết.
» Không xuyên tạc, bôi nhọ tổ chức hay cá nhân nào.
» Mọi bình luận sai nội quy sẽ bị xóa mà không cần báo trước. Xem thêm...

  1. huynhngoctinhit.tk
    liên kết
    đã đặt <3

    Trả lờiXóa
    Trả lời
    1. Trên trình duyệt Chrome mình ko truy cập được Blog của bạn. Bạn xem lại hộ mình nha!

      Xóa
    2. itngoctinhchannel.blogspot.com
      k đc thì lên google search Ngọc Tính IT

      Xóa
    3. Ok xem thì đc đấy nhưng vấn đề là blog bạn nhiều viruss đấy. Bạn nên kiểm tra lại temp của mình.

      Xóa
  2. blog tôi bị vấn đề tường lửa thôi chứ c chẳng có j

    Trả lờiXóa
  3. . liên kết k chú
    Tên : Văn Huy IT
    Url : http://www.vanhuyy-it.tk/

    Trả lờiXóa
Loading...