블로그 이미지

개발로그 - DevLog

프레임워크(framework), 웹2.0 등 개발기술과 서비스 by 태미(taemy)


me2day 플러그인 - 티스토리에도 사용가능 (js 로만 처리)

기본 me2day 의 rss 제공이
날짜(하루치) -> 하루치 올라온글 으로 되어 있다.

올라온 글을 따로따로 보기가 힘들다.

그래서.
http://me2day.net/comfuture/2007/03/15#12:43:08
거친마루 님께서
http://pipes.yahoo.com/pipes/pipe.info?_id=HkCxjqLS2xGADUgG6kjTQA
처럼 각 올라온 글을 따로 분리해 주셨다.

이 rss 피드를 가지고 플러그인을 만들려고 한다.

이 피드를 플톡의 js 로만 된 플러그인을 이용하려는데,
제대로 처리를 해주지 못한다.


일단 여기까지 - 더 해보고, 다른 방법을 써야 할지도 모르겠다.

------------------------------------------------------------------
3월 20일 추가
어제에 이어 추가로 더 작업을 해보았음.

내부적으로
John Resig의 RSS to JSON Convertor(http://ejohn.org/projects/rss2json/)
대신에 거친마루님의 yahoo pipe  를 사용하였음.
그리고 prototype.js 를 부분 사용하였음.

작동에서 초점을 맞추어 몇가지 눈에 거슬리는 부분이 있음.(일단 공개)
추후 수정을 하게된다면 다시 올릴예정.


아래 코드를 'view plain' 으로 열고 복사해서, 스킨편집으로 가서 적당한 곳에 넣으시면 됩니다.
제 블로그 처럼 본문 하단 에 넣거나, 사이드 바에 넣어도 됩니다.

자신의 블로그에 맞게 아래부분을 적당히 바꿔주세요.
id 는 자신의 아이디로, 닉네임도 그냥 id 로 넣어도 되구요
사이드바에 넣는 경우나 제목을 넣고 싶으면 닉네임도 넣어주세요.

var size = 5;  // 출력 개수
var length = 70; // 항목당 표현 길이
var id = 'taemy'; // Me2day 아이디

var head_yn = 0 ; // 제목 표시 있음(1) , 없음(0)

var nickname = '태미' ;

[CODE html]
<script type="text/javascript" src="http://www.prototypejs.org/assets/2007/1/18/prototype.js"></script>

<script type="text/javascript">
/*
 * 사용법
 *  - 아래 변수를 수정하고 페이지 내용 중 원하는 부분에 붙여 넣으시면 됩니다.
 *  - size  : 리스트의 출력 개수입니다.
 *  - length: 리스트의 한줄당 표현 길이입니다. 0을 주시면 모두 표현됩니다.
 *  - id    : Me2day 의 사용자 ID입니다.
 *
 * 기타
 *  - UTF-8이 아닐 경우 한글이 깨질 수 있습니다.
 *  - 스타일을 변경하시려면 소스 내용을 수정하세요.
 *  - 라이센스는 동일하게 CCL (By) 2.5 입니다.
 *
 *
 * 참조 - http://emotion.tistory.com/60
 * 내부적으로 John Resig의 RSS to JSON Convertor(http://ejohn.org/projects/rss2json/)
 * 를 사용하지 않고, yahoo pipe 를 사용하였음.
 *
 *
 */

var size = 5;  // 출력 개수
var length = 70; // 항목당 표현 길이
var id = 'taemy'; // Me2day 아이디

var head_yn = 0 ; // 제목 표시 있음(1) , 없음(0)

var nickname = '태미' ;
var main_title = nickname + '의 미투데이' ;
var main_url = 'http://me2day.net/' + id ;


var json_url = 'http://pipes.yahoo.com/pipes/pipe.run' ;
var pars = '_id=HkCxjqLS2xGADUgG6kjTQA&textinput1=' + id + '&_render=json&_callback=putMe2day' ;


function getMe2day() {
  var s = document.createElement('script');
  s.type = 'text/javascript';
  s.src = json_url + '?' + pars ;

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

}

function putMe2day(rss) {
 var html = '';

  if( head_yn == 1 ) {
    html = '<h3><a href="' + main_url + '" title="' + main_title + '" target="_blank">' + main_title + '</a></h3>';
  }
 
  html += '<ul>';

  for (var i = 0; i < size && i < rss.value.items.length; i++) {

    var item = rss.value.items[i];
    html += '<li><a href="' + item.link + '" title="' + item.title.stripTags() + '" target="_blank">'
      + ellipsis(item.description.stripTags() , length) + '</a></li>';
  }
  html += '</ul>';

  $('me2day').innerHTML = html;
}

function ellipsis(text, size) {
  if (size == 0) return text;
  var index = 0;
  var count = 0;
  for (index = 0; index < text.length; index++) {
    if (count >= size) {
      return text.substring(0, index).replace(/\s+$/, '') + '...';
    }
    count += escape(text.charAt(index)).indexOf('%u') > -1 ? 2 : 1;
  }
  return text;
}

getMe2day();

//-->
</script>

<FIElDSET style='padding:3px; text-align:left'><LEGEND>미투데이</LEGEND>
<div id="me2day">Me2day loading...</div>
</FIElDSET>
[/CODE]


사이드바에 넣는 경우 맨 끝부분 의
<FIElDSET style='padding:3px; text-align:left'><LEGEND>미투데이</LEGEND>
<div id="me2day">Me2day loading...</div>
</FIElDSET>
를 그냥
<div id="me2day">Me2day loading...</div>
만 넣으시고,
var length = 25; // 항목당 표현 길이
var id = 'taemy'; // Me2day 아이디

var head_yn = 1 ; // 제목 표시 있음(1) , 없음(0)
정도로 바꾸시면 됩니다. (head_yn 는 그냥 0 으로 하는 것이 나을듯 함 - 알아서 ^^ )


# 감사합니다
Crowe Lee - 플톡 플러그인 참조
거친마루 - 야후 pipe 참조

크리에이티브 커먼즈 라이선스
Creative Commons License
Comment 18 Trackback 7
  1. 도아 2007/03/20 22:43 address edit & delete reply

    무척 헷갈렸습니다. 티스토리용 플러그인이 올라와 현재 사용하고 있는 블로그가 티스토리인 줄 알았습니다. 그런데 책갈피 플러그인이 있는 것을 보고 태터인줄 알았습니다.

    • 태미(taemy) 2007/03/20 22:47 address edit & delete

      예. ^^ 그냥 태터입니다.

      그냥 스크립트로만 처리해 본 것입니다. ^^

      ps. 아! 책갈피 플러그인 고맙습니다. ^^

  2. djsol 2007/03/21 14:28 address edit & delete reply

    우와..저도 달았습니다..스타일도 쫌 바꿔봤어요
    감사합니다!!

  3. Crowe Lee 2007/03/22 01:25 address edit & delete reply

    RSS를 JSON으로 변환하여 callback을 해주는 서비스가 John Resig 사이트밖에 없는 줄 알았는데 Pipes에서는 기본 제공이군요. 좋은 정보 얻어 갑니다.

    • 태미(taemy) 2007/03/23 13:16 address edit & delete

      예. 만드신 플톡플러그인이 많은 도움이 되었습니다.
      내부 core 는 야후 pipe 로 바뀌었지만요.

      yahoo pipe 가 여러모로 쓸모가 있는 것 같네요. ^^

  4. 만박 2007/03/26 00:57 address edit & delete reply

    저도 달았어요! ^^

  5. 파스텔꿈 2007/04/20 16:38 address edit & delete reply

    덕분에 달았습니다:)

  6. Ra 2007/05/04 14:40 address edit & delete reply

    좋은 스크립트 감사합니다.

    저는 Opera 브라우져를 주로 사용합니다. IE에서는 잘 작동되지만 오페라에서는 putMe2day(rss);가 실행되지 않네요. pipe로 되어있는 json 스크립트는 로딩이 되는 듯 보입니다만.. 원인을 잘 모르겠습니다. 인코딩 문제일런지도 모르겠고요.

  7. 태미(taemy) 2007/05/04 14:54 address edit & delete reply

    파스텔꿈 // 잘쓰세요. ^^

    Ra // Opera 에서는 테스트를 안 해봤네요.
    한번 테스트를 해봐야 겠군요.

  8. 나무 2007/07/02 00:41 address edit & delete reply

    지저깨비님 홈에 있는 글을 보고 쫓아와서 지금 붙였습니다. 출력개수를 조정할 수 있어 참 좋습니다. 전 한 줄을 원했거든요. 덕분에 감사합니다. 구우우웃이에요. 구우우웃~~(하이킥 교감 선생 톤으로)

    • 【태미™】 2007/07/02 20:35 address edit & delete

      미투데이.. 아니죠~~ 미투돼이~ (개콘 변선생 버전.. )

      전 이 플러그인을 쓰면 느려지는 것 같아! 일단 떼어 놓았습니다. ^^

  9. dudtn 2007/07/10 23:44 address edit & delete reply

    소스는 잘 사용하고 있습니다.
    테터 데스크에 달아서 사용중입니다.^^
    혹시 이 플러긴에서 사용되는 야후 파이프...
    (var json_url = 'http://pipes.yahoo.com/pipes/pipe.run' ; )
    만드신 pipe.run 파일을 구할 수 없을까요?
    저도 가입해서 하나 만들어봤더니 파일로 다운 받아서 사용할 수 있게 되어 있던데요...
    야후 사이트에서 이것을 받는지 로딩 속도가 엄청 느려지네요^^

  10. 작은선물 2007/09/01 01:12 address edit & delete reply

    역시 사람은 모르면 이렇게 얻어 쓸 수 있군요.
    방금 블로그에 붙였는데, 귀엽게 잘 붙어 있습니다.
    감사합니다~^^

  11. ucandoit 2008/05/16 02:42 address edit & delete reply

    이런 게 있는 지 이제서야 알았네요.
    너무 감사해요~! ^^

  12. 아이초보넷 2008/07/08 19:15 address edit & delete reply

    님 덕분에 바로 달았습니다.
    정말 굿입니다..
    좋은정보감사합니다

  13. jamesdean 2010/08/18 10:19 address edit & delete reply

    안녕하세요. 홈페이지에 미투데이 연동할려고 하는데요. 글쓰는것은 안되나요... 어찌하는지 몰라서요...알려주세요~

