CÁC MẪU PHÂN TRANG CHO BLOG

Người đăng: kiemdaigia on Thứ Năm, 21 tháng 4, 2011

Trước đây tôi có giới thiệu bài "Phân trang cho Blog" (xem TẠI ĐÂY), ngoài ra còn các mẫu khác dưới đây, bạn thích cái nào thì copy code phía dưới và làm theo các bước tương tự.
Mẫu 1:



Mẫu 2:


Mẫu 3:



Mẫu 4:



Mẫu 5:



Mẫu 6:



Mẫu 7:





More about

TẠO LIÊN KẾT LOGO CHẠY NGANG

Người đăng: kiemdaigia

Blog là nơi để các bạn có thể chia sẻ, trao lưu học hỏi kinh nghiệm với nhau qua các bài đăng và các comment. Để khách tham quan biết đến blog mình thì phương pháp hữu hiệu nhất là bạn phải liên kết với các blog khác có cùng mục đích có cùng chủ đề...
Khi liên kết Logo trên Blog của bạn quá nhiều nó sẽ làm tăng không gian đáng kể trên Blog, do đó để khắc phục điều này bạn nên tạo một hiệu ứng cho các Logo chạy ngang hoặc ẩn hiện trên Blog theo thời gian mình định trước. Điều này sẽ làm cho Blog bạn trông "Pro" hơn và đặc biệt sẽ làm cho khách dễ "bắt mắt" hơn. Trong giới hạn bài viết này tôi chỉ hướng dẫn logo chạy ngang, sau này sẽ giới thiệu tiếp cách làm logo thay đổi theo thời gian định trước
Đầu tiên, bạn đăng nhập blog, chọn Thiết kế > chọn Thêm tiện ích > Thêm HTML/Javacript, sau đó dán tất cả các code này vào

<div style="background:#ddd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEit3M4-K4I_VChVq0GkA4QHDmTDvTbcJWRT78Cx9aJYIdP0-go_ll_wcFoMWxP-kehcfLXBmfnO39uhrwVj5FkXH5ybzIGnvxJ1TBjwYMeRX1BUckBCwZYdyjsUVm3P1cmiYpzqqegPgNBV/) no-repeat left; border-top:#999 1px solid; border-bottom:#999 1px solid; padding-left:19px;padding-right:2px;width:100%;">
<marquee onmouseout="this.start()" direction="left" behavior="50" scrollamount="5" height="60" onmouseover="this.stop()" scrolldelay="50" width="511">

<a href="http://dungheineken.blogspot.com/" target="blank" ><img style="width: 220px; height: 60px;" src="
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLREWJnTNH5zEx-KHgIcgJnaSPXPk41DZ-VPd14-ZfTZNMsSbcsN4z7V8nsFdkCCjZJ2za_zHp0yVBjhERh1jHy39EfZ7CkkfiWahTNr9hhydhRjy8aZ9o_OPhbgSwdjwAbNoT-iqJiFzW/s1600/coollogo_com-21114715.gif" /></a>
<a href="URL liên kết 2" target="blank" ><img style="width: 220px; height: 60px;" src="Link logo 2" /></a>
<a href="URL liên kết 3" target="blank" ><img style="width: 220px; height: 60px;" src="Link logo 3" /></a>
<a href="URL liên kết 4" target="blank" ><img style="width: 220px; height: 60px;" src="Link logo 4" /></a>
<a href="UR Lliên kế 5" target="blank" ><img style="width: 220px; height: 60px;" src="Link logo 5" /></a>

</marquee></div>
Bạn thay đổi các code màu đỏ và màu xanh theo link ảnh và địa chỉ liên kết của bạn, bạn cũng có thể thay đổi tốc độ chạy, độ cao và độ dài của ảnh ở các thông số màu xanh, cuối cùng lưu lại và đặt tiện ích vào nơi bạn muốn nó hiển thị trên Blog.
Nếu muốn thêm liên kết bạn chỉ việc copy đoạn code này, thay đổi số thứ tự rồi dán tiếp tục phía dưới 

<a href="UR Lliên kế 5" target="blank" ><img style="width: 220px; height: 60px;" src="Link logo 5" /></a>
Thay đổi số 5 thành số 6 (cứ như vậy nếu có nhiều hơn)
Chúc các bạn thành công

More about

TIÊU ĐỀ BÀI ĐĂNG MỚI VỚI HIỆU ỨNG CHẠY NGANG

Người đăng: kiemdaigia

