 |
Hướng dẫn chi tiết cách tạo sitemap cho blogspot dễ thực hiện |
Trong bài viết này Chia Sẻ Vip sẽ hướng dẫn các bạn cách tạo một trang sitemap cực đẹp trên chính trang Blogspot của các bạn. Điều nên lưu ý ở đây sitemap này không phải là sitemap.xml. Để hiểu rõ hơn các bạn xem tiếp nội dung bên dưới nhé!
Bạn xem demo cụ thể về sitemap của website: https://www.chiasevip.com/
 |
Sơ đồ trang website Chia Sẻ Vip |
Các bước để tạo một sitemap cho trang Blogspot:
Đăng nhập vào trang quản trị và tiến hành tạo trang
Bạn tiến hành đăng nhập và thực hiện tạo một trang mới với tiêu đề là Sitemap hoặc bất kì tên nào bạn muốn.
 |
| Tạo trang cho blogspot đơn giản |
Copy và dán code vào vùng soạn thảo
Tiếp theo, bạn hãy copy và dán đoạn code dưới vào vùng soạn thảo. Trước khi dán bạn hãy chuyển sang Chế độ HTML sau đó mới thực hiện dán.
 |
Thực hiện copy và dán code |
<p>Danh mục các chủ đề được phân loại, giúp bạn dễ dàng tìm kiếm tất cả các bài viết.</p>
<style scoped="scoped" type="text/css">
#sidebar-wrapper,.post-body ul li:before{display:none!important}
#main-wrapper{width:100%!important}
#show-cat{display: block;margin:20px auto;width:100%;height:285px;overflow-x:hidden;overflow-y:auto;line-height:normal;background: linear-gradient(90deg, rgb(169, 108, 232), rgb(0, 115, 183));}
#show-cat ul{margin:0;padding:15px;display: grid;grid-template-columns: repeat(4,1fr);}
#show-cat ul li{list-style-type:none;padding:0;margin: 0;float: left;}
#show-cat ul li a{display:block;padding:10px}
#show-cat ul li a:before{font-family: 'Font Awesome 5 Pro';content: '\f07c';font-weight: 400;padding-right: 5px;}
#navi-cat a:hover{color:var(--main-color)!important}
#show-cat ul li:last-child a{border-bottom:none}
#show-cat ul li a,#navi-cat a{transition: all .2s;color:#fff;font-weight:600;text-decoration:none}
#show-cat ul li a,#navi-cat a,#navi-cat span{font-size:14px}
#show-cat ul li a:hover{background:rgba(64,64,64,0.1);color:#fff}
#show-post{width:100%;line-height:normal}
#show-post ul li{list-style-type:none;margin:10px 0 0 -15px;padding:10px;border:1px solid #ddd}
#show-post a:hover{color:var(--main-color);transition: all .2s;text-decoration: none;}
#show-post a{color:var(--text-color);font-weight:600}
#navi-cat{padding:20px 0}
#navi-cat a{margin-right:10px;border:1px solid #ccc}
#navi-cat a,#navi-cat span{padding:10px 15px}
#navi-cat span{float:right}
#show-cat::-webkit-scrollbar{width:5px;height:5px}
#show-cat::-webkit-scrollbar-track{background-color:rgba(0,0,0,.1);border-radius:20px}
#show-cat::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.6)}
#show-cat::-webkit-scrollbar-thumb{border-radius:2px;background-color:rgba(0,0,0,.4);transition:all 400ms ease-in-out}
</style>
<div id="show-cat"></div>
<div id="show-post">
<script type="text/javaScript">
var cat_home='#';cat_numb=10;cat_pre='Trang trước';cat_nex='Trang sau';
var cat_name;var cat_start;var cat_class;
function show_post2(a){var tt=a.feed.openSearch$totalResults.$t;dw='';dw+='<ul>';for(var i=0;i<cat_numb&&i<a.feed.entry.length;i++){var entry=a.feed.entry[i];cat_title=entry.title.$t;for(var j=0;j<entry.link.length;j++){if(entry.link[j].rel=='alternate'){var cat_url=entry.link[j].href}}dw+='<li>';dw+=(cat_start+i)+'. <a href="'+cat_url+'" target="_blank" title="'+cat_title+'">'+cat_title+'</a>';dw+='</li>'}dw+='</ul>';dw+='<div id="navi-cat">';if(cat_start>1){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start-cat_numb)+'\',\''+cat_class+'\');return false" title="'+cat_pre+'">'+cat_pre+'</a>'}if((cat_start+cat_numb-1)<tt){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start+cat_numb)+'\',\''+cat_class+'\');return false" title="'+cat_nex+'">'+cat_nex+'</a>'}dw+='<span>'+cat_start;if(cat_start!=tt){dw+=' – '+(cat_start+i-1)}dw+=' / '+tt+'</span>';dw+='</div>';document.getElementById('show-post').innerHTML=dw+'<style type="text/css">.cat-'+cat_class+' a{background:rgba(0,0,0,0.05)!important;color:#fff!important}<\/style>'}function show_post(a,b,c){var d=document.getElementsByTagName('head')[0];e=document.createElement('script');e.type='text/javascript';e.setAttribute('src',cat_home+'/feeds/posts/default/-/'+a+'?alt=json-in-script&start-index='+b+'&max-results='+cat_numb+'&callback=show_post2');d.appendChild(e);cat_name=a;cat_start=parseInt(b),cat_class=c}function show_cat(a){var cat=a.feed.category;dw='';dw+='<ul>';for(var i=0;i<cat.length-1;i++){for(var j=i+1;j<cat.length;j++){if(cat[i].term>cat[j].term){cat_hv=cat[i].term;cat[i].term=cat[j].term;cat[j].term=cat_hv}}}for(var i=0;i<cat.length;i++){dw+='<li class="cat-'+i+'">';dw+='<a href="" onclick="show_post(\''+cat[i].term+'\',\'1\',\''+i+'\');return false" title="';dw+=cat[i].term;dw+='">';dw+=cat[i].term;dw+='</a>';dw+='</li>'}dw+='</ul>';document.getElementById('show-cat').innerHTML=dw}document.write('<script type="text/javascript" src="'+cat_home+'/feeds/posts/default?alt=json-in-script&max-results=0&callback=show_cat"><\/script>');
</script>
</div>
<div id="backhome"><a href="#" target="_blank"><i class="fas fa-home-lg-alt"></i> Trang Chủ</a></div>Bạn nhớ thay chỗ # bằng địa chỉ trang website của bạn trước khi xuất bản.
Tiến hành xuất bản
Sau khi đã hoàn thành các bước trên bạn có thể ấn xuất bản và hưởng thụ thành quả của mình
 |
| Xuất bản trang sơ đồ website |
Như vậy Chia Sẻ Vip đã hướng dẫn các bạn cách để tạo một trang sitemap cho blogspot vô cùng đẹp mắt. Các bạn hãy xem và kĩ và làm theo, đồng thời nên ấn xem trước trang để xem nếu thấy ổn thì hãy ấn xuất bản. Trong quá trình thực hiện nếu gặp vấn đề gì khó khăn bạn hãy để lại bình luận, chúng tôi sẽ giúp đỡ bạn. Chúc bạn thành công