Để làm cái này ,bạn cần thực hiện theo bước sau.
Bước 01: Login blogspot > Template (Mẫu) > Edite HTML (Chỉnh sửa HTML).
– Chú ý: trước khi edit nên backup code gốc tránh khi sửa sai không khôi phục lại được nhé.
Bước 02: Thêm code dưới lên trước đoạn code (dùng ctrl F để tìm nhé)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
| /* Recent posts by labels */img.label_thumb{ float:left;margin-right:10px !important; height:65px; /* Thumbnail height */ width:65px; /* Thumbnail width */ border: 1px solid #fff; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .4); -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .4); box-shadow: 0 1px 1px rgba(0, 0, 0, .4);}#label_with_thumbs { float: left; width: 100%; min-height: 70px; margin: 0px 10px 2px 0px; padding: 0;}ul#label_with_thumbs li { padding:8px 0; min-height:65px; margin-bottom:0px; border-bottom: 1px dotted #999999;}#label_with_thumbs li{ list-style: none ; padding-left:0px !important;}#label_with_thumbs a {text-transform: uppercase;}#label_with_thumbs strong {padding-left:0px;} |
Bước 3: Copy đoạn code dưới trước thẻ đóng </head>
1
2
| </strong><br>’);if(“content”in entry){var postcontent=entry.content.$t;}elseif(“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> |
Bước 4: Thêm code dưới ở trước thẻ </body>
1
2
3
4
5
6
7
8
9
10
11
12
13
| <script type=’text/javascript’> function changeThumbSize(id,size){ var blogGadget = document.getElementById(id); var replacement = blogGadget.innerHTML; blogGadget.innerHTML = replacement.replace(/s72-c/g,”s”+size+”-c”); var thumbnails = blogGadget.getElementsByTagName(“img”); for(var i=0;i<thumbnails.length;i++){ thumbnails[i].width = size; thumbnails[i].height = size; } } changeThumbSize(“label_with_thumbs”,210);</script> |
Sau đó bạn save template lại
Bước 5: bạn tạo 01 widget mới đặt tên tùy ý. Và copy code dưới đây vào để kích hoạt:
1
2
3
4
5
6
7
8
9
10
11
| <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 = 100;</script><script type=”text/javascript” src=”/feeds/posts/default/-/Tên label bạn cần hiển thị?published&alt=json-in-script&callback=labelthumbs”></script> |
Tinh chỉnh theo ý thích :
– var numposts ← Là số bài viết muốn hiển thị
– var showpostthumbnails ← Hiển thị hoặc không hiển thị ảnh (true nghĩa là có hiển thị)
– var displaymore ← Có hiển thị read more link không
– var displayseparator ← Hiện thị ngăn cách bài
– var showcommentnum ← Hiển thị số lượng comment
– var showpostdate ← Hiển thị ngày post bài
– var showpostsummary ← Hiển thị hay khôgn tổng số bài
– var numchars ← Hiển thị số lượng chữ ( bthg là 100 chữ cái)
– var numposts ← Là số bài viết muốn hiển thị
– var showpostthumbnails ← Hiển thị hoặc không hiển thị ảnh (true nghĩa là có hiển thị)
– var displaymore ← Có hiển thị read more link không
– var displayseparator ← Hiện thị ngăn cách bài
– var showcommentnum ← Hiển thị số lượng comment
– var showpostdate ← Hiển thị ngày post bài
– var showpostsummary ← Hiển thị hay khôgn tổng số bài
– var numchars ← Hiển thị số lượng chữ ( bthg là 100 chữ cái)
Cuối cùng là bạn ra xem blog bạn hiển thị đã vừa ý chưa. Chúc các bạn thành công!