Lightbox
블로거들이 사용하는 플러그인의 통계를 내면 그 상위에 Lightbox 플러그인이 있을 것이라는 생각이 든다. 나도 이 Lightbox 플러그인을 꽤 오래 전부터 계속 사용해 왔다. 이 플러그인의 핵심은 'Lightbox'이다. Lightbox는 큰 그림을 자동으로 웹 페이지의 크에 맞게 자동으로 줄여주며 클릭하면 확대된 이미지를 보여준다. Lightbox JS, Lightbox Plus 등 판도 여러 가지이다.
블로거들이 사용하는 플러그인의 통계를 내면 그 상위에 Lightbox 플러그인이 있을 것이라는 생각이 든다. 나도 이 Lightbox 플러그인을 꽤 오래 전부터 계속 사용해 왔다. 이 플러그인의 핵심은 'Lightbox'이다. Lightbox는 큰 그림을 자동으로 웹 페이지의 크에 맞게 자동으로 줄여주며 클릭하면 확대된 이미지를 보여준다. Lightbox JS, Lightbox Plus 등 판도 여러 가지이다.
Lightbox는 여러 가지로 유용한 프로그램이지만 그림의 크기를 줄이기위해 단순히 '<IMG> 태그의 WIDTH 속성'을 이용한다. 스크립트로서 처리할 수 없는 분분이기는 하지만 바로 이 부분때문에 이 플러그인을 공개하게 되었다. 내가 불편하게 느끼는 점은 다음과 같다.
- 전송량 증가
단순히 그림의 WIDTH 속성으로 크기만 조절한 것이기 때문에 실제 큰 파일이 전송된다. 따라서 이런 그림이 많은 경우 전송량이 상당히 증가한다. - 선명도 손상
그림의 'WIDTH 속성'만 바꾸면 크기 조절은 인터넷 탐색기가 담당하며, 이 경우 그림의 선명도가 떨어진다.
그래서 만든 플러그인이 ResampleLB이다. 이 플러그인은 사용자에게 표시되는 작은 그림은 원본 그림을 그대로 출력하지 않는다. 내부 프로그램으로 그림의 크기를 줄이며 이 과정에서 그림을 다시 샘플링함으로서 그림이 더 선명하게 표시할 수 있도록 한다.
다음 두 그림을 비교하면 다시 샘플링하는 것의 효과를 분명하게 알 수 있을 것이다.
| WIDTH 속성 | ResampleLB |
|---|---|
 |
 |
