Friday, June 26, 2015

Chia sẻ Code hiện bài viết theo nhãn

Hôm nay mình xin chia sẻ bảng điều hướng đăng bài theo nhãn của Blog mình
Chia sẻ Code hiện bài viết theo nhãn
Cách mình sử dụng code này cho blog
Đây là demo ban đầu, nếu bạn nào thích tạo một code như thế này thì các bạn hãy vào Bố cục> Thêm tiện ích > Thêm HTML/Java vào dán toàn bộ code này vào đó nhé.

<!--Code bang dieu huong-->
<style type="text/css">
img.label_thumb {
  float:left;
  margin:0 10px 0 10px !important;
  height:60px;
  /* Thumbnail height */
  width:60px;
list-style: none;
display: block;
}
.label_with_thumbs {
  float: left;
  width: 100%;
  min-height: 65px;
  margin: 0px 10px 2px 0px;
  padding: 0;
}
ul.label_with_thumbs li {
  padding:10px 0 10px;
  min-height:65px;
list-style: none;
display: block;
}
.label_with_thumbs li {
  list-style: none;
  padding-left:0px !important;
list-style: none;
display: block;
}
.label_with_thumbs strong {
  padding-left:10px;
}
</style>
<script>
function labelthumbs(json) {
    document.write('<ul class="label_with_thumbs">');
    for (var i = 0; i < numposts; i++) {
        var entry = json.feed.entry[i];
        var posttitle = entry.title.$t;
        var posturl;
        if (i == json.feed.entry.length) break;
        for (var k = 0; k < entry.link.length; k++) {
            if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
                var commenttext = entry.link[k].title;
                var commenturl = entry.link[k].href;
            }
            if (entry.link[k].rel == 'alternate') {
                posturl = entry.link[k].href;
                break;
            }
        }
        var thumburl;
        try {
            thumburl = entry.media$thumbnail.url;
        } catch (error) {
            s = entry.content.$t;
            a = s.indexOf("<img");
            b = s.indexOf("src=\"", a);
            c = s.indexOf("\"", b + 5);
            d = s.substr(b + 5, c - b - 5);
            if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
                thumburl = d;
            } else thumburl = 'http://3.bp.blogspot.com/-O-vjxP03hYo/UXVtH90_iQI/AAAAAAAAAG4/60hz9Rn5FWA/s1600/No+Image+1.gif';
        }
        var postdate = entry.published.$t;
        var cdyear = postdate.substring(0, 4);
        var cdmonth = postdate.substring(5, 7);
        var cdday = postdate.substring(8, 10);
        var monthnames = new Array();
        monthnames[1] = "Jan";
        monthnames[2] = "Feb";
        monthnames[3] = "Mar";
        monthnames[4] = "Apr";
        monthnames[5] = "May";
        monthnames[6] = "June";
        monthnames[7] = "July";
        monthnames[8] = "Aug";
        monthnames[9] = "Sept";
        monthnames[10] = "Oct";
        monthnames[11] = "Nov";
        monthnames[12] = "Dec";
        document.write('<li class="clearfix">');
        if (showpostthumbnails == true) document.write('<a href="' + posturl + '" target ="_top"><img class="label_thumb" src="' + thumburl + '"/></a>');
        document.write('<strong><a href="' + posturl + '" target ="_top">' + posttitle + '</a></strong><br>');
        if ("content" in entry) {
            var postcontent = entry.content.$t;
        } else if ("summary" in entry) {
            var postcontent = entry.summary.$t;
        } else var postcontent = "";
        var re = /<\S[^>]*>/g;
        postcontent = postcontent.replace(re, "");
        if (showpostsummary == true) {
            if (postcontent.length < numchars) {
                document.write('');
                document.write(postcontent);
                document.write('');
            } else {
                document.write('');
                postcontent = postcontent.substring(0, numchars);
                var quoteEnd = postcontent.lastIndexOf(" ");
                postcontent = postcontent.substring(0, quoteEnd);
                document.write(postcontent + '...');
                document.write('');
            }
        }
        var towrite = '';
        var flag = 0;
        document.write('<br>');
        if (showpostdate == true) {
            towrite = towrite + monthnames[parseInt(cdmonth, 10)] + '-' + cdday + ' - ' + cdyear;
            flag = 1;
        }
        if (showcommentnum == true) {
            if (flag == 1) {
                towrite = towrite + ' | ';
            }
            if (commenttext == '1 Comments') commenttext = '1 Comment';
            if (commenttext == '0 Comments') commenttext = 'No Comments';
            commenttext = '<a href="' + commenturl + '" target ="_top">' + commenttext + '</a>';
            towrite = towrite + commenttext;
            flag = 1;;
        }
        if (displaymore == true) {
            if (flag == 1) towrite = towrite + ' | ';
            towrite = towrite + '<a href="' + posturl + '" class="url" target ="_top">More »</a>';
            flag = 1;;
        }
        document.write(towrite);
        document.write('</li>');
        if (displayseparator == true) if (i != (numposts - 1)) document.write('');
    }
    document.write('</ul>');
}</script>
  <script type='text/javascript'>
var numposts = 3;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 60;
</script>
<table style="background:#fff;box-shadow: 0 0 20px rgba(0, 0, 0, .2);width:1120px; margin:0 auto;">
      <tr>
        <td style="padding-top:10px;">
<a href="http://www.sladar.com/search/label/t%c3%a2m%20s%e1%bb%b1"><img style="padding-left:120px;" title="Tâm sự" src="http://2.bp.blogspot.com/-QDga1AkrnpQ/VYE_B42RZCI/AAAAAAAABG4/5PW41tGQIfI/s1600/tamsuicon.png" alt="Sladar Gai tâm sự"  /></a>
        </td>
        <td  style="padding:10px 10px 0 0;">
