Script / CSS

G1sUtil.js

G1sBlogger.js

G1sNavigationList.js

G1sCode

Posts List

2012년 2월 11일 토요일

[Blogspot] Label을 이용한 글목록(Posts List) 구현.

2012년도에 이글을 포스팅하고 지금까지 참 많은 분들이 찾아와 주셨네요.
그동안 소스를 수정한다고 마음만 먹고 실천을 못했었는데 이제야 수정해서 적용을 했습니다.
이 포스트에 있는 버전은 최대 150개까지의 포스트만 볼 수 있는 제한이 있으니 아래 링크의 글목록 기능을 적용하시길 원하시는 분은 아래 링크의 버전을 사용하여 주시기 바랍니다.

[Blogspot] 글목록(Posts List v2) with Angular.js



Blogspot에서 글 목록을 보여주는 기능을 제대로 제공해 주지 않아 고민을 하다 없으면 차라리 만들어보자는 생각아래 여러 시도끝에 드디어 Blogspot의 글목록을 제가 원하는데로 만든 것 같네요.

카테고리는 구글의 Label를 통해 어느정도 분류가 가능하지만 이것을 제대로 보여주기 위해서는 해당 카테고리의 글 목록을 보여주는 기능이 필요했었지요.

아래 내용은 제가 직접 구현한 이 포스트 위에 보이시는 Post List를 구현하는 방법입니다.

일단 코드먼저 보겠습니다.
<div>
<div id="posts" style="padding: 10px;">
</div>
<div align="center" id="posts-pgno" style="cursor: pointer;">
</div>
</div>
<script language="Javascript" type="text/javascript">
 /** url의 Parameter를 얻는 Class. **/
    var request = { 
  parameter: function(name) {
   return this.parameters()[name];
  },
  
  parameters: function() {
   var result = {};
   var url = window.location.href;
   var parameters = url.slice(url.indexOf('?') + 1).split('&');
    
   for(var i = 0;  i < parameters.length; i++) {
    var parameter = parameters[i].split('=');
    result[parameter[0]] = parameter[1];
   }
   return result;
  }
 }
 
 /** Page의 정보를 저장. **/
 var page = {
  //초기화.
  init: function(home,max){
   page.home = home;
   page.max = max;
   page.label = '';
   page.no = 1;
  },   
   
  //url의 parameter에서 pgno 값을 읽어 옮.
  setPage: function(){
   var url = window.location.href;
 
   var pl = url.lastIndexOf("/label/");
   var pq = url.lastIndexOf("?");
   
   if(pl != -1)
    page.label = url.substr(pl+7,((pq!=-1)?pq:url.length)-(pl+7));
   
   if(url.indexOf("pgno") != -1)
    page.no = request.parameter("pgno");
    
  }
  
 }
 /** feed를 parsing 하여 결과 뿌려 줌. **/
 var obj = {
  init: function () {
   obj.obj = document.getElementById('posts');
   obj.pgno = document.getElementById('posts-pgno');
  },
  
  // 검색을 요청하는 함수 
  pingSearch: function () {
   //변수 선언.
   obj.s = document.createElement('script');
   obj.s.type = 'text/javascript';
   obj.s.charset = 'utf-8';
   
   //feed callback 함수를 이용 json 객체 구한 후 pongSearch 함수호출. 
   if(page.label == '')
    obj.s.src = '' + page.home + 
     '/feeds/posts/summary/?max-results='+(page.no*page.max)
     +'&alt=json-in-script&callback=obj.pongSearch';
   else
    obj.s.src = '' + page.home + '/feeds/posts/summary/-/'
     +page.label+'?max-results='+(page.no*page.max)
     +'&alt=json-in-script&callback=obj.pongSearch';
    
   //append.
   document.getElementsByTagName('head')[0].appendChild(obj.s);
  },
   
  // 검색 결과를 뿌리는 함수 
  pongSearch: function (z) {
   obj.obj.innerHTML = '';
   
   /* 글 목록을 뿌려 줌. */
   for (var i = (page.no-1)*page.max; i < page.no*page.max; i++) {
    //예외처리.
    if(i >= z.feed.openSearch$totalResults.$t)
     break;
    
    //변수선언.
    var li = document.createElement("li");
    var a = document.createElement('a');
    
    //link로 사용할 base url.
    var url = page.home + '/search';
    if(page.label != '')
     url += '/label/' + page.label;
    
    //최종 link를 url 입력.
    if (i == 0) 
     a.href = url + '?max-results=1';
    else {
     var pub=obj.changeTime(z.feed.entry[i-1].published.$t);
     a.href = url + '?updated-max=' + pub 
     + '&max-results=1&pgno='+page.no;
    }
    a.innerHTML = obj.escapeHtml(z.feed.entry[i].title.$t);
     
    //append
    li.appendChild(a);
    obj.obj.appendChild(li);
   }
    
   /* page 뿌려줌. */
   obj.pongPgno(z);
  },
  
  // page를 뿌려주는 함수.
  pongPgno: function(z){
   obj.pgno.innerHTML = '';
   var before = document.createElement('a');
   var next = document.createElement('a');
   
   var ten = parseInt((page.no-1)/10);
   var total = z.feed.openSearch$totalResults.$t;

   /* before page */
   before.innerHTML = ' << ';   
   if(ten>0)
    obj.onMouseDown(before, ten*10);
   obj.pgno.appendChild(before);
   
   /* page number */
   for(var i=ten*10; i< (ten+1)*10; i++){
    if(i >= total/page.max)
     break;
    var a = document.createElement('a');
    obj.onMouseDown(a,i+1);
    
    a.innerHTML = ' ' + (i+1) + ' ';
    
    if(i+1 == page.no)
     a.style.color = 'yellow';     
    obj.pgno.appendChild(a);
   }
    
   /* next page */
   next.innerHTML = ' >> ';
   if(ten< parseInt(total/page.max/10))
    obj.onMouseDown(next, (ten+1)*10+1);
   obj.pgno.appendChild(next);
  },
   
  //mouse click event.
  onMouseDown: function(a, i){
   a.onmousedown = function(){
    page.no = i;
    obj.pingSearch();
   }
  },

  //Time 에러 수정.
  changeTime: function(str){
   var s = str.lastIndexOf('.')-1;
   var e = str.lastIndexOf('+')+1;
   
   var str2 = str.substr(0,s) + '%2B' + str.substr(e,100);
   
   return str2;
  },
  
  // HTML태그 안 먹게 하는 함수
  escapeHtml: function (str) {
   str = str.replace(/&/g, "&");
   str = str.replace(/</g, "<");
   str = str.replace(/>/g, ">");
   return str;
  }
 };

 page.init('http://creatorhong.blogspot.com', 5);
 page.setPage();
 obj.init(); 
 obj.pingSearch();
</script>
길군요...

그래도 그냥 복사 붙여넣기만 하면 되니...

바꾸실 곳은 아래쪽에 page.init('http://creatorhong.blogspot.com', 5);! 각각 블로그의 url 주소와 한 list안에 보여지는 최대 post 수를 입력하면 됩니다. 이때 url 주소 끝에 '/' 가 들어가면 안되구요.

최대 post수를 넘어가는 것은 번호를 넘겨가며 볼 수 있으니 적당한 수를 입력하시면 됩니다. 저 같은경우 5개로 지정하였습니다.

그리고... 앞쪽에 있는 <div> 태그내부에 style를 추가하시거나 css로 꾸미시는 것은 자유!.

이제 끝. 수정할 부분을 수정 하신 후 Blogger에서 제공하는 HTML/javascript 가젯에 코드를 붙여 넣기만 하면 됩니다.

HTML/javascript 가젯 추가하는 것을 모르시는 분이나 저처럼 Post 위쪽에 Posts List를 위치시키는 것이 궁금하신 분들은 링크 의 Post를 참고하시기 바랍니다.

아래는 구현 내용 설명....

전에 구현했던 코드 에서는 url의 label 부분을 읽어서 전체 feed에서 동일한 label를 찾아 순서대로 출력하는 방식이었는데요.
이때 url 인코딩을 제대로 처리 안하고 한 덕분에 여러가지 문제가 있었죠.

그래서 이번에는 url의 Label 를 읽는 것은 같으나 읽은 Label를 가지고 Label 마다 고유의 feed를 불러서 출력해주게 수정하였습니다. 그리고 각 List의 post link 를 post 고유 link가 아닌 Label에서의 순서를 통한 link로 입력하여 post를 눌러도 url 에 Label 이 남도록 수정 하였습니다.

더해서 접었다 펼 수 있게 했던 이전 코드와는 달리 정해진 수 만큼의 List을 항상 띄우고 아래 List Page Number 를 이용해 다음 List로 넘길 수 있도록 수정 하였습니다.

현재 Post Title만을 출력 되도록 하였는데... 혹시라도 label 이나 post 등록 날짜 등을 출력 하고 싶으시면 obj.pongSearch 부분을 수정하시면 됩니다.

이제보니 시간 설정을 표준시간대비 '-'인 곳의 대한 처리를 하지 않았군요. 알려주신 Samuel 님께 감사드립니다.
코드는 댓글에도 있지만.... 표준 시간대비 '-'이신 분들은 위에 코드 중 change:Time 부분을  아래 코드로 바꿔서 사용해 주시면 됩니다.
changeTime: function(str){
    var s = str.lastIndexOf('.')-1;
    var e = str.lastIndexOf('+')+1;

    if(e<1){
        e = str.lastIndexOf('-')+1;
        var str2 = str.substr(0,s) + '-' + str.substr(e,100);
    }
    else{
        var str2 = str.substr(0,s) + '%2B' + str.substr(e,100);
    }
    return str2;
},

