블로그에 내 트윗 달기

원래는 텍스트큐브 으로 만들어 배포할 생각이었다. 그러나 음주님이 트위터로 팔로잉과 팔로어의 수를 받아 보는 방법을 질문해와 "자빠진 김에 쉬어간다"고 말이 나온 김이 블로그에 내 트윗(Tweet)을 다는 방법을 올리게 되었다. 일단 블로그에 내 트윗을 다는 방법은 상당히 간단하다. 트윗이 출력될 영역을 설정하고 트위터에서 제공하는 스크립트를 호출하면 되기 때문이다. 이 부분은 아라님의 트위터를 블로그처럼 활용하기 #1라는 글에 잘 나와있다.

그런데 트위터(Twitter)는 한글을 지원하지 않는다. 따라서 트위터에서 불러온 트윗도 약 10분전을 'about 10 hours ago'으로 표시한다. 즉, 한글화가 되어 있지 않다. 또 팔로잉과 팔로어의 숫자도 알 수 있으면 좋을 텐데 이 방법으로는 팔로잉과 팔로어의 숫자는 알 수 없다. 그래서 트위터에서 제공하는 자바 스크립트를 내려받아 한글화하고 팔로잉과 팔로어의 숫자를 가져올 수 있도록 스크립트를 바꿨다.

블로그에 단 내 트윗

①은 팔로잉과 팔로어의 숫자가 출력된다. ②에는 설정된 값(예: 5)에 따라 내 트윗이 출력된다. ③을 클릭하면 내 트윗의 퍼머링크로 이동한다. 다만 한글화 했기 때문에 3분전으로 표시되는 것을 알 수 있다. ④를 클릭하면 해당 아이디의 트위터로 이동한다.