Để cho khách tham quan thuận tiện lựa chọn bài để xem, bạn có thể tạo thanh tiêu đề các bài mới đăng trên Blog với hiệu ứng chạy từ phải sang trái hoặc ngược lại.
Đầu tiên bạn đăng nhập Blog, chọn Thiết kế > Thêm tiện ích > Thêm HTML/Javacript, sau đó dán toàn bộ code này vào:
<script style="text/javascript"
src="http://dreamydonkey.googlepages.com/scrolling_blogger_posts.js">  </script><script style="text/javascript"> var nMaxPosts = 15; var sBgColor; var nWidth; var nScrollDelay = 175; var sDirection="left"; var sOpenLinkLocation="N"; var sBulletChar="•"; </script> <script style="text/javascript" src="http://dungheineken.blogspot.com/feeds/posts/default?alt=json-in-script&callback=RecentPostsScrollerv2"> </script>
Bây giờ bạn thay thế code màu đỏ, "dungheineken.blogspot.com"  thành Link của blog mình là xong, sau đó lưu lại và vào blog xem kết quả.
Trên đây tiêu đề sẽ chạy từ trái sang phải, nếu bạn muốn nó chạy ngược lại từ phải sang trái thì thay từ "right" vào chỗ "left" ở trên. Bạn cũng có thể thay đổi số bài hiển thị bằng cách thay đổi số "15" ở trên thành số bài mà bạn muốn. Nếu muốn tốc độ chạy nhanh hơn hoặc chậm hơn bạn thay đổi số "175" thành số khác (số càng nhỏ tiêu đề chạy càng nhanh và ngược lại)
Mách nhỏ: Bạn nên để tiện ích này phía trên bài đăng trên Blog sẽ hợp lý hơn và trông đẹp hơn
Chúc bạn thành công
More about

PHÂN TRANG CHO BLOG

Người đăng: kiemdaigia on Thứ Ba, 19 tháng 4, 2011



Để Blog của bạn "Pro" hơn, bạn nên phân trang cho blog theo các bước sau đây.
Đầu tiên, bạn đăng nhập vào blog, chọn thiết kế > Thêm tiện ích > thêm HTML/Javacript, sau đó dán toàn bộ các code này vào
<style>
.showpageArea {font-size: 16px; width:300px;background: url(http://thantoc.xm.com/hinh-anh/Pagenavbar-1.jpg) no-repeat left top; padding: 10px; color:#003366;text-align:center;
}
.showpageArea a {
color:#0F0;
text-decoration:underline;
}
.showpageNum a {

text-decoration:none;
color:#0F0; border:1px solid #FFF;
margin:0 10px;
padding:0 5px 0 8px;
}
.showpageNum a:hover {
color:#ffff00; border:1px solid #00ff00;
background-color:#FFF;
}
.showpagePoint {
color:#ffff00;
margin:0 8px 0 4px;
}
.showpage a {
text-decoration:none;
color:#FFF;
padding:0 2px 0 4px;
}
.showpage a:hover {
color:#ffff00;
text-decoration:underline;
} .showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#00ff00;
}
</style>

<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";   
    thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';


var pageCount=5;
var displayPageNum=5;
var firstPageWord = 'Đầu';
var endPageWord = 'Cuối';
var upPageWord ='&#9668;';
var downPageWord ='&#9658;';



var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
  var timestamp = post.published.$t.substr(0,10);
  var title = post.title.$t;
  if(isLablePage){
    if(title!=''){
        if(post.category){
      for(var c=0, post_category; post_category = post.category[c]; c++) {
        if(encodeURIComponent(post_category.term)==thisLable){                     
          if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
            if(thisUrl.indexOf(timestamp)!=-1 ){
              thisNum = postNum;             
            }

            postNum++;
            htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
          }                
        }     
      }
    }//end if(post.category){

     itemCount++;
   }

  }else{
    if(title!=''){
      if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
        if(thisUrl.indexOf(timestamp)!=-1 ){
          thisNum = postNum;
        }

        if(title!='') postNum++;
        htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
      }     
    }
    itemCount++;
  }
}

for(var p =0;p< htmlMap.length;p++){
  if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
    if(fFlag ==0 && p == thisNum-2){
      if(thisNum==2){
        if(isLablePage){
          upPageHtml = labelHtml + upPageWord +'</a></span>';         
        }else{
          upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
        }
      }else{
        upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
      }

      fFlag++;
    }

    if(p==(thisNum-1)){
      html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';
    }else{
      if(p==0){
        if(isLablePage){
          html = labelHtml+'1</a></span>';
        }else{
          html += '<span class="showpageNum"><a href="/">1</a></span>';         
        }
      }else{
        html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
      }
    }

    if(eFlag ==0 && p == thisNum){
      downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
      eFlag++;
    }
  }//end  if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){
  if(!isLablePage){
      html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
  }else{
      html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
  }
}

  html = '<div class="showpageArea"><span >Trang '+thisNum+' / '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
  html += downPageHtml;
  html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>';
}

