Del.icio.us Tagrolls & Linkrolls
2006년 1월 22일 by 김 승엽 View blog reactions
Del.icio.us 서비스를 이용한 지 얼마되지 않아서 가끔 보게되는 블로그 Sidebar의 Del.icio.us 메뉴를 추가할 까 말까 생각하고 있었는데 그제 Out of The Ocean에서 Tagroll 과 Linkroll 에 대한 포스트를 보고 플러그인을 설치하지 않아도 된다는 말에 한 번 넣어봤다.
포스트와는 다르게 페이지의 경우는 새로 작성하는게 꺼려져서 Del.icio.us Linkroll 을 넣을까 말까 고민했는데 일단 추가하고 나니 여러모로 유용할 것 같다, ( 워드프레스의 Blogroll 관리에 신경쓰지 못하는데 이게 조금 보완해 줄 수 있을것 같다,)
도움말 페이지를 참고해 삽입할 스크립트를 복사해 집어넣으면 되는데 사이드 바에 추가하는 것이 아닌 페이지에 추가하려고 한다면 Template 파일을 작성해 주면 된다. 사용하고 있는 테마 디렉토리에서 적당한 이름으로 ( 예 :delicious.php ) 새 이름을 작성하거나 이미 사용하고 있는 Template 파일을 복사해 바꿔 주면 되는데 내가 작성한 파일은 다음과 같다.
/*
Template Name: Delicious
*/
?>
<?php get_header(); ?>
<div id="content" class="narrowcolumn"> <!– narrowcolumn 또는 widecolumn –>
<!– Tagroll (자신의 코드로 변경)–>
<script type="text/javascript"
src="http://del.icio.us/feeds/js/tags/unfusion?
=del.icio.us%20tags">
</script>
<!– Linkroll (자신의 코드로 변경)–>
<script type="text/javascript"
src="http://del.icio.us/feeds/js/unfusion?tags;extended;count=50;
title=Unfusion%60s%20del.icio.us;bullet=%E2%80%A2;
sort=alpha">
</script>
<noscript>
<a href="http://del.icio.us/unfusion">Unfusion`s del.icio.us</a>
</noscript>
<div id="container"><h2><a href="http://del.icio.us/">
<img src="<?php bloginfo('template_directory'); ?/>
/images/delicious.med.gif" alt="del.icio.us" /></a>
<a href="http://del.icio.us/unfusion/wordpress">
WordPress Blogs</a></h2></div>
<!– json을 이용한 코드 wordpress 태그만 출력함 (자신의 코드로 변경)–>
<script type="text/javascript"
src="http://del.icio.us/feeds/json/unfusion/wordpress?count=50">
</script>
<script type="text/javascript">
function showImage(img){
return (function(){ img.style.display='inline' })
}
var ul = document.createElement('ul')
for (var i=0, post; post = Delicious.posts[i]; i++) {
var li = document.createElement('li')
li.style.marginLeft = '1em'
var a = document.createElement('a')
a.style.marginLeft = '20px'
a.style.lineHeight = '20px'
var img = document.createElement('img')
img.style.position = 'absolute'
img.style.display = 'none'
img.height = img.width = 16
img.src = post.u.split('/').splice(0,3).join('/')+'/favicon.ico'
img.onload = showImage(img);
a.setAttribute('href', post.u)
a.appendChild(document.createTextNode(post.d))
li.appendChild(img)
li.appendChild(a)
ul.appendChild(li)
}
document.getElementById('container').appendChild(ul)
</script>
</div>
<?php get_sidebar(); ?> /* 사이드 바 출력을 빼고 싶으면 이 라인을 삭제 */
<?php get_footer(); ?>
Tagroll 과 Linkroll 그리고 JSON을 이용한 Linkroll이 추가된 파일인데 도움말 사이트에서 복사한 삽입 코드들을 위의 코드에서 찾아 바꾸어 주면 된다. Linkroll의 경우 스타일을 변경할 수 있는데 여기를 참조하면 된다.
Styling Linkroll
( 페이지 상단의 Html 예제에 있는 delicious-tag 이나 delicious-extended 는 스타일을 추가해도 적용되지 않는 것 같다. 페이지 하단의 스타일 예제에 나와 있는 것들만 적용된다. )
Json을 사용한 경우 모양을 변경하고 싶다면 (줄 간격 같은 것들)
li.style.marginLeft = '1em'
var a = document.createElement('a')
a.style.marginLeft = '20px'
a.style.lineHeight = '20px'
위의 코드를 참고해, 추가해 주면 된다. (예제로 나온 코드에 두번째 라인과 네번째 라인을 추가했다.)
템플릿 파일이 작성되었다면 "쪽 쓰기"로 새 페이지를 만들어 페이지 제목을 지정한 뒤 오른쪽의 쪽 템플릿 메뉴에서 위에서 작성한 템플릿 파일을 선택한 뒤 저장하면 된다.
이제 새로운 페이지가 추가되고 Tagroll과 Linkroll이 나타나는 모습을 볼 수 있는데 만약 나타나지 않는다면 나타나는 링크의 갯수 라던가 제목 등을 바꿔봐야 한다.
(막 추가하고 난 뒤에 잘 나오지 않길래 이것 저것 건드려 보다 Unfusion's 이라고 제목을 붙였던 것에 문제가 있다는 것을 알았다. 이 부분을 바꾸니 제대로 출력 )
지금 서버 작업을 하고 있는지 처음에는 잘 나오더니 또 안 나온다.
: Del.icio.us, 워드프레스
: Del.icio.us, 워드프레스
: Del.icio.us, 워드프레스
ZZiRACi// 꽤 오래전에 적은 포스트라서 내용이 좀 변경되어야 할 것 같은데 이게 쉽지 않네요. 그래도 문제 없이 적용하셨다니 다행입니다.
겨우 블로그에 적용해서 완성해 놓았네요.
PHP에 익숙하지 않아서 고생했습니다. ^^;
[...] 절망클럽에서 Delicious를 페이지로 만들 수 있다는 소식을 보고는 바로 적용해 봤다. [...]
wigogg // 조금 더 찾아보면 워드프레스에서 활용할 수 있는 방법들이 많이 있을 것 같은데 저도 겨우 Tagroll 정도 설치하는 선에서 머물렀습니다. 일단은 자신의 북마크를 잘 관리해 놓는게 중요할 것 같다는 생각이 들더군요.
워프사용자세니요! 반갑습니다.
블로깅은 네이버 블로그스킨 좀 만져봤던게 끝이 었는데 …
최근에 나도 블로깅을 해볼까 하는 용기로
호스팅 받고 워프설치하고 등등…참 힘들었습니다.
그런데 하면 할 수록 모르던 서비스들에 뒤늦게 더 스트레스 받고 있답니다.^^
Del.icio.us 아직 포스팅은 안했지만 예전에 한번 로고보고 '푸드'와 관련있는 사이트로
생각했답니다. ㅋㅋ
워프에서 Del.icio.us를 잘 활용하는 방법을 찾고 있는 중에 들립니다.^^
영어로 되어있어 참 힘들다는…
꾸벅~
del.icio.us – tagrolls 적용…
절망 클럽의 포스트를 확인하고 시도해봤다. 이 분의 포스트에는 WP의 유용한 플러그인이나 정보가 많이 있는것 같아 RSS를 등록해놨는데 역시 또 한건 건졌다.
tagrolls config
tagrolls 서비스의 하……