바꾸는 방법은 아라님의 글과 거의 비슷하다. 스크립트를 호출하는 경로만 다르다.

  1. 먼저 좋아하는 편집기(예: EditPlus)로 skin/skinname/skin.html 파일을 연다. 여기서 skinname은 사용하는 스킨에 따라 달라진다. 티스토리를 사용하고 있다면 스킨 편집기를 이용하면 된다.
  2. 내 트윗을 달 적당한 위치(사이드바(<s_sidebar></s_sidebar>)나 본문(<s_article_rep></s_article_rep>)에 다음과 같은 코드를 추가한 뒤 저장한다.

    <fieldset class="ViewPostOfRelTag"><legend> <a href="http://twitter.com/doax"><strong>트위터    </strong></a>(<span id="twitter_follows"></span>) - <a href="/tag/연아와%20트위터를">트위터 길잡    이</a></legend>
    <div id="twitter_div">
    <ul id="twitter_update_list"></ul>
    </div>
    <script type="text/javascript"     src="http://home.megapass.net/~doapax/Twitter/blogger.js"></script>
    <script type="text/javascript"     src="http://twitter.com/statuses/user_timeline/doax.json?callback=twitterCallback2&count=5"></sc    ript>
    </fieldset>
    
    • <span id="twitter_follows"></span>
      나중에 팔로잉과 팔로어의 숫자로 바뀐다. 따라서 꼭 <legend></legend> 태그가 아니라고 해도 자신이 원하는 위치에 삽입하면 자동으로 팔로잉과 팔로어의 숫자로 바뀐다. 다만 <script></script> 태그 이전에 와야 한다.
    • <ul id="twitter_update_list"></ul>
      <ul>과 </ul> 태그 사이에 트위터에서 받아온 자신의 트윗이 추가된다. 역시 <script></script> 태그 이전에 와야 한다.
    • doax.json
      'doax'는 자신의 트위터 아이디로 바꿔야 한다. 예를들어 트위터 아이디가 @drunken_j라면 drunken_j.json으로 바꿔야 한다.
    • count=5
      출력할 트윗의 수로 설정한다. 이 값을 5로 설정하면 내가 최근에 올린 트윗 5개가 블로그에 출력된다.

관련 글타래

2009/07/23 11:20 2009/07/23 11:20
글쓴이
author image
운영체제의 모든 것을 운영하고 있는 IT 블로거. IT 블로거라는 이름은 현재 시국때문에 시사 블로거로 바뀐 상태다. 그러나 나는 아직도 시사와 사회에 관심이 많은 IT 블로거일 뿐이다. 컴퓨터, 운영체제, 시사, 가족, 여행, 맛집, 리뷰등과 살면서 느끼는 소소한 일상이 블로그의 주제이다. 왼쪽의 아이콘은 둘째 딸 다예가 그린 내 모습이다.
오늘의 글
인기있는 글
조회수 많은 글 | 베오베
댓글 많은 글 | 베오베

Trackback

Trackback Address :: http://offree.net/trackback/2672

  1. Subject : 블로그에 트윗 설치 완료!

    Tracked from BLUEnLIVE's ZocKrWorld 2009/07/28 08:58 del.

    도아님의 글 블로그에 내 트윗 달기를 참고해서 트윗을 달았습니다. 이제 처음 트위터의 세계에 발을 딛었는데, 열심히 해보겠습니다. ^^; 덧. 도아님 홈페이지의 트래픽을 줄인다는 핑계로 blogg

Facebook

Comments

  1. gendalf9 2009/07/23 12:08

    감사합니다 잘 쓰겠습니다~

    perm. |  mod/del. reply.
    • 도아 2009/07/23 13:46

      아무래데 아이디가 간달프에서 온듯합니다.

    • gendalf9 2009/07/23 14:52

      옙. 어릴때 봤던 반지의 제왕 번역본에 한글로 겐달프인지 갠달프인지 라고 되어있어서 잘못알았었죠...

  2. 학주니 2009/07/23 13:02

    음냐. 저는 제 메인 블로그에서는 제 트위터를 노출시키지 않기로 했기 때문시.. ^^;

    perm. |  mod/del. reply.
    • 도아 2009/07/23 13:46

      저도 계속 둘지 뺄지는 생각 중입니다.

  3. 지수 2009/07/23 13:54

    저두 트위스터를 할까 하는데 이쪽으로는 까막눈이라 공부좀 해야겠네요 ㅎㅎ

    perm. |  mod/del. reply.
    • 도아 2009/07/23 20:31

      HTML은 한시간만 하면 알 수 있을 정도로 쉽습니다.

  4. Kael H. 2009/07/23 14:06

    쩝,,, 티스토리라 달지 못하는군요... ㅇㅅㅇ;;;;;
    나중에 돈모아서 계정 다시 사면 그 때 달아봐야겠습니다... ㅇㅅㅇ

    perm. |  mod/del. reply.
    • in2web 2009/07/23 15:41

      저두 티스토리인데 달았습니다. 티스토리 어드민 들어가서 스킨항목에서 HTML/CSS편집 들어가면 skin.html창이 있습니다. 약 2/5 쯤 내리면 <s_article_rep>항목이 있습니다. 위 설녕을 잘 읽어보세요^^

    • 도아 2009/07/23 20:31

      달 수 있습니다. 스킨만 편집하면 되니까요.

  5. in2web 2009/07/23 15:36

    잘 사용하겠습니다^^

    perm. |  mod/del. reply.
  6. 음주 2009/07/23 16:38

    도아님의 것을 조금 변형해서 새로 시작-_-...하는 블로그에 달았습니다. 원래 주특기가 접었다 폈다 하는거라 T^T;
    메가패스 계정을 도둑질? 해서 쓰는것도 좀 그렇고 '폴로워'란 한글 단어를 영문으로 바꾸어 다느라고 티스토리 스킨 폴더에 직접 올렸습니다.

    친절한 설명 감사드립니다.

    perm. |  mod/del. reply.
    • 도아 2009/07/23 20:32

      영어를 좋아하시는군요...

    • 음주 2009/07/24 00:04

      영어를 좋아한다기 보다는 폴로윙이나 폴로워란 단어가 following, follower보다 좀 더 낮설어서 바꿨습니다 ^^;

  7. 이종범 2009/07/24 21:54

    도아님, 감사합니다. 트위터를 블로그에 어떻게 달까 고민했었는데 단박에 해결이 되었네요. 아이팟터치가 생겨서 도아님 글을 보고 마스터하려 합니다. 아이팟에 대해 알아갈수록 정말 대단하네요. ^^

    perm. |  mod/del. reply.
    • 도아 2009/07/25 07:55

      그 물건을 드디어 장만하신 모양이군요. 정말 대단한 기기입니다. 1년이 넘도록 제 관심을 잡은 기기는 터치가 유일합니다.

  8. bluenlive 2009/07/28 08:09

    푸헐~ 설치 완료했습니다!
    고맙습니다!

    perm. |  mod/del. reply.
  9. 제안 2009/08/03 12:07

    트위터 글 마지막에 '~~일전' 이거를 트위터에서처럼 트윗한 날짜로 표시하는 방법은 없을까요?
    아직 스크립트에는 문외한이라 제가 수정하는 게 어렵네요.

    perm. |  mod/del. reply.
    • 도아 2009/08/03 12:13

      가능은 하지만 제가 할 수 있는 부분은 아닙니다. 그 이유는 저는 트윗한 날짜 보다는 ~일전을 더 좋아하기 때문입니다.

  10. hb 2009/08/03 16:20

    안녕하세요! 티스토리 블로그 스킨 매만지는 중에 트위터도 집어넣어놨는데 한글 지원 안해서 시간의 오류가 생기는지는 몰랐네요! 도아님 작업하신 js 파일 참조해도 괜찮을까요? 감사합니다!! :)

    perm. |  mod/del. reply.
    • 도아 2009/08/03 23:51

      참조해도 큰 상관은 없습니다. 다만 참조의 의미는 알고 사용하셔야 합니다.

    • hb 2009/08/04 11:12

      네. 비교해보았더니 시간상의 오류는 제가 착각한거였네요. 저는 트위터에서 배포한 그대로 사용하려고요. 감사합니다! :)

  11. ImpactXP 2009/08/09 13:29

    하하 저도 도아님 글 보고 달았습니다.
    본문바로 위에 말이죠.
    전 티스토리는 쓰는 도아님 글보고 스킨에디터에 쭈욱 보다가 간단하게 수정할것만 수정하고
    넣으니깐 좋더군요.

    perm. |  mod/del. reply.
    • 도아 2009/08/10 10:53

      예. 스킨만 편집할 수 있으면 모두 삽입할 수 있습니다. 제가 올린 것은 한글이 가능하고 폴로워 숫자가 나온다는 것이 차이가 있고요.

  12. 其仁 2009/08/17 15:20

    제 트위터가 어느 정도 자리를 잡으면 꼭 적용하고 싶은 방법이네요. 언젠가는 적용할 수 있기를...부르르...

    perm. |  mod/del. reply.
    • 도아 2009/08/17 17:56

      달기만 하면 되기 때문에 사실 기간은 필요없습니다.

댓글로 기쁨을 나눠요!

(옵션: 없으면 생략)

글을 올릴 때 [b], [i], [url], [img]와 같은 BBCode를 사용할 수 있습니다.