if(postNum==1) postNum++;
  html += '</div>';

  if(isPage || isFirstPage || isLablePage){
    var pageArea = document.getElementsByName("pageArea");
    var blogPager = document.getElementById("blog-pager");

    if(postNum <= 2){
        html ='';
    }

    for(var p =0;p< pageArea.length;p++){
      pageArea[p].innerHTML = html;
    }

    if(pageArea&&pageArea.length>0){
      html ='';
    }

    if(blogPager){
      blogPager.innerHTML = html;
    }
  }

}
</script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>


<style type=”text/css”>
.showpageArea {padding: 10px; color:#003366;text-align:left;width:530px;
}
.showpageArea a {
float:left;
text-align:center;
display:block;
margin:0 5px;
color:#333;
}
.showpageArea a:hover {
color:#333;
margin:0 5px;
}
.showpageNum a { background: url(‘http://i410.photobucket.com/albums/pp181/JohnSmithamazon/Blogger-Templates-Free-Designs-XML-Tutorial/page_num.gif’) no-repeat 0 0;
width:37px;
height:42px;
display:block;
text-align:center;
float:left;
margin:0 5px;
padding-top:6px;
text-decoration:none;
color:#333;
}
.showpageNum a:hover { background:url(‘http://i410.photobucket.com/albums/pp181/JohnSmithamazon/Blogger-Templates-Free-Designs-XML-Tutorial/page_num.gif‘) no-repeat 0 100%;
color:#FFF;
}
.showpagePoint {background:url(‘http://i410.photobucket.com/albums/pp181/JohnSmithamazon/Blogger-Templates-Free-Designs-XML-Tutorial/page_num.gif‘) no-repeat 0 100%;
width:37px;
height:42px;
display:block;
float:left;
text-align:center;
margin:0 5px;
padding-top:6px;
font-weight:bold;
color:#FFF;
}
.showpageNum a:link, .showpage a:link {
text-decoration:none;
color:#cc0000;
}
.showpageupPageWord a { float:left;
background:url(‘http://i410.photobucket.com/albums/pp181/JohnSmithamazon/Blogger-Templates-Free-Designs-XML-Tutorial/nextbutton.gif‘) no-repeat 0 0;
width:127px;
height:42px;
text-align:center;
font: bold 1.0em Arial,Helvetica,sans-serif;
display:block;
margin:0 5px;
padding-top:6px;
color:#333;
}
.showpageupPageWord a:hover { float:left;
background:url(‘http://i410.photobucket.com/albums/pp181/JohnSmithamazon/Blogger-Templates-Free-Designs-XML-Tutorial/provup.png‘) no-repeat 0 0;
width:127px;
height:42px;
text-align:center;
font: bold 1.0em Arial,Helvetica,sans-serif;
display:block;
margin:0 5px;
padding-top:6px;
color:#FFF;
}
.showpagedownPageWord a { float:left;
background:url(‘http://i410.photobucket.com/albums/pp181/JohnSmithamazon/Blogger-Templates-Free-Designs-XML-Tutorial/backbutton.gif‘) no-repeat 0 0;
width:127px;
height:42px;
text-align:center;
font: bold 1.0em Arial,Helvetica,sans-serif;
display:block;
margin:0 5px;
padding-top:6px;
color:#333;
}
.showpagedownPageWord a:hover { float:left;
background:url(‘http://i410.photobucket.com/albums/pp181/JohnSmithamazon/Blogger-Templates-Free-Designs-XML-Tutorial/nextup.png‘) no-repeat 0 0;
width:127px;
height:42px;
text-align:center;
font: bold 1.0em Arial,Helvetica,sans-serif;
display:block;
margin:0 5px;
padding-top:6px;
color:#FFF;
}
.pagenextprov {
text-align: center;
}
</style>
<div class='pagenextprov'>
<script type="text/javascript">
function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';
var pageCount=5;
var displayPageNum=2;
var firstPageWord = 'First';
var endPageWord = 'last';
var upPageWord ='Back';
var downPageWord ='Next';

var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&amp;max-results='+pageCount+'">';
for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}
postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&amp;max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}
}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}
if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&amp;max-results='+pageCount;
}
}
itemCount++;
}
}
for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) &amp;&amp; p<(thisNum+displayPageNum)){
if(fFlag ==0 &amp;&amp; p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpageupPageWord"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpageupPageWord"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}
if(p==(thisNum-1)){
html += ' <span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}
if(eFlag ==0 &amp;&amp; p == thisNum){
downPageHtml = '<span class="showpagedownPageWord"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end  if(p>=(thisNum-displayPageNum-1) &amp;&amp; p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){
if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"></span>'+upPageHtml+' '+html +' ';
}
}
html = '<div class="showpageArea"><span  class="showpage"> Total '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;

}
if(postNum==1) postNum++;
html += '</div>';
if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}
if(pageArea&amp;&amp;pageArea.length>0){
html ='';
}
if(blogPager){
blogPager.innerHTML = html;
}
}
}
</script>
<script src="/feeds/posts/summary?alt=json-in-script&amp;callback=showpageCount&amp;max-results=99999" type="text/javascript"></script>
</div>
 Sau khi dán xong bạn lưu lại vào kéo tiện ích này nằm phía dưới bài đăng thì mới có hiệu lực.
