{VnTim™} Bài này, mình xin hướng dẫn các bạn cách tạo tiện ích Bài viết liên quan 1 cách đơn giản nhất, dạng link cho các bạn.
Xem Demo ở hình dưới.
Bắt đầu: Đăng nhập vào Blogger bằng tài khoản Gmail của các bạn. Chọn blog các bạn muốn chỉnh sửa:
Thiết kế -> Chỉnh sửa HTML, đánh vào ô Mở rộng mẫu tiện ích
CtrL + F tìm đến thẻ </head> trong Templates của các bạn và thêm đoạn code sau trước thẻ này:
<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzNtKIN2-R_27Sf5XWs532N-vYMHBnaDM-ze9PDV0rnnBrI01RECKWAWGCr707HYiCxzQ8C_kFvPsaC8IYlHZbcuS1yAtJraH6JAvjJ7ngEeK748onbNzmURUeayfq-ytxVRbfkqp0lgw/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://vntim.googlecode.com/files/VnTim%20Related%20Posts%20Skill%20Link.js' type='text/javascript'/>
Tiếp đến, tìm <data:post.body/> (hoặc <div class='post-body'> ) và thêm vào ở dưới đoạn code các các bạn vừa tìm được:
<b:if cond='data:blog.pageType == "item"'> <div id="related-posts"> <font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'> <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font> <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script> </div></b:if>
Cuối cùng là Save lại và tận hưởng thành quả của mình ^^
Chúc các bạn có một blog đẹp, và theo quên dõi Blog của VnTim™ để nhận những thử thuật hay nhé.
Các bạn có thể theo dõi Blog của VnTim™ qua Email hay Blogger thông qua Widget "KẾT NỐI VỚI VNTIM™" ở bên phải Blog.
Mọi thắc mắc xin để lại tin nhắn bên dưới nhé.
Thân chào các bạn.
Tags:
Bloger-Blogspot
hay lam, that tuyet ban ah,..! toi da lam thu va rat hai long ! cam on ban rat nhieu,..
Cám ơn bài viết ! Nhưng vẫn bị lặp !
ban cho mình hỏi 1 chút.t thấy trang blogger.com bị die. Mà ngay cả trang của t cũng bị vậy. Bạn làm thía nào mà trang của bạn hok bị die vậy ta. Chỉ cho t với.Thank you nhiu nhiu! hi
Tuyệt vời ,thanks !!!
That tuyet ban ah,..
cám ơn bạn đã làm đc, nhưng cho mình hỏi thêm 1 cái, là bỏ dòng Related Posts Widget[?] ở cuối tiện ích bằng cách nào ? mong chỉ giúp
Cảm ơn bạn;
Tôi cũng cùng câu hỏi như bạn Hà Ngọc Tú: muốn bỏ cái khỉ khô: Related Posts widget[?]
cho đẹp đội hình.
myohien@gmail.com
Mình đã sưả laị code cho các bạn và đã xóa dòng "Related Posts Widget[?]".
Hi vọng các bạn tiếp tục đóng góp nhé
huhu. minh tìm ko thấy dòng <div class='post-body> rồi. lam thế nào đây bác
Bạn đã thử tìm đoạn code và đã tích vào ô "Mở rộng mẫu tiện ích " chưa ?
:(( mình làm y hệt nhưng vẫn ko đc >> ban có thể vào xem giúp minh ko? blog mình mrnhok.tk
cái hình kia nhìn quen quá :)
Rất tuyệt vời. Thank
Xin hỏi thêm chút
Tạo mấy dòng dưới chữ (Đăng nhận xét) thì làm thế nào vậy?
Xin hỏi thêm chút
Tạo mấy dòng dưới chữ (Đăng nhận xét) thì làm thế nào vậy?
Bạn vào trang điều khiển rồi vào "Settings › Posts and comments"
Trong mục "Comment Form Message" bạn gõ tin nhắn vào là đc.
Cám ơn bạn đã ghé thăm blog VnTim™
Admin ơi! sao trong chỉnh sử HTML của tôi không có dòng code:
<div class='post-body>
Admin giúp tôi còn chỗ nào nữa không.
Email tôi:
phantu1962@yahoo.com.vn
Cảm ơn Admin
bac' oi rag e lm` ko dk
blog e chi hien chu Related Posts :
blog e day ne
http://radateen.blogspot.com
ko tim thay duoc 2 the (data.post.body/>(hoặc<div class='post-body')trong bog cua minh
Chào bạn
Mình xem bài viết này rất bổ ích và cần thiết cho blogger nhưng mình làm theo hướng dẫn mà ko làm được. Rất mong bạn giúp đỡ, nếu có thể mình sẽ gửi pass và Tài khoản bạn giúp mình làm nhé.
Email: hungpts@gmail.com
Chân thành cảm ơn!
cho mình hỏi, thấy nó show ra nhiều bài viết liên quan quá, thấy max=5" rồi mà có bài của mình nó show tới 16 bài, dài quá, dt load không nổi :((. Bạn cho mình đoạn code cắt bớt đi xuống còn 5 đó! cám ơn bạn
thank admin nhiều nhiều
cho mình hỏi có cách nào đổi địa chỉ blog không vntim
@thao mai: đổi địa chỉ blog rất đơn giản bạn đăng nhập vào blogger rồi vào mục Cài Đặt (setting) sẽ có phần địa chỉ blog. Bạn click vào chỉnh sửa để thay đổi địa chỉ blog nha.
Chúc bạn sơm đổi địa chỉ thành công.
Cảm ơn vì đã ghé thăm VnTim™ Blog