egg's 행복연구소 :: 펌핏 신규글 위젯

태미님의 me2day 플러그인 관련 글을 참고하여 만들어보았습니다.

소스를 수정하여 다시 포스팅하였습니다.

/**
*
- pr_target : 목록이 표시될 태그 아이디(?)
- pr_size : 목록 출력 개수
- pr_length : 한줄당 표현 길이 (0 : 모두 표시)
- pr_category : 표시될 카테고리
IT|생활/문화|정치/경제|미디어/연예|스포츠|피플
*/
var pr_target = 'pumfit_recent';
var pr_size = 10;
var pr_category = 'IT|신상품';
var pr_length = 0;

~~function initPumfitRecent() {~~

var pipeURL = 'http://pipes.yahoo.com/pipes/pipe.run?_id=KnWwmxkE3BGDJU7SCB2yXQ&_render=json&_callback=hanPumfitRecent';
var pars = '&category=' + pr_category + '&size=' + pr_size;
var sc = document.createElement('script');
sc.type = 'text/javascript';
sc.src = pipeURL + pars;

document.getElementsByTagName('head')[0].appendChild(sc);
}

~~function hanPumfitRecent(feed) {~~

var html = '<ul>';
var listTpl = new Template('<li><a href="#{link}">#{title}</a><span class="date">#{date}</span></li>');

~~for (var i = 0; i < feed.value.items.length; i++) {~~

var item = feed.value.items[i];
var cal = new Date(item.pubDate);
var data = {link: item.link, title: item.title.truncate(pr_length), date: cal.getHours().toPaddedString(2) + ':' + cal.getMinutes().toPaddedString(2)};

html += listTpl.evaluate(data);
}
html += '</ul>';

if ($(pr_target))
$(pr_target).update(html);
}

initPumfitRecent();
</script>
<div id="pumfit_recent">펌핏 최근글 로딩</div>

카테고리를 지정하여 신규글에 대한 목록을 가져올 수 있으며 사용법은 카테고리 이름인 'IT', '생활/문화', 등을 '|'로 연결하여 pr_category에 설정하시면됩니다.

var pr_size = 10;
var pr_category = 'IT|신상품';
var pr_length = 0;

~~출력 형태는~~

~~<li><a href="#{link}">#{title}</a><span class="date">#{date}</span></li>~~

으로 블로그에 맞게 style.css를 지정해서 사용하시면 됩니다.
기본 style.css

#pumfit_recent ul,
#pumfit_recent li {
margin:0;
padding:0;
list-style:none;
}
#pumfit_recent .date {
margin-left:10px;
}

~~참고로 위 소스를~~

<s_sidebar_element>
.. 소스..
</s_sidebar_element>

~~형태로 사이드바 태그 위치에 추가하시면 손쉽게 위치를 변경할 수 있습니다.~~