SweetTitles 와 Lightbox Js 를 함께 사용할때…

한동안 그러려니 하고 사용하고 있었는데, 가만 보니 Lightbox Js 를 통한 팝업 이미지에서 이미지 설명(Caption)부분이 사라져 있는게 자꾸 보여서 왜일까 했더니 문제는 SweetTitles에 있더군요.

Lightbox 에서는 이미지 링크를 포함한 태그에서 title 속성을 받아와서 이미지 설명(caption)부분에 출력하는데, sweetTitles 에서 그 title부분을 불러와서 tip속성으로 바꿔버리는데서 문제가 발생했습니다.

물론 이 경우는 sweetTitles 가 Lightbox 보다 먼저 로딩되었을때 발생하는 문제입니다.

확실한 해결법일지는 모르지만, 아래처럼 Lightbox에서 title을 읽는데 실패했을때 tip속성을 가져와서 설명란에 추가하도록 하면 문제는 해결되었습니다.

수정이 필요한 곳은 두줄 입니다.
331번줄 부근을

저와 같은 문제로 고민하셨던 분께서는 한번 적용해 보세요.

Wp-Scripts 플러그인에 포함된 lightbox.js, litebox.js 에는 이미 적용했습니다.

Sweet Titles 설치

Unfusion님의 Arekorepopup에러관련 글에서 Ceprix님코멘트를 보고 Sweet Titles를 설치했습니다.

Sweet Titles ScreenShot

팝업 뜨는 느낌도 좋고, 맘에 드는군요.:)

모든 브라우저에서 작동하는듯 하고..
Prototype.js와도 문제를 일으키지 않네요.

간단하게 설치 할 수 있도록 플러그인 형태로 만들어 봤습니다.

Show »

1. 프로그램 원작자 (Original Author)
2. 설치 (Install)
  • 아래 첨부된 파일을 다운받으세요.
  • 압축을 풀어 나오는 ‘wp-sweet-titiles’폴더를 플러그인 폴더에 업로드 하세요.
    (e.g. /wp-content/plugins/)
  • 관리자화면>Plugins에서 ‘Wp-Sweet-Titles’ 활성화(Activate)
3. 추가설명 (Readme)
  • 특별한 기능이 없이 헤더에 코드를 삽입해주기만 하는 플러그인이라 딱히 업그레이드 계획이 없습니다.