NOTE Đóng lại Chào mừng các bạn ghé thăm blog Trần Phúc Minh

Tạo bài viết liên quan kèm ảnh Thumbnails cho blogspot

Thủ thuật hiển thị bài viết liên quan kèm ảnh Thumbnails ở đây thể hiện một cách chuyên nghiệp hơn. Bài viết này được lấy từ 1 số nguồn trên internet trong khi lang  thang .




Đầu tiên: Đăng nhập vào blog --> Bố cục --> Chỉnh sửa HTML -> Mở rộng mẫu tiện ích 

 Sau đó tìm đến thẻ   </head>
Chèn đoạn code dưới đây trước nó nhé:
    <!--Related Posts with thumbnails-->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <style type="text/css">
    #related-posts {
    float:center;
    text-transform:none;
    height:100%;
    min-height:100%;
    padding-top:5px;
    padding-left:5px;
    }
    #related-posts h2{
    font-size: 1.6em;
    font-weight: bold;
    color: black;
    font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
    margin-bottom: 0.75em;
    margin-top: 0em;
    padding-top: 0em;
    }
    #related-posts a{
    color:black;
    }
    #related-posts a:hover{
    color:black;
    }
    #related-posts  a:hover {
    background-color:#d4eaf2;
    }
    </style>
    <script src='http://xemtruyenhinh.110mb.com/relatedthumbs21.js' type='text/javascript'/>
    </b:if>
    <!--Related Posts with thumbnails-->


Tiếp theo:  Tìm đến đoạn code tương tự sau:

    <div class='post-footer-line post-footer-line-1'>
Thay thế bằng đoạn code dưới :
    <!-- Start Related Posts with Thumbnails-->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div id='related-posts'>
    <b:loop values='data:post.labels' var='label'>
    <b:if cond='data:label.isLast != &quot;true&quot;'>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger tutorials</a>
    <script type='text/javascript'>
    var currentposturl=&quot;<data:post.url/>&quot;;
    var maxresults=5;
    var relatedpoststitle="Related Posts";
    removeRelatedDuplicates_thumbs();
    printRelatedLabels_thumbs();
    </script>
    </div><div style='clear:both'/>
    </b:if>
    <!-- End Related Posts with Thumbnails-->

Chú ý:   var maxresults=5; số 5 là giá trị max số bài viết hiển thị
Save lại ---> kiểm tra kết quả thế nào nhé !
Chúc các bạn thành công !

Không có nhận xét nào:

Đăng nhận xét