웹마스터 팁

  2. Support
  3. 웹마스터 팁

웹진/갤러리에서 썸네일 클릭 시 원본 이미지 보기 + HighSlide JS 적용 (수정)

2009.10.17 13:45

고진감래

소스 파일을 수정하는 것이므로 반드시 백업을 하시길 권합니다.

게시판의 썸네일 생성 함수를 응용해 원본 이미지를 구하는 함수를 만들어 
이를 게시판 썸네일에 링크 시키는 방식입니다.

1. (수정) modules/document/document.item.php 에서  } ?>  위에 다음 함수를 추가합니다.
      ※ (09.10.24 수정) 함수에 오류가 있어 수정했습니다.  

function getThumbSourceFile() {
            // 썸네일 원본 파일 출력함수
            if($this->get('uploaded_count')) {
                $oFileModel = &getModel('file');
                $s_file_list = $oFileModel->getFiles($this->document_srl);
                $s_source_file = $s_file_list[0]->uploaded_filename;
            }

            // 첨부된 파일이 없으면 내용중 이미지 파일을 구함
            if(!$s_source_file) {
                $content = $this->get('content');
                $s_target_src = null;
preg_match("/src=(\"|')([^\"' ]*?)(\"|')/is", $content, $s_matches);
              $s_target_src = trim($s_matches[2]);
                $s_source_file = $s_target_src;
            }
                      
            return $s_source_file;
        }
   }
?>

2. 게시판 스킨의 썸네일 링크 부분을 수정합니다. xe_official 게시판 스킨의 웹진 스타일을 예로 들면
modules/board/skins/xe_official/_style.webzine.html 에서 아래 부분을 찾아

<a href="{getUrl("document_srl',$document->document_srl,'listStyle',$listStyle, 'cpage','')}" class="thumb"><img src="{$document->getThumbnail($module_info->thumbnail_width, $module_info->thumbnail_height, $module_info->thumbnail_type)}" alt="" /></a>

다음과 같이 수정합니다.

<a href="{$document->getThumbSourceFile()}" class="thumb" target='_blank'><img src="{$document->getThumbnail($module_info->thumbnail_width, $module_info->thumbnail_height, $module_info->thumbnail_type)}" alt="" /></a> 

3. 만약 June Oh님의 HighSlide JS을 사용하고 있다면 아래와 같이 수정합니다.

<span class="thumb"><a href="{$document->getThumbSourceFile()}" class="highslide" onclick="return hs.expand(this)"><img src="{$document->getThumbnail($module_info->thumbnail_width, $module_info->thumbnail_height, $module_info->thumbnail_type)}" alt="" /></a></span>

4. 갤러리 스타일 역시 썸네일 부분을 찾아 위와 같은 방식으로 수정하면 됩니다. 
xe_official 게시판 스킨을 예로 들면 위의 2번 디렉토리에서 _style.gallery.html 파일을 아래와 같은 식으로 수정합니다.

<a href="{$document->getThumbSourceFile()}" target="_blank"><img src="{$document->getThumbnail($module_info->thumbnail_width, $module_info->thumbnail_height, $module_info->thumbnail_type)}" alt=""/><!--@if($module_info->use_category == "Y" && $document->get('category_srl'))--><strong class="category">{$category_list[$document->get('category_srl')]->title}</strong><!--@end--></a>

역시 June Oh님의 HighSlide JS을 적용하려면 아래와 같이 수정합니다.

<a href="{$document->getThumbSourceFile()}" class="highslide" onclick="return hs.expand(this)"><img src="{$document->getThumbnail($module_info->thumbnail_width, $module_info->thumbnail_height, $module_info->thumbnail_type)}" alt=""/><!--@if($module_info->use_category == "Y" && $document->get('category_srl'))--><strong class="category">{$category_list[$document->get('category_srl')]->title}</strong><!--@end--></a>
이 게시물을
좋아요
목록
제목 글쓴이 날짜
Autolink에 주소 복사 추가 & 본문 글 주소 복사 추가 [4] file 탑심 2008.06.22
[1원짜리팁] 큰 이미지 썸네일 못생성& 확장변수 원하는 곳에 배치하기 ^^ [2] 파파민 2008.06.23
php폼메일 관련 한번 올려봅니다. 사용하실분들은 수정하셔서 사용해보세요.. [10] file 코리아프럼 2008.06.26
동일한 계정내에서의 포워딩 방법 [2] file 하이쿠 2008.07.01
위지웍 에디터를 오페라 브라우져에서는 사용 안하기 라르게덴 2008.07.02
주소창에 보이는 아이콘 넣기..제로보드 XE에서 [2] file 은바가지 2008.07.03
[팁]페이지별 댓글 출력 초간단 팁.. [4] 키티나 2008.07.04
1차 메뉴에서 하위 메뉴 없을때 생기는 여백 없애는 방법 [7] 제로시오 2008.07.04
메뉴에 이미지 버튼 사용하기 팁이요~ 이미지첨부! [3] file Zzini.net 2008.07.05
list게시판 목록 제목 줄바꿈 안하기 [4] 팔공산 2008.07.05
FTP로 지워지지 않는 파일 삭제방법. [9] pakjce 2008.07.05
폼메일 응용해서 쓰세요... [6] file 코리아프럼 2008.07.08
1.04 엡데이트후 재설치등으로 로그인안될때 해결법 [5] 좀비이 2008.07.08
방명록 스킨을 통한 글 작성시 임시저장 가능케 하기(수정) 라르게덴 2008.07.08
최고관리자 이외에는 ''회원정보보기''를 막기 [13] 비나무 2008.07.10
다른 브라우저에서 내 사이트가 어떻게 보이나 확인하자~ [3] 비나무 2008.07.10
최근게시물에 권한주어서 회원만 내용물보게하기 [1] 팔공산 2008.07.11
댓글 입력창에 배경 이미지 삽입하는 방법 [4] 팔공산 2008.07.11
조건별로 스킨 바꾸기 file 라르게덴 2008.07.11
게시판 가로조절(width) 및 가운데로 이동 태그 [4] 박상욱860 2008.07.12
태그 쓰기