Ngoài ra còn các mẫu khác mời bạn xem thêm TẠI ĐÂY

More about

Tạo Sitemap đẹp cho blogspot

Người đăng: kiemdaigia on Thứ Sáu, 15 tháng 4, 2011

Sơ đồ site (sitemap) rất quan trọng cho một website cũng như cho webblog. Nó giúp người lướt web dễ dàng tìm đến những chuyên mục trong toàn site để tìm một bài viết nào đó, ngoài ra còn giúp cho webmaster quản lý chặt chẽ nội dung site. Đối với cộng đồng Blogger, lâu nay các blogspotter vẫn hay dùng Table of Contents bằng script của Abu Farhan. Kiểu sitemap này có một điểm yếu là liệt kê tất cả các nhãn trên blogspot. Tuy nhiên các blogspotter thì lại thích liệt kê bài viết của một số nhãn nào đó (tức là nếu không thích liệt nhãn nào thì nhãn đó sẽ không nằm trong Sitemap, điểm này rất cần thiết). Giải pháp tối ưu là phải làm sao có một sitemap đáp ứng được nhu cầu tùy biến của blogspotter. Sau khi nghiên cứu vấn đề này, mình đã nghĩ ra ý tưởng vận dụng cách liệt kê các bài viết của một nhãn, một script rất phổ biến trên cộng đồng Blogger, để tạo ra Sitemap, kết hợp CSS tạo hai cột, vừa tiết kiệm không gian web, vừa giúp người dùng dễ dàng tùy biến theo ý thích, như Sitemap của Thủ thuật Blogger vậy.

Để tạo Sitemap như vậy, bạn hãy thực hiện như sau.

Bước 1. Đăng nhập Blogger, vào Posting (Đăng bài viết) để tạo một bài viết có tiêu đề là Sitemap (để trống phần nội dung), xuất bản bài viết để lấy URL cho trang Sitemap.

Bước 2. Vào Design >> Edit HTML. Đặt đoạn code sau đây vào trước thẻ </head>.

