Chủ Nhật, 12 tháng 10, 2014

Cách tạo bài viết liên quan cho blogspot,hướng dẫn cách tạo bài viên liên quan ở dưới bài viết cho blogspot,
Để góp phần thêm phong phú cho blog của mình, mà cũng góp phần cho người đẹp dễ tìm kiếm thì nay Hồng Designer sẽ hướng dẫn các bạn tạo bài viết liên quan cho blogspot. Cách này đơn giản mà khá đẹp.
Để Tạo bài viết liên quan cho blogspot như hình các bạn làm theo các bước sau :
Đăng nhập Blogger chọn mẫu => chỉnh sưả HTML ( edit HTML )

Bước 1

Tìm thẻ đóng </head> 
- Thêm vào trước nó đoạn code sau:
<!-- Widget bài viết liên quan (1) --><style>/*Khung chính của bài viết liên quan*/#related-posts {float:left;min-width: 100%;margin: 30px 5px 30px 0;font: 11px Tahoma;}#related-posts .widget {List-style-type: none;margin: 5px 0 5px 0;padding: 0;}#related-posts .widget h2, #related-posts h2 {color: #940f04;font-size: 20px;font-weight: normal;margin: 5px 7px 0;padding: 0 0 5px;}/*Màu link của bài viết liên quan*/#related-posts a {color: #318686;font-size: 13px;text-decoration: none;}/*Màu link khi rê chuột vào*/#related-posts a:hover {color: #C4436A;text-decoration: underline;}#related-posts ul {border: medium none;margin: 10px;padding: 0;}#related-posts ul li {display: block;background: url(https://lh5.googleusercontent.com/-zKhXxJUpROA/Tmr926k_EBI/AAAAAAAACks/1LrFz96DwAI/List_1.png) no-repeat 0 0;margin: 0;padding: 0 0 1px 16px;margin-bottom: 5px;line-height: 2em;border-bottom:1px dotted #cccccc; /*Gạch đích dưới mỗi link bài viết liên quan*/}</style><script type='text/javascript'>//<![CDATA[var relatedTitles = new Array();var relatedTitlesNum = 0;var relatedUrls = new Array();function related_results_labels(json) {for (var i = 0; i < json.feed.entry.length; i++) {var entry = json.feed.entry[i];relatedTitles[relatedTitlesNum] = entry.title.$t;for (var k = 0; k < entry.link.length; k++) {if (entry.link[k].rel == 'alternate') {relatedUrls[relatedTitlesNum] = entry.link[k].href;relatedTitlesNum++;break;}}}}function removeRelatedDuplicates() {var tmp = new Array(0);var tmp2 = new Array(0);for(var i = 0; i < relatedUrls.length; i++) {if(!contains(tmp, relatedUrls[i])) {tmp.length += 1;tmp[tmp.length - 1] = relatedUrls[i];tmp2.length += 1;tmp2[tmp2.length - 1] = relatedTitles[i];}}relatedTitles = tmp2;relatedUrls = tmp;}function contains(a, e) {for(var j = 0; j < a.length; j++) if (a[j]==e) return true;return false;}function printRelatedLabels() {var r = Math.floor((relatedTitles.length - 1) * Math.random());var i = 0;document.write('<ul>');while (i < relatedTitles.length && i < 20) {document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');if (r < relatedTitles.length - 1) {r++;} else {r = 0;}i++;}}//]]></script>

Bước 2: 

Tìm dòng <data:post.body/>
- Thêm vào sau nó đoạn code sau:

<!-- Widget bài viết liên quan (2) --><b:if cond='data:blog.pageType == "item"'><div id="related-posts"><div style='border-top:#AAAE95 1px dashed; margin: 0 50px 0 50px; padding-top:30px;'/><font face='Arial' size='3'><b>Bài viết liên quan: </b></font><font color='#FF0000'> <!-- Màu chữ label --><b:loop values='data:post.labels' var='label'><data:label.name/> <!--Dòng code hiện label kế bên bài viết liên quan--><b:if cond='data:label.isLast != "true"'>, <!--Dấu phẩy ngăn cách các label --></b:if><b:if cond='data:blog.pageType == "item"'><script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=8"' type='text/javascript'/></b:if></b:loop></font><script type='text/javascript'>removeRelatedDuplicates();printRelatedLabels();</script></div></b:if> Chỉnh sửa lại đoạn code in màu đỏ : max-results=8 // Số bài viết liên quan mà bạn muốn hiển thị

Bước 3 : 

Và cuối cùng là bạn lưu lại mẫu rồi xem kết quả của mình ra sao nhé.

0 nhận xét:

Đăng nhận xét