댓글 218개:

  1. 감사합니다. 아무리 찾아도 없어서 답답했었는데 이렇게 올려주시다니!
    내일 한 번 해봐야겠네요 ^^^

    답글삭제
    답글
    1. 문제있으면 바로 댓글 주세요^^

      삭제
  2. 갈수록 멋있어지는 블로그네요 ^^

    답글삭제
  3. 감사합니다. 구글 블로그를 막 시작하는 입장에서 너무 도움이 되는 소스입니다. 잘 사용하겠습니다. 그런데 블로그 세팅에서 시간대가 표준시간대비 '-' 일 경우 (예: 미국, 캐나다 등)를 고려하지 않으신것 같아서 아래와 같이 수정하여 사용하고 있습니다.

    changeTime: function(str){

    var s = str.lastIndexOf('.')-1;
    var e = str.lastIndexOf('+')+1;

    if(e<1)
    {
    e = str.lastIndexOf('-')+1;
    var str2 = str.substr(0,s) + '-' + str.substr(e,100);
    }
    else
    {
    var str2 = str.substr(0,s) + '%2B' + str.substr(e,100);
    }

    return str2;
    }

    답글삭제
    답글
    1. 아. 그렇군요. - 시간대는 고려를 안했네요. 감사합니다. ^^

      삭제
    2. 아..이 소스는 미국블로그를 운영할때 쓰는건가요?

      삭제
    3. 네 아래쪽에 새로 추가한 부분은 설정한시간대가 미국쪽이나 표준시간대비 '-'인 곳에서 쓸때 수정하셔서 쓰면되구요 쓰는거구요. 위에 기본적인 것을 그대로 쓴다면 한국이나 '+' 시간대에서는 아무 무리 없이 작동할겁니다. ^^

      삭제
    4. 와우, 정말 감사합니다!^^
      염치 없지만 세 가지만 여쭤봐도 될까요;;

      1. 목록의 숫자 부분의 색을 노란색 말고 다른 색으로 변경 가능할까요??
      2. 글목록 Gadget을 블로그의 위, 아래 모두 놓고 싶은데, 가능한가요?? 무식하게 그냥 위, 아래 똑같이 하니까 아래는 아무것도 안나오네요ㅠ
      3. 포스트 제목과 함께 등록날짜와 라벨을 추가하고 싶은데, 위의 간단한 언급만으론 문외한인 제가 도저히 응용할 수 없네요;;ㅋ

      시간 되실 때 답변해 주시면 정말 감사하겠습니다^^

      삭제
    5. 아이쿠+ㅁ+ 엉뚱한데 답글을 달았네요;; 삭제하셔도 좋습니다ㅠ

      삭제
    6. 댓글이 어디 달렸는지 찾느라 좀 헤맸네요 ㅋ

      1. 선택된 숫자 말씀하시는 것이죠? 물론 가능합니다.
      pongPgno: function(z) 로 시작하는 함수부분에서
      if(i+1 == page.no)
      a.style.color = 'yellow';
      굵게 표시한 yellow 부분을 수정해주시면 됩니다.

      2. 가능은 할거 같으나... 좀 신경써야 할 부분이 있을거 같네요. 블로그를 알려 주시면 확인한 후에 알려드릴 수 있을 것 같습니다.

      3. 이 부분은 좀 기니.... 가장 밑에 새로 답글로 달겠습니다.

      삭제
  4. 감사합니다. 덕분에 포스트 리스트를 추가해서 블로그가 심플해졌네요!
    잘 쓰겠습니다^^

    답글삭제
  5. 정말 멋지십니다!천재예요!
    와우~!! 근데 한가지 여쭐게 있어요. 님의 블로그는 글목록이 다섯줄로 줄로 되있는데 저는 옆으로 되요.그건 왜인지..무식하여서..하하~

    답글삭제
    답글
    1. 정확히 어떤걸 말씀하시는지 약간 헷갈리는데요. 지금 블로그에는 적용을 안한 상태시죠? 이따가 확인하시고 정확하게 어떻게 되는지 설명해 주시면 제가 파악하는데 도움이 될 듯 하네요 ^^

      삭제
    2. 음 아까 문의드린 사항은 잘 해결이 됬는데요 외관은 완전히 됬는데 포스트리스트의 리스트항목을 눌러도 그쪽으로 연결이 되지 않아요. 뭐가 문제일까요. 제 블로그좀 보고 체크해주세요..해주시면..감사!
      http://jinimall.blogspot.com/

      삭제
    3. 보니까 사용하시는 시간대가 표준시간대비 '-' 시간대를 쓰시네요. -7:00로 나오는 걸로 봐서...미국 동부쪽 시간대인거 같은데, 정확히는 모르겠군요.
      시간설정을 '+'시간대로 바꿔 주시던가, ChangeTime 함수를 제일 밑에 추가된 함수로 바꿔주시면 정상 작동할 것 같습니다. ^^

      삭제
    4. 아..제가 그런시간대를 쓰고 있었군요..하하~함수를 바꾸게 되면 'change time'글자만 지우고 저 함수를 넣는 건가요? 아님 어디까지 지우고 넣는건가요..? 제가 너무 무식한 질문을 하고 있죠..? 죄송합니다!

      삭제
    5. 와아~됐어요 됐어~해피해피^^ 너무 감사해요! 정말 좋은 정보였어요! 헤헤.감사감사!앞으로 자주자주 블로그 놀러올께요! 굿굿굿!

      삭제
    6. 네. 다행히 잘 되었나보군요. 잘 사용하세요 ^^

      삭제
  6. 안녕하세요 블로그지기님.
    저는 지금 미국에서 구글블로그로 블로깅을 막 시작한 완전초보 블로거입니다.
    제가 블로그를 어떻게 만들어야 할지 도무지 알길이 없어 이곳저곳 돌아다니다.
    정말 유익한 이곳을 알게됬습니다.
    저도 지금 블로그지기님께서 하신것처럼 포스트 리스트 목록이 보이게 하고싶은데요.
    이 블로그를 보고 아무리 따라해도 왜 안되는지 모르겠습니다...
    지금 저는 미국 텍사스주에 살고있고요 시간대는 GMT - 6 사용하고 있습니다.
    저좀 도와주실수 있으신가요?

    답글삭제
    답글
    1. 죄송합니다 아래 추가한 부분에는 쉼표(,)를 달지 않았군요. 수정했습니다. ^^

      삭제
  7. 으흠 자세히 보니 } 이 기호뒤에 ,가 있어서 따라 찍어보니 되네요 ^^
    이런이런 ㅎㅎ 그런데 블로그지기님 혹시 포스트 리스트가 날짜순으로 나올수는 없나요?
    제일먼저 작성한게 1번페이지 맨윗줄에 보일수 있도록이요.
    지금은 맨처음작성한게 맨 마지막 페이지 맨밑에줄에 보이게 되어있는 부분이요.
    정말 유익한 자료 감사합니다. 화이팅하세요.

    답글삭제
    답글
    1. 이 방식이 블로거에서 제공하는 feed를 파싱하여 보여주는 방식인데 블로거 feed의 정렬순서가 최신순으로 되있어서 작성순으로 보여주게할려면 조금 더 복잡한 방식으로 코드를 수정해야 할 것 같네요;;;

      삭제
    2. 흐음 전 지금의 방식도 전혀 이해가 불가능하니 목록리스트는 더이상 손대지 않기로 결심했습니다^^
      물론 지금도 아주아주 만족을 하고있고요 ㅎㅎ
      앞으로도 유용한 포스팅 기대하겠습니다.
      감사합니다.

      삭제
    3. ㅎㅎ 네^^ 잘 사용하세요. ㅋ

      삭제
  8. 위에 시간과 라벨을 추가하고 싶다는 분이 있어서.... 시간과 라벨은 g1sObj.pongSearch(z) 부분을 바꿔 주시면 되는데요... 해당 함수 부분을...

    pongSearch: function (z) {
    g1sObj.obj.innerHTML = '';

    /* 글 목록을 뿌려 줌. */
    for (var i = (g1sPage.no-1)*g1sPage.max; i < g1sPage.no*g1sPage.max; i++) {
    //예외처리.
    if(i >= z.feed.openSearch$totalResults.$t)
    break;

    //변수선언.
    var li = document.createElement("li");
    var div = document.createElement('div');
    var a1 = document.createElement('a');
    var a2 = document.createElement('a');

    //link로 사용할 base url.
    var url = g1sPage.home + '/search';
    if(g1sPage.label != '')
    url += '/label/' + g1sPage.label;

    //최종 link를 url 입력.
    if (i == 0){
    a1.href = url + '?max-results=1';
    a2.href = url + '?max-results=1';
    }
    else {
    var published = g1sObj.changeTime(z.feed.entry[i - 1].published.$t);
    a1.href = url + '?updated-max=' + published + '&max-results=1&pgno='+g1sPage.no;
    a2.href = url + '?updated-max=' + published + '&max-results=1&pgno='+g1sPage.no;
    }
    //제목만 a.innerHTML = g1sObj.escapeHtml(z.feed.entry[i].title.$t);

    //시간.
    var ldiv = document.createElement('div');
    var published = z.feed.entry[i].published.$t;
    var y,mm,d,h,m,s;
    y = parseInt(published.substr(0,4));
    mm = parseInt(published.substr(5,2));
    d = parseInt(published.substr(8,2));
    h = parseInt(published.substr(11,2));
    m = parseInt(published.substr(14,2));
    s = parseInt(published.substr(17,2));
    var date = new Date(y, mm, d, h, m, s);
    var dt;
    if(published.charAt('+'))
    dt = (parseInt(published.substr(25,2)) * 60 + parseInt(published.substr(28,2)))*60000;
    else
    dt = (-parseInt(published.substr(25,2)) * 60 - parseInt(published.substr(28,2)))*60000;
    var rdate = new Date(date.getTime() + dt);
    a1.innerHTML = g1sObj.escapeHtml((1900+rdate.getYear()) +"."+ rdate.getMonth() +"."+ rdate.getDate() +". "+ rdate.getHours() +":"+ rdate.getMinutes() +":"+ ((rdate.getSeconds()<10)?"0"+rdate.getSeconds():rdate.getSeconds()));

    //제목
    var rdiv = document.createElement('div');
    div.className = "g1sPostsPost";
    ldiv.className = "g1sPostsLeft";
    rdiv.className = "g1sPostsRight";
    a2.innerHTML = g1sObj.escapeHtml(z.feed.entry[i].title.$t);
    rdiv.appendChild(a2);
    //라벨
    for(var j in z.feed.entry[i].category){
    var a3 = document.createElement('a');
    a3.href = g1sPage.home + '/search/label/' + z.feed.entry[i].category[j].term + '?max-results=1';
    a3.innerHTML = g1sObj.escapeHtml('['+z.feed.entry[i].category[j].term+']');
    rdiv.appendChild(a3);
    }

    ldiv.appendChild(a1);
    div.appendChild(ldiv);
    div.appendChild(rdiv);

    //append
    li.appendChild(div);
    g1sObj.obj.appendChild(li);
    }

    /* page 뿌려줌. */
    g1sObj.pongPgno(z);
    },

    로 바꿔 주시면 됩니다.
    그리고 이렇게 하면 정리가 잘 안되니 가장 앞부분의 (script 태그 밖)

    <style>
    .g1sPostsPost{clear: both;}
    .g1sPostsLeft{float:left; width:150px;}
    </style>

    와 같은 css를 추가해 주시면 됩니다.

    답글삭제
    답글
    1. 정말 친절하시네요!
      덕분에 궁금했던 것들이 모두 해결되었습니다^^
      (두번째 질문은 디자인을 그냥 바꾸기로 해서 패스!ㅋ)

      지금은 만들기 시작한지 얼마 안 돼서 보여드릴게 없고요, 나중에 완공(?)되면 님의 도움을 꼭 언급하도록 하겠습니다. 감사해요!

      삭제
    2. 도움이 되셨다면 다행이구요 :)
      나중에 완공 되시면 구경 좀 시켜주세요 ㅋ

      삭제
    3. "작성한 HTML 파일은 허용되지 않습니다: 태그는 허용되지 않습니다.: STYLE"다고 해서 질문을 여기에

      http://hi5656.blogspot.kr/2012/09/g1-html.html

      옮겼는데요,ㅠㅠ

      ----저도 레벨과 시간이 표시되게 따라하려고 해봤는데, 어디서 잘못따라한건지 리스트가 없어졋여요ㅠㅠ ,


      죄송하지만, 시간되시면 좀 알려주세요ㅠㅠ 감사합니다.

      삭제
    4. 아 이해하시기쉽게 제 소스의 라인번호로 설명드리면...
      82번 줄 부터 113번 줄 까지의 내용을 제가 댓글로 달았던 걸로 바꿔주시면 됩니다.

      밑에 CSS 부분은 소스가 적용된 가젯 가장 앞부분에 넣어주시면 되구요. ^^

      삭제
    5. 와~~ 답글 감사합니다ㅠㅠ

      어디서 잘못 한건지 아직도 리스트 목록이 사라져있어요ㅠㅠ


      [ 실패한 두가지 방법의 코드부분도 있음
      http://hi5656.blogspot.kr/2012/09/82-113.html


      82번 줄 부터 113번 줄 까지의 내용을 홍선생님이 댓글로 달았던 걸로 바꿔주고,



      밑에 CSS 부분은 소스를 적용된 가젯 가장 앞부분에 넣어주엇지만, 그런데, 여전히,, 목록리스트 사라지고 'Post list'타이틀만 보입니다.ㅠㅠ



      그래서 113번줄까지가 아니라, 117번줄까지지가 아닐까 해서요, 왜냐면, 댓글에 달아주신 코드부분 끝이 "



      /* page 뿌려줌. */
      g1sObj.pongPgno(z);
      },



      <<<----이 부분인데, 원 코드에도 117번줄까지가 비슷한게 잇어서요,,,그래서 또82~ 117번줄까지 바꿔봤지만,,, 그런데, 여전히,, 목록리스트 사라지고 'Post list'타이틀만 보입니다.ㅠㅠ








      **제가, 이코드를 수정한건 블로그주소[이건 당연히바꿔야한다고 하셧고]와

      리스트 글개수를 '40'개로 한거에요ㅠ*

      삭제
    6. 아. 죄송합니다. 117번째가 맞구요.
      제가 댓글에 달았던 소스가 잘못된 소스네요.
      그리고 지금 적용이 잘 안되는 것도 제 실수네요.
      g1sObj 부분을 모두 obj로 바꿔주시면 될 듯 합니다.
      blogspot는 댓글 고치기가 안되니.... 위의 댓글은 지우고 새로 달던지 해야 다른분들도 혼동하지 않겠네요.

      삭제
    7. 아.... 지우면 밑에 분들 댓글도 지워질려나.....
      아무튼 수정된 코드 다시 적습니다.
      이 코드를 위의 원본 코드의 82번 줄부터 117번 줄부분과 바꿔주시면 됩니다.

      pongSearch: function (z) {
      obj.obj.innerHTML = '';

      /* 글 목록을 뿌려 줌. */
      for (var i = (page.no-1)*page.max; i < page.no*page.max; i++) {
      //예외처리.
      if(i >= z.feed.openSearch$totalResults.$t)
      break;

      //변수선언.
      var li = document.createElement("li");
      var div = document.createElement('div');
      var a1 = document.createElement('a');
      var a2 = document.createElement('a');

      //link로 사용할 base url.
      var url = page.home + '/search';
      if(page.label != '')
      url += '/label/' + page.label;

      //최종 link를 url 입력.
      if (i == 0){
      a1.href = url + '?max-results=1';
      a2.href = url + '?max-results=1';
      }
      else {
      var published = obj.changeTime(z.feed.entry[i - 1].published.$t);
      a1.href = url + '?updated-max=' + published + '&max-results=1&pgno='+page.no;
      a2.href = url + '?updated-max=' + published + '&max-results=1&pgno='+page.no;
      }
      //제목만 a.innerHTML = obj.escapeHtml(z.feed.entry[i].title.$t);

      //시간.
      var ldiv = document.createElement('div');
      var published = z.feed.entry[i].published.$t;
      var y,mm,d,h,m,s;
      y = parseInt(published.substr(0,4));
      mm = parseInt(published.substr(5,2));
      d = parseInt(published.substr(8,2));
      h = parseInt(published.substr(11,2));
      m = parseInt(published.substr(14,2));
      s = parseInt(published.substr(17,2));
      var date = new Date(y, mm, d, h, m, s);
      var dt;
      if(published.charAt('+'))
      dt = (parseInt(published.substr(25,2)) * 60 + parseInt(published.substr(28,2)))*60000;
      else
      dt = (-parseInt(published.substr(25,2)) * 60 - parseInt(published.substr(28,2)))*60000;
      var rdate = new Date(date.getTime() + dt);
      a1.innerHTML = obj.escapeHtml((1900+rdate.getYear()) +"."+ rdate.getMonth() +"."+ rdate.getDate() +". "+ rdate.getHours() +":"+ rdate.getMinutes() +":"+ ((rdate.getSeconds()<10)?"0"+rdate.getSeconds():rdate.getSeconds()));

      //제목
      var rdiv = document.createElement('div');
      div.className = "g1sPostsPost";
      ldiv.className = "g1sPostsLeft";
      rdiv.className = "g1sPostsRight";
      a2.innerHTML = obj.escapeHtml(z.feed.entry[i].title.$t);
      rdiv.appendChild(a2);
      //라벨
      for(var j in z.feed.entry[i].category){
      var a3 = document.createElement('a');
      a3.href = page.home + '/search/label/' + z.feed.entry[i].category[j].term + '?max-results=1';
      a3.innerHTML = obj.escapeHtml('['+z.feed.entry[i].category[j].term+']');
      rdiv.appendChild(a3);
      }

      ldiv.appendChild(a1);
      div.appendChild(ldiv);
      div.appendChild(rdiv);

      //append
      li.appendChild(div);
      obj.obj.appendChild(li);
      }

      /* page 뿌려줌. */
      obj.pongPgno(z);
      },

      삭제
    8. r감사합니다ㅠㅠㅠ 다시 수정한 코드를 따라 해봣는데요,,

      리스트목록에 레벨이 표시되고, 시간도 표시되는데,,ㅠ 좀 이상한게 잇어서요, 수정이 안되는건지 모르겟네요ㅠㅠ

      http://hi5656.blogspot.kr/2012/09/blog-post_17.html
      [이상한 부분 캡쳐사진]


      선생님의 리스트는 "글 제목이 맨앞에 오고 아래에 레벨이 잇고, 젤 뒤로 시간이 보이는 "데 저의 것은 시간이 젤위에 잇고 다음 글제목 앞을 장식하는 흑점이 가운데 놓이고 그 아래에 글제목이 뜨는게,,,,, 보시다싶히 좀 이상하게 나오는요ㅠㅠ 블로그 넓이 조정해봐도 소용없네요ㅠㅠ





      듣기로 컴퓨터 설정에 따라 달리 보일수도 잇다해서 캡쳐햇어요,,





      보시다 싶히,,, 선생님의 것과 저의것 시간이 다

      "3912.0.15. 6:0:00"



      이런 식으로 이상하게 표시되네요ㅜㅜㅜ,,선생님의 컴퓨에서도 저렇게 보이시나요?

      2012.4.3 ----이런 정상적인 시간표시로 나타나게 할수 없는건가요?



      이게 시간대문젠가 해서 '설정-언어 서식'에 보니 태평양 시간대로 되잇는걸 '+9 서울'로 해봣는데 역시 수정되진 않네요,ㅠㅠㅠ

      삭제
    9. 아. 미쳐 못봤는데... 일단 저는 hi 님과는 다르게 나오긴 하는데 9월 부분이 오동작을 하긴 하는군요.

      중간에 보시면 y = parseInt(published.substr(0,4)); 부분부터 s = parseInt(published.substr(17,2)); 부분을 아래코드로 바꿔주시면 일단 월 부분은 해결이 될 것이구요.

      y = 1 * published.substr(0,4);
      mm = 1 * published.substr(5,2);
      d = 1 * published.substr(8,2);
      h = 1 * published.substr(11,2);
      m = 1 * published.substr(14,2);
      s = 1 * published.substr(17,2);

      의미는 같을텐데... 왜 parseInt가 저렇게 작동하는지 모르겠네요.... 흠....
      일단 그건 나중문제고....
      그리고 년도가 왜 그렇게 나오는지는 저도 잘 모르겠네요.
      저는 년도는 정상적으로 나옵니다.

      다른사람 블로그도 이상하게 나오는걸로봐서....
      아무래도 블로거의 설정보다는 브라우져나 PC의 시간설정쪽이 의심돼긴하지만요.

      아... 근데 선생님이라는 호칭은 계속 부담이.... ㅎㅎ;;

      삭제
    10. 오 역시 브라우져 문제였군요.
      항상 크롬만 쓰다보니.... 크롬과 ie가 getYear 함수가 다르게 표시되는 군요.

      a1.innerHTML = g1sObj.escapeHtml((1900+rdate.getYear()) +"."+ rdate.getMonth() +"."+ rdate.getDate() +". "+ rdate.getHours() +":"+ rdate.getMinutes() +":"+ ((rdate.getSeconds()<10)?"0"+rdate.getSeconds():rdate.getSeconds()));

      부분을

      a1.innerHTML = g1sObj.escapeHtml(rdate.getFullYear() +"."+ rdate.getMonth() +"."+ rdate.getDate() +". "+ rdate.getHours() +":"+ rdate.getMinutes() +":"+ ((rdate.getSeconds()<10)?"0"+rdate.getSeconds():rdate.getSeconds()));

      로 바꿔주세요.
      브라우져 상관없이 년도가 정확히 표기 될 겁니다.

      덕분에 저도 좋은 것 배우네요. ^^

      삭제

    11. 감사합니다^^

      첨에 월 부분 수정은 하니까, '0'에서 '9'로 바뀌더군요,,,,




      그런데 년도 부분은 해보니 또 리스트 목록이 사라집니다ㅠㅠㅠ 두개 동시에 수정해도 리스트가 사라지구요ㅠㅠ

      http://hi5656.blogspot.kr/2012/09/blog-post_19.html
      [적용한 코드잇음]

      따라하는것도 쉽지 않네요 ㅎㅎ




      아쉽지만 아무래도 리스트에 시간표기는 포기해야 할듯 하네요,,,, 네이버 블로그처럼 구글도 쉽게 설정하게 할수 잇게 해주면 좋겟다만ㅠㅠ




      G1님 처럼,, 리스트에 글제목. 그 아래에 레벨이 있고, 시간표기를 안하면(잠시 아쉬운대로 시간표기는 뺀다면) 저 코드에서 어느부분을 빼면 되죠?

      삭제
    12. 죄송해요. 또 제 실수네요. 코드를 백업해놓은게 있는데 백업한 코드랑 여기코드랑 틀려서 계속 실수를 하네요.
      시간 안나오게 할려면 꽤 여러곳을 고쳐야 돼서요. 제가 새로 적용하시라고 한 코드를 아래 코드로 수정하시면 될거에요.

      a1.innerHTML = obj.escapeHtml(rdate.getFullYear() +"."+ rdate.getMonth() +"."+ rdate.getDate() +". "+ rdate.getHours() +":"+ rdate.getMinutes() +":"+ ((rdate.getSeconds()<10)?"0"+rdate.getSeconds():rdate.getSeconds()));

      그리고 제 것 적용한거는 또 나중에 수정을 거친거라서요.
      수정하려고 하면 꽤 여러군데를 건드려야 하는데..... 음.....

      삭제
    13. 리스트에 시간표기도 나오고 ㅎㅎㅎ 정말 감사합니다^^



      단지,,, 리스트에 글목록과 레벨/카테고리의 색상이 G1님것처럼 다르게 안되는건가요?

      혹시나 해서

      '템플릿->고급->링크->링크 색상' 을 변경하면 색상이 다르게 되지않을까 기대햇는데ㅜㅜㅜㅜ

      변경해봣지만 글목록과 레벨/카테고리의 색상이 동시에 변하네요ㅠㅠ





      그리고 전의 답글에서 "왜 parseInt가 저렇게 작동하는지 모르시겟다고"하셧는데요,,

      제가컴맹이라 잘모르는건데요,,, 혹시 ' parseInt'란게 리스트부분에서 글제목/레벨/시간 등 배체순서나 위치와 관련된다는거죠?

      그니까 저의 것은 지금 글제목 앞을 장식하는 흑점이 가운데 놓엿다가 이번 수정으로 젤앞에 놓이는데, 그다음 글제목 아닌 역시 시간이 잇고 그 다음 글제목이 뜨고 제목아래가 아닌 직접 이이서 레벌/카테고리가 이어져 있네요,,,,, 보시다싶히 좀 이상하게 나오잖아요ㅠㅠ 블로그 넓이 조정해봐도 소용없구요ㅠ

      (**파이어폭스에선 저렇게 보이지만, ie에선 "여전히 시간- 흑점-글제목,레벨" 이런 구조로 보이는군요 ^^, 물론 G1님의 리스트는 어디서나 다 저렇게 보기 좋게 다같게 나타납니다^^)

      g1님처럼 글 제목이 맨앞에 오고 아래에 레벨이 잇고, 젤 뒤로 시간이 보이는면 좋겟는데요ㅠ

      이게 다 같은 코드인데,,다르게표시되엿다는 거겠죠? 스킨이 달라서 그렇던가 한거겠죠?


      미안합니다;; 제가 질문을 너무만이 해서요-_-;

      삭제
    14. http://hi5656.blogspot.kr/2012/09/blog-post_22.html
      [리스트 캡쳐 해본이미지

      삭제
    15. 아... 아니요. 제건 여기 포스팅 한 후에 몇번 코드 수정을 거치면서 저렇게 배치되도록 수정이 된거라서요.
      이것저것 세세하게 설명드리기는 좀 그렇고 제 블로그에 적용된 소스를 링크 올려주신 hi 님 블로그에 댓글로 달아드릴게요. ^^

      삭제
    16. 아 그리고 parseInt 는 레이아웃과 관련 된 거는 아니고 문자를 숫자로 바꿔주는... 역활을 하는 함수입니다. 사람이야 문자와 숫자 구분이 자연스레 되지만 컴퓨터는 안그래서요. 저렇게 문자로 된걸 숫자로 바꿔주는 역활을 해 줘야하거든요. ^^

      저게 왜 저렇게 작동하는지는 이유는 찾았습니다. ㅎ

      삭제
    17. 정말감사합니다^^

      글제목 아래 레벨이 잇고, 좌측에 시간이 표기되구요,,, 레벨과 글목목 색상도 다르게 뜹니다 ㅎㅎ

      단지 아직 흑점위치가 가운데 보이거나 하네요ㅜㅜ


      그리고 이번에 알려주신 코드에선

      //시간

      바로 위부분의
      이 부분코드

      //제목만 a.innerHTML = obj.escapeHtml(z.feed.entry[i].title.$t);

      가 빠지던데요,,, 이게 빠져도되는건가요?
      제가 빠지거나 잇는걸로 다 해봣는데,,뭐가 달라지는건지는 모르겠지만요ㅠ


      댓글은 G1님의 블로그에만 해주셔도 됩니다^^
      물론 저의 블로그에 캡쳐이미지와 적용한 코드가 무슨 문제가 잇는가해서 링크 햇었던거지요,,, 이렇게 답변해주시는것도 감사할 따름인데요^^

      제가 블로그 설정에 봐도 댓글글자수 어떻게 제한을 없애는건지 모르겟으요,,아마 또 코드입력해서 하는거겟죠




      삭제
    18. //제목만 a.innerHTML = obj.escapeHtml(z.feed.entry[i].title.$t);

      부분은 주석이라고 해서 코드에 영향을 미치지 않는 부분이라 빠져도 되구요.
      댓글은 블로거 자체적으로 막고 있는거라 어떻게 제한을 풀 수는 없을 거에요.

      흑점 위치는 hi 님 블로그 전체 소스를 보니까

      <style>
      .g1sPostsPost{clear: both;}
      .g1sPostsLeft{float:left; width:150px;}
      </style>

      부분이 들어가 있네요.
      아무래도 이리저리 수정하면서 예전에 넣으셨던 코드가 지워지지 않고 있어서 그런것 같은데.....

      의심되는 부분은 템플릿>맞춤설정>고급>CSS 추가 부분인데... 그 외에도 이전에 적용했던코드 중에 위 코드를 지워주시면 됩니다. ^^

      말씀대로 댓글은 여기에다만 적을게요.

      삭제
    19. ㅎㅎ, 정말 감사합니다^^

      G1님의 지적대로 템플릿>맞춤설정>고급>CSS 추가 부분에 그런 코드가 잇더군요,,,

      그때 그기에 추가하는게 아니라 해서 지운다는것이 깜박하고는 지웟다고 생각햇는데,,, 블로그주인인 저보다 더 빤히 아시고 계시네요^^


      그것을 지우고 나니까 , 흑점-글제목, 아래에 레벨 젤우측에 시간이 표기됨, 감솨!! 단지
      아래 페이지 표시 <<1>>


      의 좌측 부분

      <<

      이 위로 따로 떨어져 나감니다;;

      http://hi5656.blogspot.com/2012/09/5-httphi5656.html [캡쳐와 적용코드부분잇음]

      삭제
    20. 포스트 내용과 관련잇다면 잇는거지만요,, 코드를 보류해야 하니까요^^

      블로그 '설정-기타'에 '블로그 가져오기 - 블로그 내보내기 '가 잇는데, 블로그내보내기 하면은 블로그 레이아웃/템플릿설정이나 지금 이 가젯에 추가한 코드랑도 포스트글과 함께 다 그대로 저장되고 블로그 가져오기 해서 그대로 쓸수도 잇는거겠죠?

      질문을 너무 많이해서 ㅠㅠ

      삭제
    21. 미쳐 예상하지 못한 상황이네요.... font 사이즈가 16 이하이면 그렇게 나타나는 군요.
      아무래도 일단 아래 내용을 수정해 주시면 됩니다. 아마 앞에서 10번째 줄일거 같은데....

      <div align="center" id="posts-pgno" style="cursor: pointer;">

      부분을

      <div align="center" id="posts-pgno" style="cursor: pointer; font-size: 17px;">

      로 수정해 주시면 될 겁니다. 17px 부분은 그보다 큰 다른 수로 하셔도 되구요. ^^

      삭제
    22. 블로그 내보내기에서 설정까지 그대로 가져가지는 않을 것 같은데요....
      자세한거는 해보지를 않아서.....
      코드 같은 경우 따로 백업을 해두시고 다시 적용하시면 어렵지 않게 하실 수 있을 겁니다. ^^

      삭제
    23. ㅎㅎㅎ 고쳣습니다;;;

      테스트결과 17로 하니깐요, < 하나는 돌아오지 않아서 자꾸해보다
      29px 이상이여야 << 다 제자리로 돌아오는군요ㅠㅠ

      사이즈가 좀 크서 작으면 더좋겟으나, 여튼 제모양새는 갖췃네요;;ㅎㅎ

      정말 감사합니다^^

      삭제
    24. 29나요?? 흠.... 확실히 모양이 안이쁘네요. 다른방법으로 해보죠...

      <div align="center" id="posts-pgno" style="cursor: pointer;">

      앞에

      <br/>

      을 넣어보세요.

      <br/>
      <div align="center" id="posts-pgno" style="cursor: pointer;">

      이렇게 되는거죠... 이렇게 해도 될거에요.

      삭제
    25. 네^^ 그렇게 수정하니까 덕분에 블로그가 정말 보기좋아 졋습니다;;


      정말 감사합니다^^ Thank you very much~~

      삭제
    26. 네~ 수고하셨습니다~ ㅎ

      삭제
  9. 매쉬업을 적용한 취업 블로그를 개설해보려고 노력하고 있는 대학생입니다.^^
    여기서 많은 가르침 얻고 갑니다. 좋은 하루 되세요~!!

    답글삭제
    답글
    1. 가르침이라고 까지는 없는데... ㅎㅎ ^^ 멋진 블로그 만들어나가시길요.

      삭제
  10. 안녕하세요
    검색을 통해 알게 되었는데요
    코드를 그대로 붙여넣었더니
    목록은 잘 읽어와 지는데 레이아웃이 이상해요 ㅠ.ㅠ
    원래 글 목록이 세로로 죽 늘어져야 되는데
    가로로 퍼지고
    5개씩 묶는 페이지 번호도 글 목록 아래쪽에 있어야 되는데 오른쪽으로 가있네요 ㅠ.ㅠ
    혹시 어떻게 수정해야 하는지 아시나요?

    답글삭제
    답글
    1. 가로로 퍼진다라.... 정상적이지는 않네요...
      css를 적용해서 그렇게 할 수는 있지만....
      혹시 이전에 해당 css를 적용한 적이 있으신지요?
      흠... 그거 외에 딱히 떠오르는건 없는데...
      적용된 블로그를 보면 어떤지 알 수 있을 것 같은데 프로필에 있는 블로그를 따라가니 거기는 적용이 안되있네요. 적용을 했다 풀어버리신건지....

      삭제
    2. 적용해 보았습니다ㅠ.ㅠ
      한번 확인해 주시겠어요?ㅠㅠ

      삭제
    3. 아... 제일 위쪽 페이지 넣는 곳에 위젯을 넣으셨네요.
      그곳에는 그런식으로 적용되도록 css가 적용되어 있어요.
      세로로 나왔어도 글뿐만 아니라 우측 메뉴들도 아래쪽으로 내려와 보기 좋지는 않을 듯....

      저처럼 본문 위에 적용하시려면 제 다른 글인 http://creatorhong.blogspot.kr/2012/02/blogger-layout.html 의 내용을 봐주세요.

      삭제
  11. 정말 ^ ^ 감사합니다. !!! 많은 도움이 되었습니다!

    답글삭제
    답글
    1. 도움이 되었다니 다행입니다. ㅋ

      삭제
  12. 안녕하세요.
    열심히 보면서 따라해보려는데, /head 위에다 넣어도 오류, /body 위에다 넣어도 오류네요.
    본문의 하단에 삽입하고 싶은데 html 수정에서 어디다 붙여넣어야 할까요?

    답글삭제
  13. d이문제는 해결햇습니다ㅠㅠㅠ
    전 +시간대 그대로 나둬서 -시간대 어쩌구 하길래 관계없는건가 햇다가,,, 혹시나 해서 따라서 바꿔보니까 되네요;;;; 정말 감사합니다;ㅠㅠㅠ

    답글삭제
  14. 우왕~ 딱 제가 찾던거였는데

    감사합니다. ^^

    답글삭제
  15. 안녕하세요
    덕분에 많은 도움되었어요
    실례지만 질문 하나 있어서 글 남기고 가요 ㅠㅠㅠ
    라벨로 카테고리 만들어서 클릭하면 포스팅한게 하나만 나오게 하고 싶은데 아무리 소스 건들여도 그냥 다 나오네요
    참고로 data:label.url 이 소스 건들였는데 안되더라고요
    포스팅 하나만 나오게 어떻게 해야될까요
    답변 기다리겠습니다 좋은 밤되세요 :)

    답글삭제
    답글
    1. 마지막에 '?max-results=1' 를 해주시면 될거에요.

      http://블로그 URL/search/label/라벨명?max-results=

      예제 >> http://creatorhong.blogspot.kr/search/label/blog?max-results=1

      삭제
  16. 문득;; 한가지문제 발견햇는데요,

    리스트와 원문의 시간이 9시간차이가 나는것같네요;


    예;;

    북한산 영봉 등정
    [등산][일상][번개]2012.10.3. 6:30:00

    ---원문 시간: 오후 9:30

    답글삭제
    답글
    1. 다른시간대로도 텟스트해봣는데요,,

      위 Samuel님 댓글에서 시간대관한 내용이 있는데요, 컴맹이라 잘 이해못햇어요,

      G1님의 코드는 '-'시간대로 설정하면 안되고 '+'로 해야제대로 작동하는거죠?

      -시간대를 쓰려면, Samuel님의 말씀한;;

      changeTime: function(str){

      var s = str.lastIndexOf('.')-1;
      var e = str.lastIndexOf('+')+1;

      if(e<1)
      {
      e = str.lastIndexOf('-')+1;
      var str2 = str.substr(0,s) + '-' + str.substr(e,100);
      }
      else
      {
      var str2 = str.substr(0,s) + '%2B' + str.substr(e,100);
      }

      return str2;
      }

      ---<<수정해야 한다는거죠?




      다른 시간대로 바꿔가면서 시간이 맞나 테스트해봤는데요,, 꼼꼼하게는 못하고 대강 해봣는데요,,
      리스트와 본문이 링크가 안먹히기도 하네요,, 리스트에서 몇번 클릭해도 반응없다가 어떤때 본문으로 넘어가기도 하네요, 시간대 문제이겟죠?

      삭제
    2. -시간대로 해놧는데, 로그아웃해서 지금 해보니 또 리스트에서 본문으로 링크가 잘되네요,, 그래도 언제또 잘 안되거나 불안정한건지 모르겟네요,, 만일 코드가 +시간대 전용이라면요,,

      삭제
    3. 아. 그렇군요.
      저는 시간이 2012-10-02T21:30:00.000+09:00 로 표기되길래
      2012년 10월 2일 21시 30분이 표준 시간대고 거기다가 제가 사용하는 시간대가 +09:00 시간대니까 이 시간을 더해야 한다.... 라고 생각했는데... 알고보니 저 값 자체가 더해져서 나온 값인가보네요
      그럼. 더하거나 빼는 작업은 필요 없을 듯..... 좀 더 확인해보고 본문 수정해야겠네요.

      삭제
    4. 위의 Samuel님의 시간대 코드로 바꿔어져있었더라구요;; 그래서 본문과 리스트가 링크연결이 된것같기도 하네요ㅠ

      삭제
  17. 이리저리 몇일을 찾다가 이제서야 좋은 자료를 찾았네요. 감사히 잘 쓰도록 하겠습니다.

    답글삭제
  18. 좋은정보 정말 감사드립니다 ^^ 덕분에 구글블로그에 조금씩 흥미를 갖게 되었습니다~
    앞으로도 좋은 포스팅 부탁드려요 ~

    답글삭제
    답글
    1. 요즘 블로거를 잘 안하고 있긴 한데.... 노력하겠습니다... ㅎㅎ..

      삭제
  19. 죄송합니다ㅠㅠ자꾸많이 질문해서요;;;;;;;


    리스트의 레벨과 시간이 링크없는 일반텍스트로 나타나게 코드를 만드는게 더 복잡한건가요?

    에전에 답글에서 시간부분이 안나타나게하는건 코드변경이 더힘들다고 말씀하셨던것 같은데요;;

    답글삭제
    답글
    1. 아. 시간부분 안나타나게 하는건 힘들다기 보다는... 이것저것 고쳐야 되서 귀찮은 작업이였던 거구요.(제 귀차니즘이 심해서....)
      라벨과 시간을 일반 텍스트로 나타나는건.... 음... 간단히 될 것 같네요.

      보시면 시간은 a1 에다가 넣어주고, 라벨은 a3에 넣어주는 데요.
      이 a1과 a3에 href 부분을 안주면 될겁니다.

      적용하신 소스의

      if (i == 0){
      a1.href = url + '?max-results=1';
      a2.href = url + '?max-results=1';
      }else{
      var published = obj.changeTime(z.feed.entry[i - 1].published.$t);
      a1.href = url + '?updated-max=' + published + '&max-results=1&pgno='+page.no;
      a2.href = url + '?updated-max=' + published + '&max-results=1&pgno='+page.no;
      }

      부분을

      if (i == 0){
      a2.href = url + '?max-results=1';
      }else{
      var published = obj.changeTime(z.feed.entry[i - 1].published.$t);
      a2.href = url + '?updated-max=' + published + '&max-results=1&pgno='+page.no;
      }

      로 주시면 시간이 일반 텍스트로 될 거구요.

      a3.href = page.home + '/search/label/' + z.feed.entry[i].category[j].term + '?max-results=1';

      부분을 지워주시면 라벨이 일반 텍스트로 될 겁니다.

      삭제
    2. ㅜㅜ 감사합니다 ㅋㅋ 너무좋아요;;;

      삭제
  20. feedback;

    저만 이런경우가 잇는건지 모르겟다만요;;;가끔 목록리스트의 글제목을 클릭하면 왜서인지 다른포스트 본문이(대개는 바로 아래의 문장인것같아요) 펼쳐지거나 아무런 작독이 없는 경우가 잇습니다ㅠ 그래서 그 글을 지우고 다시 작성해등록하면 본문과 정확하게 링크되 열리기도 합니다ㅜ


    리스트에 시간까지표시되는게 정말좋은데;;;시간표시를 없애기가 정말 안타까운데;...옥에티라할까 본문시간과 일치하지 않는것이죠; 제가할수잇는 방법으로 시간대를 바꿔가면서 보니까 -11 시간대인가에서 같아지던데요,,그런데,왠걸 금방보니 리스트에 2013년 0월이라 되잇길래 결국 저의 이런 무식한 방법으론 애초에 해결이 안되는거엿네요ㅋㅋ 아마 서울시간으로 쓰다가도 어느떄면 시간이 정확하게 합치되는 구간이 있는거겟죠ㅋㅋ 정말 코드만드는거 배우고싶은데,,,어떻게 어디서부터 시작하는건지 모르겟으서리ㅠㅠㅠ..

    G1님께서 귀차니즘을 이겨내시고 ......해결해주시길 기다려봅니다 ㅠㅠ


    답글삭제
    답글
    1. -11이 아니라 -10시간대로 해놧더군요;;

      삭제
    2. ㅎㅎ 제가코드의 //시간, 타임에러수정부분을 삭제하면 목록에 시간만 사라질까했는데,,,ㅋㅋ 이런막무가내로는 안되는거군요ㅋㅋ

      삭제
    3. 이런 제 귀차니즘이 사라지길 좀 오래 걸리실것 같은데요..... 제가 이래뵈도 귀차니즘 쪽이 상당히 심해서...;;;;;;;
      요즘 off 쪽으로 좀 바쁜 시기라 좀 걸릴 듯 하지만 될 수있는데로 시간을 내보기로 하겠습니다..... ㄷㄷ....

      삭제
  21. 위에 댓글 썼다가 지우고 다시 써요.
    잘 되는 줄 알았는데 문제가 좀 있어요 ㅠㅠㅠ
    포스트목록에 <<1 2>> 요렇게 있잖아요. 여기서 현재 2페이지인데
    1페이지 (노란색)로 클릭을 해도 넘어가지질 않아요 ㅜㅜㅜ

    그래도 목록이 생기고 나니까 보기에도 편하고 좋아요 ㅠㅠ
    글쓴이님 진정한 능력자!!! 울트라캡숑따봉천재이심.
    뭐가 문제인지 좀 알려주세요 ㅜㅜ

    답글삭제
    답글
    1. 어떻게 안되는지 현상을 봐야 할 것 같은데요.
      혹시 적용되어있는 블로그를 알려주실 수 있나요?

      삭제
    2. http://gomnyecharm.blogspot.kr/

      입니다. 아..아직 정말 아무것도 몰라서 ㅜㅜ
      전 제 이름 클릭하면 블로그로 이동되는줄 알았어요. ㅜ_ㅜ

      삭제
    3. 잘 되는 것 같은데요?
      노란색이 현재 페이지 입니다.
      최신 글이 1 페이지로 오도록 되어 있습니다.

      삭제
    4. 아네 :) 후에 시간을 서울 기준으로 바꾸고 포스트에 올리신걸로 다시 해놓으니까 제대로 되네요. 홍님 블로그 포스트로 제 블로그 꾸리는데 정말 많은 도움이 됬어요. 대단하세요. 따봉!!!

      ps. 다른 포스트 중에 갤러리 페이지 하는거를 보고 저도 만들어봤는데 문제가 있어요.그 이미지폴더를 들어가서 보면 이미지들이 이상하게 흐릿흐릿하게 블러되보이는 현상은 어떻게 고치죠? 상위 포스트와관련없는 질문이라 죄송합니다. 그리고 바쁘실텐데, 계속 이것저것 물어봐서 더 죄송ㅜ G1님 귀찮으시겠지만, 언제든 마음내키실때 한번만 봐주시고 문제점도 해결해주시면 안될까요? 또한번 죄송하고 감사드립니다(꾸벅)

      삭제
    5. 아. 그건 썸네일을 써서 그런데... kim clare 님 썸네일이 좀 작게 나오네요.
      작은 썸네일을 억지로 늘려서 그런 겁니다.
      간단하게 수정할 수 있는 것으로는 원본을 쓰는 건데....
      작은것을 늘리는 것과는 반대로 큰 원본을 줄이는 거라.... 아무래도 작은 이미지를 다운로드 받는 것보다 시간은 좀 더 걸리겠네요...

      json.feed.entry[i].media$group.media$thumbnail[0].url

      부분이 2개 정도 있을텐데요.
      그 두개 소스를

      json.feed.entry[i].media$group.media$content[0].url

      이 것으로 바꿔주시면 될 겁니다.

      삭제
    6. 와우! 진짜 감사합니다!!
      이런걸 다 어떻게 아세요? 진짜 대단하세요..... 감탄연속!!

      근데 테스트를 해보니 좀 이상한게..ㅜ 폴더들어갔다가 다시 전체앨범보기를 누르니까 내블로그의 개요로 페이지가 바뀌는데. 왜그러죠? ㅜㅜ아..미춰버리겠네 ㅜ

      삭제
    7. 감탄까지... 감사합니다. ㅎㅎ..

      전체앨범보기는 a 태그에

      href="http://www.blogger.com/blogger.g?blogID=5809566467335435438#PicasaGallery"

      부분이 있으실 거에요. 필요없는 부분이 들어가 있네요.
      그 부분을

      href="#PicasaGallery"

      이렇게 바꿔주시면 됩니다.

      삭제
    8. 대박. 천재이심. 컴퓨터학원선생님이신가요? ㅎㅎㅎㅎㅎㅎ
      어떻게 딱 보면 아세요...? 아님 제가 진짜 심각한 수준이라는건데...네...;
      진짜 G1님 아니었음 구글블로그 때려치웠을꺼에요 ㅜㅜ
      아직도 어려운게 많이 있지만, 나름 배워가는 재미도 있네요.
      님덕분에 많이 배워가고 배껴가고(?;;) 암튼 정말정말 감사합니다.

      앞으로 더이상 귀찮게 안해드릴께요. 흙흙 죄송했습니다.
      많이 많이 놀러올께요!! 님 완전짱 하늘에서 내려온 천사이심! 울트라캡숑짱!

      삭제
    9. ㅎㅎ.. 컴퓨터 학원 선생님은 아니구요. ㅋ
      직업에 전공이 아무래도.... ㅎㅎ..
      많이 놀러오세요.. ^^

      삭제
  22. 검색과정에서 발견했습니다. 감사합니다 잘 쓸게요..

    답글삭제
  23. 안녕하세요. 구글 검색을 통해서 들어왔는데 제가 딱 원하던 기능에 대한 글을 써주셨네요!

    1. 현재 저는 워드프레스를 사용하고있는데 GOne Hong님이 쓴 코드를 그대로 입력하면 GOne Hong님의 결과물이 그대로 나오는데,
    제 주소로 바꾸니 아무것도 나오질 않네요ㅜ
    제가 로컬호스팅을 사용해서 그런건지 궁금합니다.

    2. GOne Hong님이 쓴 저 코드만 따로 php파일로 만들어서 제가 원하는 위치에 넣고싶은데 방법이 있을까요?

    글 읽어주셔서 고맙습니다!

    답글삭제
    답글
    1. 죄송합니다. 댓글 확인이 늦었네요.
      제가 워드프레스는 다뤄보지 않아서요.
      위의 소스는 blogspot 에서 제공하는 API를 이용한 겁니다.
      워드프레스에서 적응은 안될 것으로 보여지네요.

      삭제
  24. 감사합니다~ 포스트 목록이 없어서 조금 불편하던 차였는데 덕분에 깔끔한 목록 위젯 하나 달았네요. 잘 쓰겠습니다^^
    다만 제꺼는 다른 글들은 문제가 없는데 이상하게 최초로 썼던 글만 목록과 링크가 안되네요ㅠ 얘만 혼자 2012년에 쓴 거라 그런가 싶기도 하고요. 제가 지금 영국에 사는데 여긴 시간대가 +도 -도 아닌 0라 그런 건지;; 아니면 지금이 썸머타임이라서 뭐가 꼬였는지... 흠;; 코드를 손 대보고 싶긴 한데 저 changeTime 함수가 무슨 역할을 하는 앤지 모르겠어서 일단은 그냥 뒀네요ㅎㅎ;

    답글삭제
    답글
    1. 아... 또 그런 문제가... changeTime 은 그대로 blogspot에서 표현하는 시간대를 실시간대와 맞춰주는 부분입니다. 그 부분이 어떤 오류를 발생하는지는 추가 확인이 필요하겠네요...

      삭제
  25. (이런, 댓글 실수 죄송...)

    먼저 이처럼 '훌륭한' 자료를 공개해주셔서 감사합니다! :)

    한가지 궁금한 것이 있어 글 남깁니다. (물론 급한 것은 아닙니다... :)
    아직 제 블로그가 공사 중이라 게시글도 없고해서 '구글 공식 블로그' 사이트로 테스트해 보았는데요, 페이지를 넘기다보니 이상하게 500개 이상은 표시되질 않네요.
    원래 500개로 제한된 건가요?

    읽어주셔서 고맙습니다.

    답글삭제
    답글
    1. 현재 적용된 코드상 500개가 한도인것 같네요.
      현재 방식은 blogspot에서 제공하는 RSS 값을 읽어서 보여주는 건데요.
      한 페이지에 보여주는게 최대 500개 까지 가능한 것 같습니다.
      좀더 알아봐야겠지만 페이지를 넘기듯 다음 500개를 불러 올 수도 있을 것 같은데요.
      자세한 것은 좀 더 분석을 해봐야 알 것 같습니다. ^^

      삭제
    2. 아, 그렇군요.
      어쨌거나 이 문제는 500개 이상의 포스트를 쓰고나서 천천히 다시 생각해 볼랍니다. ㅎㅎㅎ
      답변 주셔서 고맙고요, 잘 쓰겠습니다. :)

      삭제
    3. 네. 잘 사용하세요~ ^^

      삭제
  26. 감사합니다^^ 잘쓰겠습니다

    답글삭제
    답글
    1. 요즘은 블로그 신경을 잘 못쓰다보니 답글이 늦었네요
      잘 사용하세요~ ^^

      삭제
  27. 감사합니다!! 많은 도움되었습니다 !잘 사용하겠습니다!

    답글삭제
  28. 안녕하세요! 블로그를 처음 시작하는 새내기 입니다. 좋은 자료 정말 감사드립니다 : )

    그런데 블로그에 HTML 가젯을 이용해 적용해보았는데, 주소부분만 교체하고 삽입했습니다.

    그런데 공란만 표시되고, 목록을 볼 수가 없는데 어떤 부분이 문제인 걸까요?

    두루뭉술하게 질문드려 죄송해요;;;

    답글삭제
    답글
    1. 너무 늦게 답변 드려 죄송합니다.
      최근 블로그 관리를 잘 못하다보니 이제야 확인했네요.
      죄송하지만 댓글만으로는 어떤현상인지 알기 힘든데요? 혹시 적용된 블로그나 수정된 부분 소스 부분을 알 수 있을까요?

      삭제
  29. 굉장한 팁이네요! 없는 기능을 아예 만들어 버리시다니 ㅎㄷㄷㄷㄷ

    답글삭제
    답글
    1. 전 어디까지나 있는 기능을 가지고 만든거니까요.
      그렇게 대단하지는 않습니다. ^^
      댓글 감사합니다.

      삭제
  30. 질문드려요... 이렇게 했는데 어떤 게시물은 읽히지가 않더라구요ㅠㅠ 왜그런건가요

    답글삭제
    답글
    1. 읽히지 않는 게시물은 뭔가 패턴을 봐야 할 것 같네요.
      혹시 적용된 블로그 주소를 알 수 있을까요?

      삭제
  31. 정말로 감사드립니다! 한국의 모든 초보 블로거 유저에게 큰 은혜를 베푸셨어요.
    https://googledrive.com/host/0B2BMsyKCByYeWENyZWcySThhb3c에 올려놓고 불러와서 쓰겠습니다.

    답글삭제
    답글
    1. 특히 주석까지 친절하게 달아 주셔서 많은 공부가 되었습니다. 이 포스트 덕분에 스크립트 언어에 관심이 생겼어요.^^

      삭제
  32. 아차 제가 로그인도 안하고 퍼간다는 글을 남기는 실례를 했었네요. 죄송합니다^^;;;"

    답글삭제
    답글
    1. 실례라뇨. ^^ 도움이 되셨다면 다행이구요.

      삭제
  33. 정말 감사드립니다!! 얼마전에 새로 블로거 시작했습니다.
    코딩도 쥐뿔도 모르는데, 이렇게 좋은 자료를 올려주셔서 대단히 감사드립니다. 검색하면 항상 첫 번째로 뜨시더라구요. ㅋ

    다만, 부탁좀 드려도 될지요?
    제가 위에 올려주신 코드를 그대로 들고 와서 써보는데, 레이아웃이 깨집니다. 저 혼자 고쳐보려고 아무리 낑낑대도 안 되네요. 어디가 잘못된 것일지요?
    주소는 http://msmkorea2013.blogspot.kr/ 입니다.

    답글삭제
    답글
    1. 위젯을 넣는 부분이 잘못되었네요. 헤더 밑에 위치한 해당 부분에는 CSS가 적용되어 있어서 가로로 정렬이 됩니다.
      아래 링크의 포스트를 참고하시기 바랍니다.
      http://creatorhong.blogspot.kr/2012/02/blogger-layout.html

      삭제
  34. 안녕하세요.
    GOne Hong님이 올려주신 글 덕분에 구글블로그가 하나하나 모양이 잡혀가는데요~
    여쭤볼께 있어서 이렇게 댓글을 남깁니다.

    GOne Hong님이 올려주신 소스에다가 디자인과 위치를 좀 수정해서 Posts List 를 만드는데 성공을 했는데요.
    문제는 List에 있는 글 제목을 눌렸을때 그에 맞는 글본문이 안나온다는거에요.
    아무리찾아봐도 소스를 수정해도 자꾸 이상한대로만 수정이되서
    이렇게 여쭤봅니다;ㅅ;

    도와주세요;ㅅ;

    블로그주소는 http://mdstheboon.blogspot.kr 입니다.

    답글삭제
    답글
    1. 확인해 보니 -07:00 시간대를 쓰시는 군요.
      - 시간대에 대해서 추가된 부분이 블로그 본문 마지막에 있을겁니다.

      간단하게는
      var e = str.lastIndexOf('+')+1;
      var str2 = str.substr(0,s) + '%2B' + str.substr(e,100);
      부분을
      var e = str.lastIndexOf('-')+1;
      var str2 = str.substr(0,s) + '-' + str.substr(e,100);
      로 바꿔주시면 될겁니다.

      삭제
    2. 추가로 카테고리 부분 적용한 부분에도 한가지 오류가 있네요.
      수정안하셔도 무리는 없을것 같지만.....
      var eyelash shop = new Category( .....
      부분과
      <a id='category-eyelash shop' .......>
      부분의 띄어쓰기부분이 eyelash shop 사이의 공백이 문제가 됩니다.
      공백에 - 를 넣거나 하여 채워주시기 바랍니다.
      var eyelash-shop = new Category( .....

      <a id='category-eyelash-shop' ......>

      삭제
    3. 우왕우왕'ㅁ'!!~ㅋㅋ
      되요되요 ~ 우왕ㅋㅋㅋ
      감사합니다^^~

      삭제
  35. 안녕하세요?
    GOne Hong님 덕분에 열씸히 공부하며 적용하고 있는데요,
    저희 경우는 리스트가 아래로 나오지 않고 옆으로 나오네요... 어떤 부분이 문제가 되는지 부탁 드려도 될까요?
    저의 블로그는
    http://ldorftrading.blogspot.de 입니다.

    그리고 구글 블로그는 인터넷 익스플로러에서는 보이지 않는것인가요?
    GOne Hong님의 블로그도 그렇고 다른분들의 블로그도 그렇고 아무것도 뜨지 않습니다.
    현재 IE 8.0버전의 익스플로러구요...
    답변 부탁드려도 될까요?

    답글삭제
    답글
    1. 안녕하세요~
      증상으로는 위젯을 넣는 부분이 잘못되었었던 것 같은데 이미 수정을 하셨나보네요.
      저처럼 나오게 할려면
      http://creatorhong.blogspot.kr/2012/02/blogger-layout.html
      의 내용을 참고하시면 됩니다.

      인터넷익스플로러 문제는... 저는 IE8, IE10 다 잘 보입니다.
      브라우져를 타도 레이아웃만 깨지지 아예 안보이지는 않을텐데....
      IE 재설치나 업데이트를 한번 해보는게 좋을것 같네요.

      삭제
    2. 감사합니다.
      그냥 레이아웃 변경에서 드래그앤드롭으로만으로 되는것이 아니었었네요...
      좌측이나 우측 또는 아랬쪽에 배치를 하면 되었는데 포스트 상단으로 이동시키면 리스트가 옆으로 나오고 그랬는데....
      감사합니다. 많은 도움이 되었습니다.

      삭제
    3. 네. 상단 가젯은 CSS가 적용되어 있어서 리스트가 옆으로 나옵니다.
      도움이 되었다니 다행이네요. ^^

      삭제
  36. 안녕하세요~
    구글블로그 쓰면서 딱 있었으면 좋겠다고 생각한 기능이었는데, 검색하다보니 좋은 방법을 발견했어요.
    덕분에 제 블로그에도 적용할 수 있었네요~
    감사합니다!^^ 잘 쓰겠습니다~~~^^

    답글삭제
  37. 포스트 리스트에 나오는 게시글을 클릭해도 이동을 안하는데 무슨 문제가 있는걸까요? 소스코드는 똑같이 복붙했고 고치라는것도 다 고쳤습니다...
    http://totallyfinewithme.blogspot.kr/
    입니다...

    답글삭제
    답글
    1. 아 위에 몇개 답글 보고 원인 파악해서 해결했습니다 시간이 문제였네요 감사합니다 ^^

      삭제
    2. 해결하셨다니 다행이네요~ 잘 사용하세요~

      삭제
  38. 포스트 도움이 잘 되었습니다 감사합니다.

    허나 리스팅 되는 글씨 크기를 바꾸고 싶은대 어떻게 해야될지 알려주시면 감사하겠습니다!

    답글삭제
    답글
    1. 아. 이런 답변이 늦어졌네요. 제가 요즘 블로그에 신경을 못쓰다보니....
      몇가지 방법이 있는데 간단하게는
      93라인 var a = document.createElement('a');
      뒤에
      a.style.fontSize = '10pt'
      와 같이 입력해주시면 될겁니다~

      삭제
  39. 감사합니다.
    주의사항으로 가능성은 희박?하지만 일정 잡기(게시 날짜 및 시간)가 같은 경우 오동작합니다.
    (1분 이내로 임시 저장된 것을 동시에 게시할 경우)

    답글삭제
    답글
    1. 아 그런 현상이 있나요?
      음.... 그렇네요... 그런문제가 있을 수 있을 것 같네요...
      언제고 코드를 대대적으로 손볼 생각을 하고 있긴한지 실천이 안되네요....
      다음에 기회되면 손을 보도록 하겠습니다!

      삭제
  40. 좋은 포스팅 잘 보고 잘 따라 하구 가요 :D
    +1 눌렀어요 앞으로 친하게 지내염 헤헤

    답글삭제
    답글
    1. 앗 +1 씩이나... ㅎㅎ 감사합니다. ^^

      삭제
  41. 좋은 글 읽고 갑니다. 아직 초보 블로거라서 어렵지만, 하나씩 배우겠습니다. : ]

    답글삭제
    답글
    1. 배울만한게 얼마나 있을지 모르겠네요. ^^ ㅎㅎ..

      삭제
  42. 안녕하세요/ 위에것을 복사해서 리스트를 만들어보려고 적용시켜봤는데
    공란이떠서 문제점을 알고싶어서요
    비공개로 작업중인데 잠시 공개해서 홍님의 충고를 받고싶습니다~

    답글삭제
    답글
    1. 근데 갑자기 또 적이되어버렸네요... 계속안되다가 질문만 하고나면
      다시 되버리는 현상. 무튼 좋은정보감사합니다~

      삭제
    2. 구글 블로그스팟에서 공개하고 있는 API를 이용한거라 비공개 블로그에는 에는 기능이 잘 적용되지 않을 수 있습니다.

      삭제
    3. 안녕하세요 코드를 처음 적용하였는데,
      << >> 는 10개이상이 되면 자동으로 적용이 되는건지요
      1부터 7까지 있는데 >> 를 누르면 다음으로 넘어가지 않습니다
      혹시 10 부분을 5로 수정하면 될까요
      http://starletzzang.blogspot.com 입니다.

      삭제
    4. +쟁이기구 님 댓글을 두군데 남기셨군요.
      아래에 댓글 달았습니다.

      삭제
  43. 예전에 질문드렸던 사람입니다..
    카테고리별 리스트 목록을 늘리고 싶다고 물어봤었는데..
    어느 블로그 스킨을 스느냐에 따라 목록을 못늘릴수도 있다고 하셨잖아요..

    그럼 목록을 늘릴려면 어떤 스킨을 사용하는게 좋나요??

    답글삭제
    답글
    1. 죄송합니다 예전 질답 내용이 기억이 안나네요;;;;
      제가 어떤 의도로 그런 답변을 했었는지도..;;;
      댓글들 찾아봤는데 어떤 댓글인지 모르겠네요....
      카테고리별 리스트 목록을 늘리는거는 스킨의 영향을 안받을 것 같은데;;;;
      왜 그렇게 답을 했을까요... 제가..

      삭제
  44. 안녕하세요! list 만들고 위치까지 상단에 했는데 문제가 생겼네요.
    막상 list에 제목을 누르면 그 포스팅으로 이동하지 않고 페이지가 그대로 머무는데..
    무슨 문제일까요 ㅠㅠ?

    답글삭제
    답글
    1. 음.... 이런 문제를 일으킬 수 있는 가능성은 워낙 많아서...
      오타가 있을 수도 있고...

      블로그 주소를 알려주시면 직접 현상을 봐야 알 수 있을 것 같습니다.

      삭제
  45. http://herdin86.blogspot.kr/ 저도 같은 문제가 생깁니다..

    답글삭제
    답글
    1. 잘 해결 되신것 같네요. 잘 사용하세요~

      삭제
  46. 방금 익명으로 남긴 사용자입니다.
    @The_Boon 님의 댓글을 보고 고쳐서 작동을 합니다. 감사드립니다!
    그런데 궁금증이 있는데 답변에
    "확인해 보니 -07:00 시간대를 쓰시는 군요. " 라고 답하셨는데
    블로그만 보고 어떤 시간대를 사용하는지 어떻게 아셨는지
    또 시간대라고 하는 것이 뭘 의미하는지 알 수 있을까요 ㅠㅠ??

    답글삭제
    답글
    1. 위에 구현된 소스는 RSS를 파싱하여 구현되어 있습니다.
      블로그는 대부분 RSS 피드를 제공하는데요. 님의 RSS 피드는 http://herdin86.blogspot.com/feeds/posts/default 입니다.
      해당 부분 중 published 태그로 감싸있는 곳에 보시면 2014-05-19T01:38:00.001-07:00 와 같이 나오는데요.
      2014-05-19T01:38:00.00 값은 님이 게시물을 올린 표준시간대의 시간입니다. 여기서 -07:00 는 7시간을 빼주라는 것이죠.
      아시다시피 세계시간이 경도에 따라 다르기 때문에 위와같이 표기됩니다. 참고로 한국의 경우 +09:00 시간대를 사용하고 있구요.
      BlogSpot에서 시간대 설정은 [ 설정 › 언어 및 서식 ] 에서 수정하실 수 있습니다.

      삭제
  47. 카테고리 만드는 법도 좀 올려 주시면 감사하겠습니다.

    답글삭제
  48. 찾으시는게 [Blogspot] 카테고리 만들기 가 맞는지 모르겠네요. ^^
    아 이미 찾으셨군요.

    답글삭제
  49. 안녕하세요 좋은정보 정말 감사드립니다. 덕분에 글 목록을 가지게 되었어요!

    질문하나 드리고자 합니다. 지금 현재 제 블로그 (http://silvertown0121.blogspot.com)은 댓글을 달려면 댓글없음 요걸 눌러줘야 댓글창이 뜨게 되는데, 항상 댓글입력창이 열려있도록 하는 방법이 있을까요?

    답글삭제
    답글
    1. 네 제가 사용한 방식을 쓰시면.. 댓글창이 안보이실 겁니다.
      댓글 창이 보이게 할려면... 상당히 까다로울 듯 하네요...

      삭제
  50. 안녕하세요 코드를 처음 적용하였는데,
    << >> 는 10개이상이 되면 자동으로 적용이 되는건지요
    1부터 7까지 있는데 >> 를 누르면 다음으로 넘어가지 않습니다
    혹시 10 부분을 5로 수정하면 될까요
    http://starletzzang.blogspot.com 입니다.

    답글삭제
    답글
    1. 네 << 와 >> 부분은 포스트의 숫자를 넘기는 겁니다.
      포스트를 한번에 20개씩 보여주고 계시네요.
      아직 한동은은 <<, >> 버튼은 활성화가 안되실듯도 하네요... ㅎㅎ..

      그건 그렇고 블로그를 잘 해놓으셨네요.
      제가 배울게 많을 듯....

      삭제
  51. 안녕하세요. 구글블로그에 카테고리를 만들다가 이 글을 보았습니다. 이 코드를 적용하면 목록에 모든 라벨의 글들이 나오는데 특정라벨의 글만 나오게 하려면 어떻게 하면 될까요? 제블로그(http://knowhow-textcube.blogspot) 상단에 생활정보/ 자료실/ 기타 등등. 이런 식으로 따로 따로 페이지를 만들어 각각의 페이지에 이 코드를 넣고 싶습니다. 생활정보를 클릭하면 생활정보의 글만 나오게 하려고 하는데 잘 안되네요.

    답글삭제
    답글
    1. 안녕하세요~. 블로그는 현재 비공개로 되어져 있는지 접근이 안되네요.
      이 소스는 현재 라벨기반으로 주소를 찾도록 되어져 있어 특정 라벨로 들어가시면 해당 라벨의 글만 나오실 겁니다.
      그렇게 보시는게 아닌 페이지에다가 위 소스를 받아 넣으시려면... 몇가지 수정이 필요한데요.
      부분부분 수정해야 하는 곳이 좀 되서.... 편법으로 하고자 한다면, pingSearch 부분에

      //feed callback 함수를 이용 json 객체 구한 후 pongSearch 함수호출.
      if(page.label == '')
      obj.s.src = '' + page.home +
      '/feeds/posts/summary/?max-results='+(page.no*page.max)
      +'&alt=json-in-script&callback=obj.pongSearch';
      else
      obj.s.src = '' + page.home + '/feeds/posts/summary/-/'
      +page.label+'?max-results='+(page.no*page.max)
      +'&alt=json-in-script&callback=obj.pongSearch';

      소스앞에 page.label = '원하는라벨명' 을 주시면 원하시는데로 작동은 할 것으로보여집니다. 수정해야 하는것들이야 안쓰는 소스들 정리해주는 것이구요.

      삭제
    2. 알려주신 대로 pingSearch 부분을 찾아 위의 코드대로 수정을 했지만 라벨별로 글이 출력되지 않고 모든 글이 나와 버립니다. http://knowhow-textcube.blogspot.com/ 상단의 자료실 상식 페이지를 봐주시기 바랍니다. 생활정보페이지는 다른 코드를 적용한 것인데 그것은 여기에 있는 코드처럼 페이지를 넘기는 기능이 없고 미리 정해놓은 수 만큼 출력되어서 불편합니다 .

      삭제
    3. 죄송합니다. 댓글 확인이 늦어서 이제야 답글을 다네요.
      지금은 다른 방식으로 적용하신 것 같네요...

      삭제
  52. 정말정말 감사한 블로그입니다. 이제 좀 블로그 같아지네요. 정말 감사합니다 ( ' ' )( .. )
    한가지 궁굼하고 아쉬운건 블로그 하단에 페이지 번호가 나오는 기능도 있었음 했지만 여튼 정말 감사합니다 !

    답글삭제
    답글
    1. 댓글 감사합니다. 페이지 번호는 어떤 이유로 필요하신 가요? 자세한 건 봐야 겠지만 blogspot는 페이지 번호라고 할 만한건 없는 것 같고, 날짜로 구분이 되는 것 같습니다.

      삭제
  53. 정말 감사합니다~~^^ 정말 매우 유용합니다!

    답글삭제
  54. 구글 블로그 쓰면서 늘 아쉬웠던 부분인데, 덕분에 아주 쉽게 유용한 기능을 얻었네요.
    이렇게 멋진 소스를 공개해 주셔서 정말 감사 드립니다!

    답글삭제
    답글
    1. 도움이 되셨다니 다행이네요. 잘 쓰시기 바랍니다~

      삭제
  55. 올려주신 유용한 팁들 감사한 마음으로 잘사용하고 있습니다^^ 이 방식대로 제 블로그에 포스트 리스트를 넣어보니 쥔장님의 포스트 리스트 처럼 바탕색이 검지않고 투명하게 표시됩니다. 레이아웃 설정의 바닥글 옵션에서는 텍스트 색상과 가젯 제목 색상 변경 옵션만 제공하네요. 배경색 변경은 없고.. 쥔장님의 포스트 리스트처럼 바탕색을 검은색으로 바꾸는 방법이 없을까요? 그리고 제 블로그 같은 경우 카테고리에 있는 태그를 클릭하면 난잡하게 여러글들이 표시되는데 쥔장님처럼 한페이지 하나의 글만 표시되게끔 설정하는 방법은 어떻게 하는건가요? 제 블로그 주소는 http://koreanurbanlegends.blogspot.kr/ 입니다.

    답글삭제
    답글
    1. 바탕색은 템플릿이 달라서 그런것 같네요. 간단하게는 <style>#HTML1{ background:black; }</style> 만 같이 적용해 주시면 될 것 같네요.

      카테고리가 한페이지에 하나씩 표시되게 하려면, 마지막에 ?max-results=1 을 붙여주시면 됩니다. 최대 max-result 뒤의 수 만큼 페이지가 표시됩니다.

      삭제
    2. 빠른 답변 감사합니다! 말씀 해주신대로 해보니 딱 원하는대로 적용이 되었네요- 고마움의 표시로 해드릴 수 있는 것이 배너클릭밖에 없네요..앞으로도 유용한팁들 보러 자주 방문하겠습니다^^

      삭제
    3. 베너 클릭 감사합니다. ㅎㅎ.. ^^

      삭제
  56. 좋은 정보 잘 적용하고 가요~

    답글삭제
  57. 안녕하세요, 구글 블로거 목록이 없어서 고생했는데, 덕분에 좋은 정보를 알게되었습니다. 그런데 포스트갯수가 5개를 넘어가는데도 << 1 >>로면 있고 << 1 2 >>가 되질 않습니다. 그래서 위젯의 목록리스트에 뜨는 객수 5를 3로 변경해주어도 <<1>>만 뜹니다. 혹시 왜 그런건지 알 수 있을까요?

    답글삭제
    답글
    1. 색상등 기타 수정한것들을 포기하고 다시 복사하여 적용하니 해결이 되었습니다. 제가 뭘 잘못 건드렸나 봅니다. 덧글 삭제가 안되서 덧댓글 남깁니다. 좋은 자료 고맙습니다.

      삭제
    2. 적용 잘 되셨다니 다행이네요. 즐거운 블로깅 되세요~

      삭제
  58. 아주 잘 되네요^^ 좋은 정보 공유 감사 합니다!

    답글삭제
  59. 이번에 구글 블로그를 만들었는데 엄청 어렵네요ㅠㅠㅠ뒤에 사진을 넣고 싶은데 크기가 300을 금방 넘어버리고ㅠㅠㅠ프로필도 사진과 함께 만들고 싶지만 무지 힘들고.....여행블로그가 만들고 싶었으나 일기장으로 전락한...그래도 GOne Hong님 덕분에 하나하나 바꿔나갈 수 있겠네요! 감사합니다.

    답글삭제
    답글
    1. 요즘은 저도 블로그 관리가 많이 소홀한 편이라고 느끼고 있습니다만... 도움이 되신다면 다행이네요. ^^

      삭제
  60. 정말 자료 고맙습니다.
    그런데 제 블로그 바탕화면이 흰색이다 보니 <<1 2>> 부분에서 선택페이지의 숫자 색상이 노란색이다 보니
    구분이 안됩니다. 혹시 이 색삭을 다른색상으로 변경하고 싶은데요 부탁드립니다.

    답글삭제
    답글
    1. 안녕하세요. 확인이 늦었네요. 페이지번호의 색은 144번 줄에 a.style.color = 'yellow'; 의 값을 바꿔주시면 됩니다. 기본적인 색은 제가 한것과 같이 영어로 입력하시면 되지만 좀더 정확한 값은 '#FFFF00' 과 같이 16진수로 입력을 해주시면 됩니다. 자세한 내용은 인터넷에서 CSS 관련 내용을 찾아보시면 도움이 되실 것 같습니다.

      삭제
    2. 늦게라도 이렇게 알려주셔서 감사합니다. 즐거운 연휴되세요

      삭제
  61. 헉..넣은 태그가 안보이는군요 위 댓글은 지워주세요

    안녕하세요
    글목록 페이지 삽입하는 방법 잘 알았습니다
    그런데 글목록 페이지만을 검색에서 제외하고싶은데요
    //*
    < b:if cond='data:blog.pageType == "Archive"' >
    < me*ta content='noindex,noarchive' name='robots'/ >
    < /b:if >
    *//
    noindex가 검색제외 태그인건 알고있는데
    적혀있는 id가 posts니까 페이지 타입에 posts를 넣으면 될랑가요
    아니면 posts-pgno 을 넣어야 될까요?

    답글삭제
    답글
    1. 위 댓글은 삭제를 했구요..

      이 부분은 저도 확실하게 알고 있는 부분은 아니네요.
      우선 posts 나 posts-pgno 와 같은 tag의 id를 data:blog.pageType 에 넣는것은 안될거구요.
      글목록을 따로 페이지로 하셨다면 페이지의 URL(data:blog.url)이나 페이지 제목(data:pageTitle)을 조건문으로 하는게 좋을 것 같네요.

      삭제
  62. 음..만족합니다
    그런데 http://주소/search?updated-max=2015-01-08T20:00:0%2B09:00&max-results=1&pgno=1
    와 같이 뒤에 쓴 시간이 나오는 주소로 들어가는데
    원래주소는 http://주소/2014/12/blog-post_17.html
    이거란 말이죠
    물론 들어간 글은 같은겁니다만
    글목록 링크를 클릭해들어가면 원래주소로 들어가게 할 수 있는 방법없나요?

    답글삭제
    답글
    1. 안녕하세요. 죄송합니다. 답변이 늦었네요..
      말씀하신 부분은 사실 저도 고민하는 부분이긴 한데 바꾸기가 쉽지가 않네요.
      이 부분은 저도 좀 고민을 해봐야 할 것 같구요. 아직까지는 방법이 없네요...

      삭제
  63. 으아... 비공개 블로그는 안되는 건가요...
    혹시 어떻게 방법 없을까요...?

    답글삭제
    답글
    1. 네... RSS 피드를 불러와서 하는거라 비공개에는 적용이 안됩니다...

      삭제
  64. 안녕하세요. 일전에 카테고리 추가로 도움 받았던 일인 입니다.ㅎㅎㅎ
    덕분에 포스트 리스트도 추가해서 블로그 블로그다워 졌습니다.ㅋㅋ
    감사드립니다. 복 많이 받으실거에요.^^

    답글삭제
    답글
    1. 네 감사합니다. 잘 사용하세요~

      삭제
  65. 블로그 잘 적용해서 쓰고 있는데요^^
    새로운 템플릿을 적용했더니 추가로 필요한 부분이 생겨서 염치불구하고 여쭤봅니다.
    제 블로그 같은 경우에 라벨을 클릭하면 상단에 postlist 가 뜨고, 아래 간략한 이미지 목록이 뜹니다.
    이미지 목록 옆에 readmore 을 클릭하게 되면 해당 글로 이동하게 되어있습니다.

    문제는 글에 들어가고 나면 위에 postlist 가 해당 글의 라벨이 아닌
    블로그의 모든 글에 대한 postlist로 바귄다는 겁니다.
    글에 들어가도 상단에 그 글에 해당하는 라벨에 대한 postlist 가 보이게 하려면
    어떤 소스를 입력해야하는지 알려주시면 감사하겠습니다.
    제 블로그 주소인데 제가 설명을 잘 못한 것 같아서 가져와 봤습니다. http://eunhasusee.blogspot.kr

    답글삭제
    답글
    1. 죄송합니다. 답글이 늦었네요.
      Read More 부분은 새로 적용 된 템플릿에서 제공하는 건가요?
      위와 같은 경우에는 원하시는 데로 적용하기가 힘들것 같네요....

      삭제
  66. 안녕하세요.
    위에도 감사의 글을 남겼었던 koreafreeandeasy.blogspot.com 입니다.
    잘 사용되다가 갑자기
    리스트의 포스트를 클릭하면
    클릭한 포스트가 나오지 않고
    가장 최신의 포스트가 나옵니다.ㅠㅠ
    무슨 문제가 생긴 듯 한데 해결이 안되서 도움을 청합니다.
    편하신 시간에 한번 봐 주셨으면 합니다.
    감사합니다.

    답글삭제