<b:if cond='data:blog.url == &quot;URL_trang_Sitemap&quot;'>
<script type='text/javascript'>
//<![CDATA[
function allpostslist(json) {
document.write('<ul>');
for (var i = 0; i < json.feed.entry.length; i++)
{
for (var j = 0; j < json.feed.entry[i].link.length; j++) {

if (json.feed.entry[i].link[j].rel == 'alternate') {

break;

}

}

var entryUrl = "'" + json.feed.entry[i].link[j].href + "'";
var entryTitle = json.feed.entry[i].title.$t;
var item = "<li>" + "<a href="+ entryUrl + '" target="_blank">' + entryTitle + "</a> </li>";

document.write(item);
}

document.write('</ul>');
}
//]]>
</script>
<style type='text/css'>
#sitemap{width:900px;margin:0;padding-bottom:15px;background:#ffffff;float:left;}
#sitemap ul li {list-style: disc url(/iconslist.gif) inside; vertical-align: top; padding-left:10px;margin: 0;}#sitemap ul li:hover {list-style: disc url(/iconslisthover.png) inside; vertical-align: top;padding-left:10px;margin: 0;}
.sm-left{float:left;width:45%;margin:0 20px 0px 20px;font-size:14px;tex-align:justify}
.sm-right{float:right;width:45%;;margin:0 20px 0px 20px;font-size:14px;tex-align:justify}
p.smtitle {border-bottom:1px dotted #789;clear:both;color: #2554C7;font-family:Century Gothic;font-size:25px;padding:10px 50px 5px 0;text-align:right;text-shadow:2px 2px 1px #789;text-transform:lowercase;}
#content-wrapper{display:none}
</style>
</b:if>

Trong đoạn CSS ở trên, chú ý thuộc tính display:none để ẩn đi một số ID và CLASS cần thiết. Tải 2 file icon về áp dụng cho blogspot của bạn, tránh dùng chung file: iconslist.gif iconslisthover.png.

Lưu Template.

Bước 3. Tìm dòng <div id='content-wrapper'> và đặt trước nó bằng đoạn code bên dưới.

<b:if cond='data:blog.url == &quot;URL_trang_Sitemap&quot;'>
<div id='sitemap'>
<div class='sm-left'>
<p class='smtitle'><a href='/search/label/Nhãn 1?max-results=10'>Nhãn 1</a></p>
<script src='/feeds/posts/summary/-/Nhãn 1?max-results=500&amp;alt=json-in-script&amp;callback=allpostslist'/>

<p class='smtitle'><a href='/search/label/Nhãn 2?max-results=10'>Nhãn 2</a></p>
<script src='/feeds/posts/summary/-/Nhãn 2?max-results=500&amp;alt=json-in-script&amp;callback=allpostslist'/>

<p class='smtitle'><a href='/search/label/Nhãn 3?max-results=10'>Nhãn 3</a></p>
<script src='/feeds/posts/summary/-/Nhãn 3?max-results=500&amp;alt=json-in-script&amp;callback=allpostslist'/>

</div>

<div class='sm-right'>

<p class='smtitle'><a href='/search/label/Nhãn A?max-results=10'>Nhãn A</a></p>
<script src='/feeds/posts/summary/-/Nhãn A?max-results=500&amp;alt=json-in-script&amp;callback=allpostslist'/>

<p class='smtitle'><a href='/search/label/Nhãn B?max-results=10'>Nhãn B</a></p>
<script src='/feeds/posts/summary/-/Nhãn B?max-results=500&amp;alt=json-in-script&amp;callback=allpostslist'/>

<p class='smtitle'><a href='/search/label/Nhãn C?max-results=10'>Nhãn C</a></p>
<script src='/feeds/posts/summary/-/Nhãn C?max-results=500&amp;alt=json-in-script&amp;callback=allpostslist'/>

<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.huynh-nhat-ha.blogspot.com/2011/04/sitemap-for-blogspot.html" target="_blank">Add to your blogspot ?</a></p>
</div>
</div>
<div style='clear: both;'/>
</b:if>

Chú ý: Ở đây phần nằm sau thẻ <div class='sm-left'> là cột bên trái, phần nằm sau thẻ <div class='sm-right'> là cột bên phải. Tùy theo số lượng nhãn và số lượng bài viết trên blogspot mà bạn phân phối và bố trí thêm bớt các nhãn sao cho cân đối, theo định dạng như trên.

Lưu Template là OK. :47)
More about

GẮN HỘP XEM TRUYỆN CƯỜI VÀO BLOG

Người đăng: kiemdaigia on Thứ Năm, 14 tháng 4, 2011

"""Một nụ cười bằng 10 thang thuốc bổvới 1 đoạn code ngắn và đơn giản, bạn có thể gắn hộp xem truyện cười cho Blog để khách tham quan có thể giải trí khi vào Blog của mình, các truyện này sẽ tự động thay đổi truyện khi bạn load trang và điều đặc biệt là bạn có thể thêm truyện mới do chính mình thiết lập.
Đầu tiên, bạn đăng nhập vào Blog, chọn thiết kế > thêm tiện ích > thêm HTML/Javacript, sau đó dán đoạn code này vào:

<iframe frameborder="1" width="210" src="http://www.luudiachiweb.com/truyencuoi.htm" height="200"></iframe>

Bạn có thể thay đổi chiều cao (height) hoặc chiều rộng (width) cho hộp truyện, nếu muốn màu nền cho hộp truyện thì bạn chỉ cần thêm đoạn code này style="background:#ffffff;" vào sau đoạn code 
<iframe frameborder="1" nó sẽ thành như sau:

<iframe frameborder="1"style="background:#ffffff;"width="270" src="http://www.luudiachiweb.com/truyencuoi.htm" height="200"></iframe>

Cuối cùng, bạn Save rồi trở lại vào Blog thì sẽ có một hộp xem truyện cười "dễ thương" để giải trí rồi đấy!!!
More about