lightbox는 Lockesh Dhakar가 Javascript를 이용하여 그림이 삽입될때, 크기가 큰 사진의 경우 작은 thumbnail로 만들어서 클릭했을때, 본 크기로 보여지게 하는데 도움을 주는 툴입니다. 이것을 wordpress plugin으로 적용한 것이 Lightbox plugin for WordPress 입니다.
이 plugin이 할 수 있는 feature의 하나는 lightbox에서 한가지 실험해 볼 수 있습니다. 이 글에서도 예제를 하나 보여드리면,
위를 클릭해 보면, 현재 제가 쓰고 있는 lightbox plugin이 어떻게 동작하는가를 보여 줍니다. (예제는 flickr에서 linoush2000님이 올린 photo중에서 “ain’t no sunshine…” 이라는 제목의 사진을 가져왔습니다.)
Install
Plugin의 install은 무척 쉽습니다. admin 페이지에서 add new를 클릭하여 lightbox를 검색해서 찾아서 바로 인스톨하거나 lightbox에 들어가서 zip파일을 받은 후에 역시 admin 페이지에서 add new로 업로드 하시면 됩니다. (자세한 것은 WP 홈페이지 를 참조하시기 바랍니다.)
Usage
아주 간단합니다. 다음과 같은 tag를 써주면 됩니다. 위의 예제를 보면,
<a title="ain't no sunshine..." href="http://farm2.static.flickr.com/1320/3352689777_c561568b36_b.jpg" target="_blank"><img title="ain't no sunshine..." src="http://farm2.static.flickr.com/1320/3352689777_c561568b36_m.jpg" alt="ain't no sunshine..." width="240" height="180" /></a>
와 같이 하면 됩니다.
사진을 눌러봤지만 lightbox2 플러그인이 작동하지 않고 있습니다. 그냥 새창만 덩그러니 떠버리는군요.
음? 아마도 혹시 페이지가 모두 로드가 안되었을때 클릭을 하셨거나, 잠깐 서버에 문제가 있었거나 하지 않았을까요? 저는 잘 됩니다만….저의 경우는 Ubuntu 8.10에, Firefox 3.07인데요, 혹시 어떤 플랫폼의 어떤 브라우저이신지 알려주시면 제가 함 테스트 해보지요.
전 사진을 클릭한 후에 호출된 대형 사진의 하단부분에 클로즈가 클릭이 안되네요^^; 브라우저는 크롬쓰고 있습니다 ㅎㅎ;
그러네요. 크롬에서는 하단부분 CLOSE가 클릭이 안되네요. 원저자에게 한번 얘기해 봐야 겠군요. 🙂
감사합니다.
p.s. 몇번 실험을 해봤는데, 제가 가진 테마와 다른 javascript와 충돌이 나는 것 같아요. 다른 일반 테마와 다른 javascript를 쓰지 않으니까, 크롬에서도 잘 동작하는 plugin 입니다. 그러니까, 제 홈에서만 발생하는 것 같네요. 나중에 시간이 좀 되면, 살펴보도록 하지요. 알려주셔서 감사합니다.