Thêm sơ đồ website giao diện table đẹp cho blogspot

Sitemap là thành phần nên có trên blog hay bất cứ trang website nào để độc giả thuận tiện theo dõi và điều hướng những post khiến cho blog của bạn thân mật hơn với người mua và post này sẻ giúp bạn thêm site map cho blogger với giao diện khá thân mật cho người dùng.

Thêm sơ đồ website cho blogspot

Tại "bảng điều khiển" bạn chọn vào "trang"

Tiếp theo bạn chọn "trang mới" sau đó chọn soạn thảo đăng ở phương pháp HTML sau đó thêm đoạn code sau vào và ấn Xuất bản

<style scoped="scoped" type="text/css">/* CSS Sitemap */#bp_toc {background:transparent;width:100%;color:#999;margin-top:10px;margin:0 auto;padding:5px;}.toc-header-col1 {padding:10px!important;line-height:15px;background-color:#01c0f4;width:250px;transition:all 0.3s ease-in-out;}.toc-header-col2 {padding:10px!important;line-height:15px;background-color:#6cd9dd;width:75px;transition:all 0.3s ease-in-out;}.toc-header-col3 {padding:10px!important;line-height:15px;background-color:#44cc9a;width:125px;transition:all 0.3s ease-in-out;}.toc-header-col1:hover, .toc-header-col2:hover, .toc-header-col3:hover {opacity:0.9;}.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:15px;text-transform: lowercase;text-decoration:none;color:#fff;font-family:'Roboto Slab';font-weight:400;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 {padding:10px;font-size:89%;;transition:all 0.3s ease-in-out;}.toc-entry-col1:hover, .toc-entry-col2:hover, .toc-entry-col3:hover {background:#fff;}.toc-entry-col1:nth-child(odd), .toc-entry-col2:nth-child(odd), .toc-entry-col3:nth-child(odd) {padding:10px;font-size:89%;}.toc-entry-col1:nth-child(even), .toc-entry-col2:nth-child(even), .toc-entry-col3:nth-child(even) {padding:10px;font-size:89%;}.toc-entry-col1 a, .toc-entry-col2 a, .toc-entry-col3 a{text-decoration:none;color:#666;transition:all 0.3s ease-in-out;}.toc-entry-col1 a:hover, .toc-entry-col2 a:hover, .toc-entry-col3 a:hover{color:#f6af54;}span.toc-note {padding:10px;margin:10px 0;display:inline-block;background:#fff;color:#666;}#bp_toc table {width:100%;margin:0 auto;border-collapse:collapse;border-spacing:0;border-color: transparent;}#bp_toc tr:nth-child(even) {background:#fafafa}#bp_toc tr:nth-child(odd) {background:#eee}</style><div id="bp_toc">Loading Sitemap. Please wait....</div><script src="https://googledrive.com/host/0B395DCTZ7t5KU2JPUjlMdmdmMVk" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&amp;max-results=9999&amp;callback=loadtoc" type="text/javascript"></script> <div style="clear: both;"></div>

Các bạn có thể xem demo sơ đồ website tại đây