Đối với Blogspot thì để có một trang sitemap là điều khá dễ dàng. Tuy nhiên để có một sitemap đẹp thì cần phải có sự khác biệt giữa các file .js và .css khác nhau. Trong quá trình truy cập internet nhận thấy có một mẫu sitemap khá ấn tượng. Chính vì thế bài viết này mình sẽ hướng dẫn các bạn tạo trang sitemap đẹp cho blogspot. Bên dưới là hình ảnh minh hoạ.
Bước 1.
Các bạn tạo trang mới và để ở chế độ xem HTMLBước 2.
Các bạn dán đoạn code sau vào blog<link rel="stylesheet" href="http://dte-project.googlecode.com/svn/trunk/tabbed-toc-skin.css"/>
<div id="tabbed-toc"><span class="loading">Đang tải...</span></div>
<script>
var tabbedTOC = {
blogUrl: "http://dia_chi_blog.blogspot.com", // 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
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December"
],
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="http://dte-project.googlecode.com/svn/trunk/tabbed-toc.js"></script>
Lưu ý: Bạn có thể tải hai file .js và .css về máy và upload lên host của bạn để lưu trữ đề phòng có lỗi. Sau đó thay thế hai đường dẫn trong đoạn code trên. Download file .js về máy tại đây, file .css về máy tại đây.
Xem qua: Lưu trữ tài liệu bằng cách sử dụng Host Drive của Google
Một số chỉ dẫn:
blogUrl --> Thay đổi thành địa chỉ blog của bạncontainerId --> Yếu tố ID được sử dụng như một phần của JSON mà đã được xử lý (bỏ qua nếu không cần thiết)
activeTab --> Được sử dụng để xác định số serial của các tab đang hoạt động (giá trị 1 sẽ làm cho các tab đầu tiên để trở thành hoạt động, do đó, hiện các nội dung tab đầu tiên cũng sẽ mở lần đầu tiên trang được truy cập).
showDates --> Thay đổi giá trị thành 'true' để hiển thị thời gian của vấn đề của bài viết.
showSummaries --> Thay đổi giá trị thành 'true' để hiển thị một bản tóm tắt của bài viết.
showThumbnails --> Thay đổi giá trị thành 'true' để hiển thị thumbnail cho bài viết (không khuyến khích vì nó sẽ làm cho việc load trang chậm).
thumbSize --> Được sử dụng để xác định kích thước của thumbnail.
noThumb --> Hình ảnh sao lưu URL vào bài viết mà không có một hình ảnh trong bài viết đó.
monthNames --> Được sử dụng để chỉ định tên của các tháng (có thể đổi về tên tháng theo tiếng Việt).
newTabLink --> Nếu đó là 'true', tất cả các liên kết sẽ mở trong một tab / cửa sổ mới khi nhấp vào.
maxResults --> Số lượng tối đa bài viết được hiển thị.
preload --> Được sử dụng để xác định thời gian tải chậm trễ JSON. Sử dụng phần nghìn giây hoặc đơn giản là viết "onload" mà widget này để tải sau khi trang đã hoàn toàn kín.
sortAlphabetically --> 'false" để sắp xếp bài viết thường dựa trăng nằm trên đầu, 'true' để sắp xếp bài viết theo bảng chữ cái.
showNew --> 'false' để không hiển thị chữ New! Thay đổi số để xác định có bao nhiêu bài viết gần đây mà muốn được dán New!.
newText --> Đánh dấu HTML là miễn phí để làm cho một nhãn New! các bài đăng mới nhất.
Bước 3.
Xuất bản trangChúc các bạn thành công!
Tag :
Blogger
0 Nhận xét " Hướng dẫn tạo trang Sitemap đẹp cho Blogspot "