Trackback : http://devlog.experlab.com/trackback/250 관련글 쓰기

  1. 미투와 블로그를 하나로, 태터툴즈 미투데이 플러그인

    도아의 세상사는 이야기 | 2007/03/20 22:33 delete

    필자의 이전 글에서 언급했듯 필자는 플톡과 미투를 모두 사용하고 있다. 사실 요즘 플톡의 미투 표절 에 대한 얘기가 심심치 않게 나오고 있고, 제닉스 님의 글이 사실이라면 미투를 개발하신 만박 님은 피를 토하는 심정일 것이라는 생각이 든다. 미투를 사용하면서 느낀점 중 하나는 정말 조용한 섬 같다는 것이다. 무엇을 하나 하려고 해도 관련되는 도움말을 전혀 찾을 수 없었다. 플톡은 아이콘으로 접근할 수 있는 RSS URL 하나 찾기 힘들었다. 미투 플..

  2. 야후 파이프를 이용한 플톡 피드 위젯

    eMotion | 2007/04/17 21:56 delete

    예전에 플톡을 티스토리에 달아보자라는 포스트를 작성한 적이 있습니다. 그 때는 야후 파이프의 JSON 서비스를 알지 못해서 John Resig의RSS to JSON Convertor를 이용한 방법을 설명했었습니다. 이 포스트에서는 일반적인 RSS 피드를 야후 파이프를 경유시켜 자바스크립트를 이용한 위젯을 만드는 방법을 설명 드리겠습니다. 먼저 야후 파이프에서 RSS 파이프를 생성하거나 기존에 생성되어 있는 파이프를 선택합니다. 여기에서는 제가 생성한..

  3. Beatmania의 느낌

    emptyframe's me2DAY | 2008/05/16 02:25 delete

    me2day 플러그인 - 티스토리에도 사용가능 (js 로만 처리) 로 덕분에 내 블로그에도 달았는데, 지금 사용하는 스킨이 꽤 복잡해서 이쁘게 안나온다. 주말에 손 좀 봐야겠군.

  4. A R A K I 의 생각

    arakii's me2DAY | 2008/05/18 19:05 delete

    어? 사파리에선 이거 안 먹히는구나...킁킁.

  5. ASURADA의 생각

    asurada's me2DAY | 2008/08/08 11:28 delete

    블로그 사이드 바에 미투데이 플러그 인을 달았다. (taemy감사합니다.)

  6. 힘눈의 느낌

    powereyes' me2DAY | 2009/04/02 03:48 delete

    내 홈페이지에 미투데이 최근글 목록 달았음 :) 여기 참고했어요.

  7. 티스토리에 미투달기 ...

    [ catch me if u can ] | 2009/07/24 00:37 delete

    요즘 가지고 놀고있는 진도와 개발로그 - devLog 님의 소스, 거친마루님의 yahoo pipe를 참조하여 만들었습니다. 마눌과 같이 미투데이를 하고있는 관계로 2명까지 미투리플 확인이 가능합니다. IE6/7/8, 크롬, 파이어폭스, 사파리에서 무난히(?) 작동하는 것을 확인하였습니다. 설치방법 아래 CSS를 티스토리 관리자 > 스킨 > HTML/CSS편집 > style.css 텍스트박스 제일 아래에 추가합니다. (.recently 는 최근댓글에..

Top

prev 1 ... 194 195 196 197 198 199 200 201 202 ... 380 next