<a href="http://www.sladar.com/search/label/Ch%C3%ACa%20kh%C3%B3a%20th%C3%A0nh%20c%C3%B4ng"><img style="padding-left:90px;" title="Chìa khóa thành công"src="http://3.bp.blogspot.com/-CS8stM-oDNc/VYBEV6pSS8I/AAAAAAAABFs/MI67ieBfmaI/s1600/chiakhoaicon.png" alt="Sladar Gai nói về chìa khóa thành công"  /></a>
        </td>
        <td  style="padding:10px 10px 0 0;">
<a href="http://www.sladar.com/search/label/truy%E1%BB%87n%20ng%E1%BA%AFn""><img style="padding-left:90px;" title="Truyện ngắn" src="http://2.bp.blogspot.com/-qf4Gy7emweU/VYBEf7mq-ZI/AAAAAAAABF0/Ez6DV-Ci4Zo/s1600/truyennganicon.png" alt="Truyện ngắn của Sladar Gai"  /></a>
        </td>
        <td  style="padding:10px 10px 0 0;">
<a href="http://www.sladar.com/search/label/Ph%C3%A1t%20tri%E1%BB%83n%20Blog" "><img style="padding-left:90px;" title="Phát triển Blog" src="http://4.bp.blogspot.com/-_rBnyEc_wFg/VYBEoZsybqI/AAAAAAAABF8/Yrs9JcRuX-I/s1600/phattrienicon.png" alt="Cách phát triển Blog của Sladar Gai"/></a>
</td>
      </tr>
      <tr>
        <td style="padding:0 15px;width:330px;"><div style="text-align:center;"><a href="http://www.sladar.com/search/label/t%C3%A2m%20s%E1%BB%B1"><b>Tâm sự</b></a></div><div style="text-align:justify;">Những gì xoay quanh góc độ nhìn nhận của Sladar Gai sẽ được đăng tải, bên cạnh đó là các bài viết của các bạn gửi về cho Blog.</div></td>
         <td style="padding-right:15px;width:330px;"><div style="text-align:center;"><a href="http://www.sladar.com/search/label/Ch%C3%ACa%20kh%C3%B3a%20th%C3%A0nh%20c%C3%B4ng"><b>Chìa khóa thành công</b></a></div><div style="text-align:justify;">Những bài học thành công, những câu chuyện thành công, những tấm gương sáng về nghị lực, ý chi vươn lên trong cuộc sống hàng ngày</div></td>
        <td style="padding-right:15px;width:330px;"><div style="text-align:center;"><a href="http://www.sladar.com/search/label/truy%E1%BB%87n%20ng%E1%BA%AFn"><b>Truyện ngắn</b></a></div><div style="text-align:justify;">Những mẩu chuyện được viết lên, lấy cảm hứng từ những câu chuyện trong cuộc sống đã nêu trước đó, nếu bạn muốn, hãy tham gia với chúng tôi</div></td>
        <td style="padding-right:15px;width:330px;"><div style="text-align:center;"><a href="http://www.sladar.com/search/label/Ph%C3%A1t%20tri%E1%BB%83n%20Blog"><b>Phát triển Blog</b></a></div><div style="text-align:justify;">Tất tần tật những thủ thuật và cách thức đê phát triển tối đa một Blog xây dựng dựa trên nền tảng trang Blogger.com của Google</div></td>
      </tr>
<tr >
<td>
  <script type="text/javascript" src="http://www.sladar.com/feeds/posts/summary/-/tâm%20sự?orderby=published&alt=json-in-script&callback=labelthumbs"></script>
<a style="padding-left:10px;" href="http://www.sladar.com/search/label/t%C3%A2m%20s%E1%BB%B1"><b>Xem thêm</b></a>
</td>
<td>
<script type="text/javascript" src="http://www.sladar.com/feeds/posts/summary/-/Chìa%20khóa%20thành%20công?orderby=published&alt=json-in-script&callback=labelthumbs"></script>
<a style="padding-left:10px;" href="http://www.sladar.com/search/label/Ch%C3%ACa%20kh%C3%B3a%20th%C3%A0nh%20c%C3%B4ng"><b>Xem thêm</b></a>
</td>
<td>
<script type="text/javascript" src="http://www.sladar.com/feeds/posts/summary/-/truyện%20ngắn?orderby=published&alt=json-in-script&callback=labelthumbs"></script>
<a style="padding-left:10px;" href="http://www.sladar.com/search/label/truyện%20ngắn"><b>Xem thêm</b></a>
</td>
<td>
<script type="text/javascript" src="http://www.sladar.com/feeds/posts/summary/-/Phát%20triển%20Blog?orderby=published&alt=json-in-script&callback=labelthumbs"></script>
<a style="padding-left:10px;" href="http://www.sladar.com/search/label/Phát%20triển%20Blog"><b>Xem thêm</b></a></td>
</tr>
    </table>

Trên đây là phần chia sẻ code hiện bài viết theo nhãn mà mình sưu tầm được từ các nguồn trên mạng, rất mong rằng sẽ giúp được cho quý độc giả phần nào trong hoạt động viết và phát triển website trên nền tảng blog spot.

Nguồn: Thư pháp Thanh Phong | Thư pháp đẹp

No comments:

Post a Comment

DỊCH VỤ ÔNG ĐỒ

VIẾT THƯ PHÁP CHUYÊN NGHIỆP

LUYỆN TẬP HÀNG NGÀY