그동안 계속 Lightbox 플러그인을 판올림도 하지 않고 사용하다가 불현듯 Random Photo Viewer 확장에서 공개한 확장을 이용하면 Lightbox에서도 쉽게 작은 그림을 다시 샘플링해서 보여줄 수 있겠다는 생각이 들었다. 따라서 이렇게 급조한 플러그인이다.
다만 태터툴즈의 홈페이지에서 새로 올라온 Lightbox 플러그인을 보니 상당히 여러 가지 기능이 추가되어 있고 따라서 굳이 이 플러그인을 발표할 필요을 느끼지 못했다. 기능은 예전 Lightbox Plus(소스도 예전 소스를 그대로 사용)와 같다. 다만 작은 그림의 경우 Random Photo Viewer 확장으로 그림의 크기를 줄이고, 다시 샘플링하기 때문에 기존의 Lightbox 플러그인을 사용하는 것보다 훨씬 선명하다.
발표를 하자니 그렇고 그대로 썩히자니 필요한 사람도 있을 것 같아 공식적인 공개는 하지 않고 필요한 사람만 내려받을 수 있도록 블로그를 통해 공개하게 되었다.
설치하는 방법은 간단하다. 내려받은 파일을 태터툴즈의 플러그인 폴더(plugins)에 올리고 '관리도구/플러그인'에서 'ResampleLB 플러그인'을 '사용중'으로 바꾸면 된다.
당연한 얘기지만 이 플러그인을 사용하려면 Lightbox 플러그인을 '미사용'으로 바꾸어야 한다. 아울러 태터툴즈를 루트에 설치하지 않은 사람은 lightbox_plus.js의 마지막 부분의 경로를 자신의 환경에 맞게 바꾸어야 아이콘이 정상적으로 나타난다.
loadingimg:'/plugins/vResampleLB/images/loading.gif',
expandimg:'/plugins/vResampleLB/images/expand.gif',
shrinkimg:'/plugins/vResampleLB/images/shrink.gif',
//effectimg:'/plugins/ResampleLB/images/zzoop.gif',
effectpos:{x:-40,y:-20},
effectclass:'effectable',
closeimg:'/plugins/vResampleLB/images/close.gif'
Trackback
Trackback Address :: https://offree.net/trackback/617
Comments
-
루돌프 2007/01/10 16:30
저는 개인적으로 애초에 업로드 할때 작게 해서 올리기 때문에;;
티스토리에 적용된게 어느건지 모르겠네요;;
요즘 버젼도 축소하면 저렇게 나올까요...-_-;
아니면 저런거 좀 추가해줬으면 하는데... -
엔하늘 2007/01/10 16:33
네, 저도 이미지가 일그러지는 것이 싫어서 웬만하면 재편집해서 업로드하는데 참으로 불편하지요. 상당히 유용한 플러그인일듯 합니다!! 다만 저는 티스토리 유저라...OTL....
-
-
thinkfish 2007/01/10 17:02
항상 Lightbox쓰면서 맘에 걸리던 부분이었는데 가려움을 긁어주는 플러그인 갔습니다.^^
그런데 다운받아보니 images폴더에 이미지가 없는데 그게 원래 없는건가요?
설치하고 사용중으로 설정하고 블로그에 들어가니 올렸던 이미지가 모두 안보여서 다시 미사용으로 바꾸었습니다.
ㅠ.ㅠ
root설치가 아니라서 위의 붉은글씨부분 앞에 /tt/라고 써줬는데 그렇게 하는게 맞는건지도 모르겠내요ㅠ.ㅠ-
도아 2007/01/10 17:40
그런데 다운받아보니 images폴더에 이미지가 없는데 그게 원래 없는건가요? 업로드를 잘못해서 생긴 현상입니다.
설치하고 사용중으로 설정하고 블로그에 들어가니 올렸던 이미지가 모두 안보여서 다시 미사용으로 바꾸었습니다. image.php 파일의 경로 문제인 것 같습니다.
root설치가 아니라서 위의 붉은글씨부분 앞에 /tt/라고 써줬는데 그렇게 하는게 맞는건지도 모르겠내요ㅠ.ㅠ 맞습니다. 따른 부분을 건들지 않았다면.
http://pjjk.com/tt/plugins/vresamplelb/ ··· ht%3D200 로 접속하면 이미지가 줄어드는 것으로 봐서 index.php 파일에서 image.php 파일의 경로가 틀려서 발생하는 현상같습니다. 수정본을 다시 올려 두도록 하겠습니다.
-
-
graphittie 2007/01/10 18:22
TNF에서 활동중인 graphittie입니다. 1.1 버전부터는 테스트 용이기는 하지만 태터툴즈 내부에 리샘플링 기능이 포함되어 있는데요, 혹시 이 기능에서 미흡한 점을 발견하신 것인지요?
-
goohwan 2007/01/10 20:59
역시 티스토리인지라 눈물을 머금고 좋은 플러그인에게 인사만 할 뿐입니다. ㅜㅜ
언젠간 티스토리에도 도아님 플러그인이 많이 많이 올라왔으면 좋겠네요 ^^ -
유마 2007/02/07 18:22
어디 해야 될지 몰라서 일단 이 글에 질문을 던져봅니다.
워터마크를 태터 내장 기능을 사용하시지 않으시는 것 같아요.
직접 사진에다가 넣으시나요? 아니면... 다른 플러그인이나? 프로그램으로 처리하시나요? -
유마 2007/02/07 19:29
ResampleLB 에 워터마크 기능이 있나요? 저도 어제 워터마크를 써볼가 해서 태터 내장 기능과 LightBox 등을 사용해보고 이리저리 살펴보다 현재 ResampleLB 를 사용중인데.. 설정 자체가 없으니...
플러그인 메뉴에서 살펴봤는데, 워터마크에 대한 플러그인은 없는 것 같아서 ^^ -
유마 2007/03/27 21:31
훔.. 이상하니~ 제가 이미지를 클릭하면 라이트박스가 되질 않습니다. 계속 로딩만 됩니다. --a
그런데, 썸네일 플러그인에서는 잘 됩니다. J.파커님 썸네일 플러그인에서 라이트박스를 사용할 수 있는데,
그건 물론, 라이트박스 플러그인이 있을 경우 해당하는데, 제 경우는 도아님의 이 플러그인이 해당될 겁니다.
사이드바와 리스트 상 썸네일에서는 라이트박스가 잘 됩니다만, 이상하니 본문에서는 로딩 장면에서 계속 로딩만 됩니다. --a
되고 있는 걸까요? 안되는 걸까요?... 로딩만 되는건 왜 그런건가요? -
bakion 2007/07/17 11:22
그림을 축소했을 때 해상도가 좋지 않아서 항상 화일을 2개로 업로드했었는데, 도아님의 플러그인으로 너무 편리하게 사용할 수 있게 되었습니다. 감사합니다.
-
댕글댕글파파 2007/10/11 15:25
도아님의 댓글을 보고 저도 이 플러그인을 다운 받아서 바로 적용을 해 보았습니다.
그런데 사용자 이미지 삽입이라는 글만 뜨고 이미지는 나타나질 못하는 것입니다.
경로가 잘 못되어서 그런듯 한데 이유를 잘 모르겠습니다.
제가 설치를 한 순서는
1. 플러그인 다운로드
2. 플러그인 업로드
3. Lightbox TT AZ 플러그인 미사용으로 전환
4. Resampled LB 플러그인 사용중으로 전환
업로드를 하기 전에 경로 변경 내용
제 ftp 경로를 보면 /www/tt/plugins 이곳에 플러그인을 설치했습니다.
처음엔 도아님이 제시해 주신 곳의 앞부분에 /tt/를 넣어서 적용을 했습니다.
loadingimg:'/tt/plugins/vResampleLB/images/loading.gif', 이런식으로요.
그런데 이미지가 나타나질 않아서 /www/tt/ 이렇게 넣어 보았으나 그래도 이미지가 나타나지 않습니다.
이유가 먼질 모르겠습니다. ㅠ_ㅠ -
-
겔롱 2008/02/26 23:17
텍스트큐브에서는 정상 동작을 안하는군요...
사용자삽입이미지라는 글과 함께 배꼽이 보이네요....
꼭 사용했으면 하는 플러그인인데
어떻게 방법이 없을까요??
경로는 틀리지 않았습니다만.... -
moonloveyou 2008/03/11 03:14
에휴... 컴퓨터에 대해 아무것도 모르는 상태에서 오래전에 QAOS.com 일게되고 많은거 배웠는데 이제는 블로그란걸 해볼려고 합니다. -_-
남들보다 늦게 시작하지만 그래도 마음먹어본것은 한번 해볼려고 도메인하고 웹호스팅도 바로바로 결제하고 했습니다. ^__^
도아님의 offree.net 블로그가 택스트큐브 란것인걸 알고 택스트큐브 설명서도 수십번 읽어보고... (도아님 블로그를 모델로 열심히 만들어 볼려고~)
느린인터넷으로 겨우 www.graychang.com 에 업로드 하고 설치도 했습니다.! (처음엔 설치도 몰라서 해매고..)
웹호스팅 하드 용량이 제가 멀 잘못했는지 글하나 올렸는데 200MB 에서 벌써 20MB 썼다고 나오고...
사진도 넘 커서 도아님이 만드신 플러그인 검색해서 이제 설치해 볼려고 합니다.
블로그 남들처럼 이쁘게 하고싶은데 마음대로 안되네요. 전혀 지식이 없는 상태에서 혼자 할려니...
하다가 막히면 도아님께 여쭤봐도 되죠? ^__^
이 플러그인 잘 사용해보겠습니다. -
noname 2008/06/17 21:19
텍스트큐브 1.7.1(RC)로 업그레이드 후에 이 플러그인이 동작하지 않더군요.
1.7에서 .htaccess 내용이 이전과 달리 바뀌었는데 이게 원인입니다.
증상만 파악하고 아직 어떻게 고칠지 몰라 그냥 내버려두고 있는데 도아님 참고하시라고 흔적 남기고 갑니다.
Facebook