Sitemap là gì?
Sitemap là sơ đồ trang web tập hợp tất cả URL bài viết và các dữ liệu liên quan trong đó của một website. Nó như một phương tiện hữu ích giúp các Web Master thông báo tới các bộ máy chủ tìm kiếm thu thập thông tin. (Chủ yếu là Google) có thể thu thập và xử lý thông tin 1 chính xác và nhanh chóng... vân vân và mây mây.
Sitemap là dạng tệp tin có đuôi .XML "ở blogger mặc định thì nó là blog-của-bạn.blogspot.com/atom.xml ngoài ra chúng ta còn có thể lập Sitemap thông qua các website vệ tinh ~~" Ví dụ: https://www.xml-sitemaps.com/
Ở bài viết này, tôi sẽ chia sẻ cho các bạn những mẫu SITEMAP làm đẹp thêm cho Blogspot. (chủ yếu là tôi đi lượn lờ lượm lặt tổng hợp lại :D) cái này là tạo Sitemap trên trang tĩnh blogspot của bạn mà thôi chứ k phải là lập xxName+SiteMap.XML gì đâu. (Nó kiểu tương tự như một tiện ích hiển thị các tất cả bài viết từ đầu cho tới cuối) dạng Recent posts hay Last Posts...
Cách tạo một mẫu SITEMAP cho Blogspot
1. Đăng nhập vào blogger.com và đi tới phần Trang → tạo Trang Mới
2. Đặt tên Trang sau đó chuyển qua tab HTML và Copy những Code tạo mẫu Sitemap ở dưới đây Paste chúng vào.
3. Thay đổi địa chỉ blog (nếu có) thành URL Blog của bạn.
▬ Ví dụ: ở Sitemap Style 1 "https://demo1-longkool.blogspot.com" thay thế nó bằng LINK URL BLOG của bạn và nhớ bỏ WWW đi nha. Ở những mẫu Sitemap nào không có thì thôi.
Sitemap là sơ đồ trang web tập hợp tất cả URL bài viết và các dữ liệu liên quan trong đó của một website. Nó như một phương tiện hữu ích giúp các Web Master thông báo tới các bộ máy chủ tìm kiếm thu thập thông tin. (Chủ yếu là Google) có thể thu thập và xử lý thông tin 1 chính xác và nhanh chóng... vân vân và mây mây.
Sitemap là dạng tệp tin có đuôi .XML "ở blogger mặc định thì nó là blog-của-bạn.blogspot.com/atom.xml ngoài ra chúng ta còn có thể lập Sitemap thông qua các website vệ tinh ~~" Ví dụ: https://www.xml-sitemaps.com/
Ở bài viết này, tôi sẽ chia sẻ cho các bạn những mẫu SITEMAP làm đẹp thêm cho Blogspot. (chủ yếu là tôi đi lượn lờ lượm lặt tổng hợp lại :D) cái này là tạo Sitemap trên trang tĩnh blogspot của bạn mà thôi chứ k phải là lập xxName+SiteMap.XML gì đâu. (Nó kiểu tương tự như một tiện ích hiển thị các tất cả bài viết từ đầu cho tới cuối) dạng Recent posts hay Last Posts...
| Tổng Hợp Những Mẫu SITEMAP Đẹp Cho Blogspot Và Cách Làm Chúng |
Cách tạo một mẫu SITEMAP cho Blogspot
1. Đăng nhập vào blogger.com và đi tới phần Trang → tạo Trang Mới
2. Đặt tên Trang sau đó chuyển qua tab HTML và Copy những Code tạo mẫu Sitemap ở dưới đây Paste chúng vào.
3. Thay đổi địa chỉ blog (nếu có) thành URL Blog của bạn.
▬ Ví dụ: ở Sitemap Style 1 "https://demo1-longkool.blogspot.com" thay thế nó bằng LINK URL BLOG của bạn và nhớ bỏ WWW đi nha. Ở những mẫu Sitemap nào không có thì thôi.
https://www.yourdomain.blogspot.com/ → https://yourdomain.com/ {alertWarning}
Style 1
{codeBox} <!-- url : https://www.longkool.com --> <style type="text/css"> #toc{width:99%;margin:5px auto;border:1px solid #2D96DF; -webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); -moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);} .labl{color:#FF5F00;font-weight:bold;margin:0 -5px; padding:1px 0 2px 11px;background: #3498DB; border:1px solid #2D96DF; border-radius:4px;-moz-border-radius:4px; -webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb; -moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;} .labl a{color:#fff;} .labl:first-letter{text-transform:uppercase;}a .new{color:#FF5F00;font-weight:bold;font-style:italic;} .postname{font-weight:normal;background:#fff;margin-left: 35px;} .postname li{border-bottom: #ddd 1px dotted;margin-right:5px} </style> <br /> <div id="toc"> <script src="https://cdn.jsdelivr.net/gh/longkool/Blogger-Tips@master/sitemap1.min.js" type="text/javascript"></script> <script src="https://demo1-longkool.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"> </script></div>
Style 2
{codeBox} <!-- url : https://www.longkool.com --> <style type="text/css"> .tabbed-toc {margin:0 auto;background-color:#2f77bd;box-shadow: 0 0 7px rgba(5, 5, 5, 0.34);overflow:hidden; position:relative;color:#333;border: 1px solid #9C9C9C;} .tabbed-toc .loading {display:block;padding:10px 12px;font:normal bold 12px/normal Helmet,FreeSans,Sans-Serif; color:white;} .tabbed-toc ul,.tabbed-toc ol,.tabbed-toc li {margin:0;padding:0;list-style:none;} .tabbed-toc .toc-tabs {width:20%;float:left;} .tabbed-toc .toc-tabs li a {display:block;font:normal bold 12px/28px Helmet,Freesans,Sans-Serif;overflow:hidden;text-overflow:ellipsis;color:#fff;text-transform:uppercase;text-decoration:none; padding:7px 15px;cursor:pointer;box-shadow: 0px 1px 1px rgb(255, 255, 255);} .tabbed-toc .toc-tabs li a:hover {background-color:#4086E0;color:white;box-shadow: 0 0 7px rgba(0,0,0,.7);} .tabbed-toc .toc-tabs li a.active-tab {background-color:#FFF;color:black;box-shadow: 0 0 7px rgba(0,0,0,.7); z-index:5;margin:0 -1px 0 0;/* cursor:text; */} .tabbed-toc .toc-content,.tabbed-toc .toc-line {width:80%;float:right;background-color:white;border-left:5px solid #1E84BC;box-sizing:border-box;} .tabbed-toc .toc-line {float:none;display:block;position:absolute;top:0;right:0;bottom:0;box-shadow:0 0 7px rgba(0,0,0,.7);} .tabbed-toc .panel {position:relative;z-index:5;font:normal normal 10px/normal Helmet,FreeSans,Sans-Serif;} .tabbed-toc .panel li a {display:block;position:relative;font-weight:bold;font-size:12px;color:#000;line-height:20px;padding: 10px 12px; text-decoration:none;outline:none;overflow:hidden;} .tabbed-toc .panel li time {display:block;font-style:italic;font-weight:normal;font-size:10px;color:#666;float:right;} .tabbed-toc .panel li .summary {display:block;padding:10px 12px 10px;font-style:italic; border-bottom:4px solid #275827;overflow:hidden;} .tabbed-toc .panel li .summary img.thumbnail {float:left;display:block;margin:0 8px 0 0;padding:4px; width:72px;height:72px;border:1px solid #dcdcdc;background-color:#fafafa;} .tabbed-toc .panel li:nth-child(even) {background-color:#66A9FF} .tabbed-toc .panel li a:hover,.tabbed-toc .panel li a:focus,.tabbed-toc .panel li a:hover time,.tabbed-toc .panel li.bold a { background-color:#333;color:white;outline:none;} .tabbed-toc .panel li.bold a:hover, .tabbed-toc .panel li.bold a:hover time {background-color:#222} .post ol li::before {content: none;} .post ol li {margin:0;} @media (max-width:700px) { .tabbed-toc {border:2px solid #333} .tabbed-toc .toc-tabs,.tabbed-toc .toc-content {overflow:hidden;width:auto;float:none;display:block;} .tabbed-toc .toc-tabs li {display:inline;float:left;} .tabbed-toc .toc-tabs li a,.tabbed-toc .toc-tabs li a.active-tab {background-color:#2f77bd;box-shadow:2px 0 7px rgba(0,0,0,.4);} .tabbed-toc .toc-tabs li a.active-tab {background-color:white;color:#333;} .tabbed-toc .toc-content {border:none} .tabbed-toc .toc-line, .tabbed-toc .panel li time {display:none} .tabbed-toc .panel li a{height: auto;} </style> <div class="tabbed-toc" id="tabbed-toc"> <span class="loading">Memuat…</span></div> <script> var tabbedTOC = { blogUrl: "/", // Blog URL containerId: "tabbed-toc", // Container ID activeTab: 1, // The default active tab index (default: the first tab) showDates: false, // `true` to show the post date showSummaries: false, // `true` to show the posts summaries numChars: 200, // Number of summary chars showThumbnails: false, // `true` to show the posts thumbnails (Not recommended) thumbSize: 40, // Thumbnail size noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC", // A "no thumbnail" URL monthNames: [ // Array of month names "Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember" ], newTabLink: true, // Open link in new window? maxResults: 99999, // Maximum post results preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload") sortAlphabetically: true, // `false` to sort posts by published date showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked newText: ' – <em style="color:red;">New!</em>' // HTML for the "New!" text }; </script> <script src="https://cdn.jsdelivr.net/gh/longkool/Blogger-Tips@master/sitemap2.min.js" type="text/javascript"></script>
Style 3
{codeBox} <!-- url : https://www.longkool.com --> <style> .toc-header-col1, .toc-header-col2, .toc-header-col3{padding: 10px;background: #d6d6d6;} .toc-entry-col1, .toc-entry-col2, .toc-entry-col3 { background: #e7e7e7; color: #fff; padding: 10px; font-weight: 400; } .toc-note{display:none} .toc-entry-col1 a, .toc-entry-col2 a, .toc-entry-col3 a{font-size: 15px;font-weight:500} .toc-entry-col2{font-size: 14px;background: #999;} .toc-entry-col3{background: #555;} .toc-entry-col3 a{color: #fff;}</style> <div id='bp_tocm'> <div id='bp_toc'> <script src="https://cdn.jsdelivr.net/gh/longkool/Blogger-Tips@master/sitemap5.min.js" type="text/javascript"></script> <script src='/feeds/posts/summary?alt=json-in-script&max-results=500&callback=loadtoc' type='text/javascript'></script> </div> </div>
Style 4
{codeBox} <!-- url : https://www.longkool.com --> <div id="recentpostsae"> </div> <div id="recentpostnavfeed"> </div> <style scoped="" type="text/css"> *{padding:0;margin:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-box-sizing:border-box} a,a:link,a:visited{text-decoration:none;transition:all .3s} button,input[type="button"],input[type="reset"],input[type="submit"],.button{border:0;color:#fff;cursor:pointer;font-size:14px;font-weight:400;padding:12px 16px;white-space:normal;width:auto;border-radius:3px;outline:0}button:focus,button:hover,input[type="button"]:focus,input[type="button"]:hover,input[type="reset"]:focus,input[type="reset"]:hover,input[type="submit"]:focus,input[type="submit"]:hover,.button:focus,.button:hover{color:#fff} #recentpostnav{border:1px solid #585858;width:100%;margin:0 auto} #recentpostsae{margin:0} #recentpostsae .recentpostel{width:48.9%;background:#fff;display:inline-block;margin:0 20px 10px 0;padding:15px;overflow:hidden;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)} #recentpostsae .recentpostel:nth-child(even){margin:0 0 10px 0} #recentpostsae .recentpostel img{background:#ecf0f1;padding:0;float:left;margin:0;margin-right:13px;width:72px} #recentpostsae .recentpostel h6,.recentpostel h6 a{text-decoration:none;font-size:14px;font-weight:400;margin:0;color:#000} #recentpostsae .recentpostel:hover{background-color:#fefefe} #recentpostsae .recentpostel p{font-size:12px;text-align:left;color:#555;line-height:normal;margin:5px 0} #recentpostload{letter-spacing:-10px;text-align:center;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhY5C_kzslNew27uoNMv3_8ar42tbwAgEZ4dyZ_yyRolljKI-5-BadCXOZLdbWZjFoP0mC1PYFQDL3vRG-5asu2rTCxPwCDienbG7lrUhpmtrWV7pFWUuBlykuKigudIMauex6T8k0otGPA/s1600/ellipsis-preloader.gif) no-repeat 50% 50%;height:470px} #recentpostnavfeed{display:table;padding:5px 10px 5px 0;text-align:left;margin:15px auto} #recentpostnavfeed a{color:#141414;font-size:12px;font-weight:400;display:block;padding:5px 10px} #recentpostnavfeed span{padding:0;cursor:pointer;transition:all .3s} #recentpostnavfeed .next,#recentpostnavfeed .previous{position:relative;overflow:hidden;display:inline-block;background:#fff;color:#222;padding:10px 16px;font-size:1rem;border-radius:99em;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)} #recentpostnavfeed .next{float:right;margin:0 0 0 10px} #recentpostnavfeed .previous{float:left;margin:0 10px 0 0} #recentpostnavfeed .home{text-align:center;display:table;background:#fff;color:#222;font-size:1rem;float:none;padding:10px 16px;border-radius:99em;margin:auto;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)} #recentpostnavfeed a:hover,#recentpostnavfeed span.noactived{color:#ccc} #recentpostnavfeed i{font-family:fontawesome;font-style:normal} #recentpostnavfeed .next:hover,#recentpostnavfeed .previous:hover,#recentpostnavfeed .home:hover{background:#fff;color:#222;box-shadow:0 10px 21px rgba(0,0,0,0.15),0 6px 6px rgba(0,0,0,0.12)} @media screen and (max-width:993px){#recentpostsae .recentpostel{width:100%;margin:0 0 10px 0}} </style> <script type='text/javascript'> //<![CDATA[ var numfeed = 8; var startfeed = 0; var urlblog = "https://demo4-longkool.blogspot.com"; var charac = 0; var urlprevious, urlnext; function arlinafeed(e,t){for(var n=e.split("<"),r=0;r<n.length;r++)-1!=n[r].indexOf(">")&&(n[r]=n[r].substring(n[r].indexOf(">")+1,n[r].length));return n=n.join(""),n=n.substring(0,t-1)}function showrecentpostsae(e){var t,n,r,a,i,s="";urlprevious="",urlnext="";for(var l=0;l<e.feed.link.length;l++)"previous"==e.feed.link[l].rel&&(urlprevious=e.feed.link[l].href),"next"==e.feed.link[l].rel&&(urlnext=e.feed.link[l].href);for(var d=0;d<numfeed&&d!=e.feed.entry.length;d++){t=e.feed.entry[d],n=t.title.$t;for(var l=0;l<t.link.length;l++)if("alternate"==t.link[l].rel){r=t.link[l].href;break}i="content"in t?t.content.$t:"summary"in t?t.summary.$t:"",a="media$thumbnail"in t?t.media$thumbnail.url:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiakRFt2cb7EVQmQNUmRNIsqv_qJKkzp5M_ffpdLzHieCZWrlPRPhy8A-wVOoZauC2tqChSr4Ly4WUGHVt3ymGOQEC7lT0oVCrjgWsTqtwoAoCiRuhXCXmCskXzX8_UimY7Cj3mMw8LVdkd/s1600/no-image.png",s+="<div class='recentpostel'>",s+="<a href='"+r+"'><img src='"+a+"' /></a>",s+="<h6><a href='"+r+"'>"+n+"</a></h6>",s+="<p>"+arlinafeed(i,charac)+"</p>",s+="</div>"}document.getElementById("recentpostsae").innerHTML=s,s="",s+=urlprevious?"<a href='javascript:navigasifeed(-1);' class='previous'><i class='fas fa-arrow-left'></i></a>":"<span class='noactived previous'><i class='fas fa-arrow-left'></i></span>",s+=urlnext?"<a href='javascript:navigasifeed(1);' class='next'><i class='fas fa-arrow-right'></i></a>":"<span class='noactived next'><i class='fas fa-arrow-right'></i></span>",s+="<a href='javascript:navigasifeed(0);' class='home'><i class='fas fa-home'></i></a>",document.getElementById("recentpostnavfeed").innerHTML=s}function navigasifeed(e){var t,n;-1==e?(t=urlprevious.indexOf("?"),n=urlprevious.substring(t)):1==e?(t=urlnext.indexOf("?"),n=urlnext.substring(t)):n="?start-index=1&max-results="+numfeed+"&orderby=published&alt=json-in-script",n+="&callback=showrecentpostsae",incluirscript(n)}function incluirscript(e){1==startfeed&&removerscript(),document.getElementById("recentpostsae").innerHTML="<div id='recentpostload'></div>",document.getElementById("recentpostnavfeed").innerHTML="";var t=urlblog+"/feeds/posts/default/"+e,n=document.createElement("script");n.setAttribute("type","text/javascript"),n.setAttribute("src",t),n.setAttribute("id","arlinalabel"),document.getElementsByTagName("head")[0].appendChild(n),startfeed=1}function removerscript(){var e=document.getElementById("arlinalabel"),t=e.parentNode;t.removeChild(e)}onload=function(){navigasifeed(0)}; //]]> </script>
Style 5
{codeBox} <!-- url : https://www.longkool.com --> <style> #bp_toc{background:#1ABC9C;color:#666;margin:0 auto;padding:4px;} span.toc-note{padding:20px;margin:0 auto;display:block;text-align:center;color:rgba(255,255,255,.5);font-size:1.6rem;text-transform:uppercase;font-weight:700;line-height:normal} .toc-header-col1 {padding:10px;background-color:#f5f5f5;width:250px;} .toc-header-col2 {padding:10px;background-color:#f5f5f5;width:75px;} .toc-header-col3 {padding:10px;background-color:#f5f5f5;width:125px;} #bp_toc td.toc-header-col1,#bp_toc td.toc-header-col2,#bp_toc td.toc-header-col3{border:0;border-bottom:1px solid rgba(0,0,0,0.1);} #bp_toc tr:nth-child(1) a {color:#666;} #bp_toc td.toc-header-col1{background-color:#fff;} #bp_toc td.toc-header-col2{background-color:#fff;} #bp_toc td.toc-header-col3{background-color:#fff;} #bp_toc td.toc-entry-col1,#bp_toc td.toc-entry-col2,#bp_toc td.toc-entry-col3{border:0} #bp_toc td.toc-entry-col1{background-color:#fff;font-weight:700} #bp_toc tr:nth-child(odd) td.toc-entry-col1{background-color:#f8f8f8} #bp_toc td.toc-entry-col2{background-color:#fff;} #bp_toc tr:nth-child(odd) td.toc-entry-col2{background-color:#f8f8f8} #bp_toc td.toc-entry-col3{background-color:#fff;} #bp_toc tr:nth-child(odd) td.toc-entry-col3{background-color:#f8f8f8} #bp_toc td a{color:#666;} .toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {font-size:13px; text-decoration:none;color:#aaa;font-family:'Roboto';font-weight:700;letter-spacing: 0.5px;} .toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {text-decoration:none;} .toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {background:#fdfdfd;padding:5px;padding-left:5px;font-size:89%} .toc-entry-col1 a, .toc-entry-col2 a, .toc-entry-col3 a{color:#666;font-size:13px;} .toc-entry-col1 a:hover, .toc-entry-col2 a:hover, .toc-entry-col3 a:hover{color:#cdb280;} #bp_toc table {width:100%;margin:0 auto;counter-reset:rowNumber;} .toc-entry-col1 {counter-increment:rowNumber;} #bp_toc table tr td.toc-entry-col1:first-child::before {content: counter(rowNumber);min-width:1em;margin-right:0.5em;} </style> <div id="bp_toc" style="max-height: 660px; overflow-x: auto; overflow: scroll;"></div> <script src="https://cdn.jsdelivr.net/gh/longkool/Blogger-Tips@master/sitemap5.min.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&max-results=9999&callback=loadtoc" type="text/javascript"></script>
Lưu ý: các bạn phải nhớ đổi địa chỉ blog thành URL Blog của bạn nha. và những mẫu Sitemap trên có CSS có thể bị trùng với CSS trong blog của bạn. dẫn đến Sitemap bị vỡ lệch. Các bạn cần chỉnh lại đôi chút :)) {alertWarning}
Chúc Các Bạn Thành Công! :))
Tags:
Blogger Tutorials







up https://www.facebook.com/ zczzxczxczxc
ردحذفUpppppppppp
ردحذف1 số cái lỗi k áp dụng dk bác ak
ردحذفCái nào lỗi vậy bạn. để mình fix
حذف