블로그 포스트에 입력된 태그를 기준으로 최신 뉴스를 Feed 하는 '태그관련뉴스 Ver 0.1' 입니다.
다음(http://www.daum.net)의 DNA에서 제공하는 다음 뉴스검색 API를 사용하여 구현하였습니다.(다음 검색 API는 JSON 테이터 형태로도 제공되기 때문에 구현이 좀더 편합니다.)

현재 계속 개발 중이며, 설치형 블로그나 자바스크립트가 허용되는 블로그나 사이트에 아래의 스크립트를 추가하시면 됩니다.

<script language="javascript" type="text/javascript" src="http://fs.tistory.com/custom/blog/0/885/skin/images/prototype.js"></script>
    <script language="javascript" type="text/javascript" src="http://fs.tistory.com/custom/blog/0/885/skin/images/effects.js"></script>
    <script language="javascript" type="text/javascript" src="http://fs.tistory.com/custom/blog/0/885/skin/images/metheny.js"></script>
    <style>
        @import url("http://fs.tistory.com/custom/blog/0/885/skin/images/news_panel.css");
    </style>
   
        <div id="newsList" class="newsList">
            <span class="newsListTitle">태그관련뉴스 :</span>
        </div>
        <div class="newsListFooter">위 뉴스는 <a href="http://www.daum.net" target="_blank">Daum</a> 검색의 '<a href="http://dna.daum.net/apis/search/news" target="_blank">뉴스 검색 API</a>'를 사용하여 제공됩니다.
        </div>

    <script>
        news_panel_default_interval = 3000; // 뉴스별 노출 시간(msec)
        news_panel_max_contents_size = 3; // 태그별 최대 뉴스 개수
       
        // news_panel_tagbox_id, news_panel_tag_list 둘중 하나만 입력 news_panel_tag_list가 우선 순위
        // tag가 들어있는 element의 id가 있으면 입력
        //news_panel_tagbox_id = "tagbox";
        //news_panel_tagbox_class_name = "tagbox";
        // tag 리스트를 직접 입력
        news_panel_tag_list = ["설탕","당근"];

        setNewsPanel();
    </script>

뉴스를 가져오기 위해서 태그를 인식할 수 있는 방법은 세가지입니다. 관련 변수는 news_panel_tagbox_class_name, news_panel_tagbox_id, news_panel_tag_list  입니다. 경우에 따라서 앞의 변수 중 하나를 선택하시고, 나머지는 삭제하거나, 코멘트 처리 해주시면됩니다.


- 사용자 직접 입력 방식(관련 변수 : news_panel_tag_list)
   

news_panel_tag_list = ["설탕","당근"]; 

    news_panel_tag_list 변수에 사용자가 직접 태그를 입력하는 방식입니다. news_panel_tag_list 변수는 자바스크립트에서 Array형이므로 위의 소스 예처럼 입력 해주시면 됩니다.


- 태그박스(HTML Element)가 class로 정해져 있는 경우(관련 변수 : news_panel_tagbox_class_name)

news_panel_tagbox_class_name = "tagbox";

    티스토리나 태터툴스에서 태그들은 특정 HTML태그로 쌓여있는 경우가 많습니다. 가령  태그가 

<div class="tagbox">
    <span>tags : </span>
    <a rel="tag" href="/tag/adclix">adclix</a>,
    <a rel="tag" href="/tag/뉴스">뉴스</a>,
    <a rel="tag" href="/tag/설탕">설탕</a>,
<a rel="tag" href="/tag/당근">당근</a></div>

    식으로 되어있는 경우가 많은데, 이런 경우에는 news_panel_tagbox_class_name변수에 특정 태그 박스 class name을 지정하면, 그 내부에 있는 하이퍼링크(A 태그)를 가지고,  블로그 태그를 가져오게 됩니다. 위의 소스에서 태그 박스(div 태그)의 class name이 'tagbox'이므로  news_panel_tagbox_class_name = "tagbox"; 라고 입력하시면 됩니다.


- 태그박스(HTML Element)가 id로 정의되어 있는 경우(관련 변수 : news_panel_tagbox_id)

news_panel_tagbox_id  = "tagbox";

    태그박스가 특정 id로 정의되어 있다면(아래의 소스 참조)

<div id="tagbox">
    <span>tags : </span>
   <a rel="tag" href="/tag/adclix">adclix</a>,
    <a rel="tag" href="/tag/뉴스">뉴스</a>,
    <a rel="tag" href="/tag/설탕">설탕</a>,
<a rel="tag" href="/tag/당근">당근</a></div>

    news_panel_tagbox_id 변수를 사용하여 id를 지정하시면, 그 내부에 있는 태그를 가져와서 뉴스를 보여주게 됩니다. class name 을 지정하는 경우와 비슷합니다.


기타 다른 설정부분은

news_panel_default_interval = 3000; // 뉴스별 노출 시간(msec)
news_panel_max_contents_size = 3; // 태그별 최대 뉴스 개수

있습니다.

news_panel_default_interval 은 하나의 뉴스가 노출되는 시간입니다. 기본은 3000(msec)이고, 1000msec가 1초 이므로 뉴스별 노출 시간은 3초입니다.

news_panel_max_contents_size 변수는 하나의 태그별로 뉴스의 갯수를 설정하는데 쓰여집니다. 기본은 하나의 태그당 최대 3개의 뉴스를 보여지게 되어 있습니다.

스크립트를 성공적으로 추가하게 되면 아래처럼 보입니다.



혹시 사용할실 분이나 건의 사항, 버그를 신고해주시면 감사하겠습니다.^^;

사용환경 : javascript ( prototype, script.aculo.us), 다음 뉴스 검색 API