그누보드4 게시판 본문 이미지 썸네일 팝업 뷰어 구현 가이드

• 목록
• 스크랩

그누보드4 게시판 본문 이미지 썸네일 팝업 뷰어 구현 가이드

그누보드4(G4) 게시판 운영자 및 개발자가 본문 첨부 이미지를 작은 썸네일로 미리 보여주고, 클릭 시 팝업 창으로 원본 이미지를 띄울 수 있는 구현 방법을 확인합니다.

그누보드4 게시판 본문 이미지 썸네일 및 팝업 뷰어 구현 방법

그누보드4 게시판에서 첨부된 이미지를 작은 썸네일 형태로 미리 보고, 마우스 오버 시 하단에 큰 이미지로 전환되며, 클릭 시 새 창에서 원본 이미지를 팝업 뷰어로 띄우려면 view.skin.php 파일을 수정해야 합니다.

1. view.skin.php 파일 수정

기존 파일 내 파일 출력 관련 PHP 코드 영역을 아래의 JavaScript 함수, 썸네일 생성 로직, 그리고 HTML 출력 구조로 교체합니다.

주요 코드 구성

• JavaScript 팝업 및 마우스 오버 함수: View_Open(img, w, h) 함수를 통해 새 창을 열어 원본 이미지를 출력하고, bgChange(imgName) 함수로 마우스 오버 시 하단 미리보기 이미지를 변경합니다.
• GD 라이브러리를 활용한 썸네일 생성: 첨부파일 테이블($g4[board_file_table])에서 이미지를 조회하여 $thumb_path (예: $data_path/thumbOpen) 디렉토리에 썸네일 파일이 존재하지 않을 경우 imagecreatefromjpeg, imagecreatefrompng, imagecreatefromgif 및 imagecopyresampled 함수를 사용해 썸네일을 동적으로 생성합니다.

2. 확인 및 주의사항

• 디렉토리 권한 설정: 썸네일이 저장될 thumbOpen 폴더가 없을 경우 코드가 자동으로 생성(@mkdir)하고 권한을 변경(@chmod)하지만, 서버 환경에 따라 쓰기 권한(0707 등)이 올바르게 부여되었는지 확인해야 합니다.
• GD 라이브러리: PHP의 GD 라이브러리 설치 여부 및 이미지 포맷 지원 상태에 따라 썸네일 생성 기능이 정상 작동하지 않을 수 있으므로 서버 환경을 함께 점검해야 합니다.

PHP GD 라이브러리와 썸네일 생성 작동 조건

그누보드4 게시판 본문 이미지 썸네일 생성 기능은 서버 환경에 PHP GD 라이브러리가 설치되어 있어야 정상적으로 작동합니다.

• 작동 조건: 썸네일 생성 로직에서는 imagecreatefromgif, imagecreatefromjpeg, imagecreatefrompng 및 imagecreatetruecolor, imagecopyresampled 함수를 사용합니다. 따라서 서버에 GD 라이브러리가 설치되어 있지 않거나, 필요한 버전 및 이미지 포맷을 지원하지 않으면 썸네일 생성에 실패할 수 있습니다.
• 확인 및 조치: 썸네일이 생성되지 않거나 에러가 발생할 경우, 서버의 PHP GD 라이브러리 지원 여부와 함께 썸네일 저장 디렉토리(thumbOpen)의 퍼미션(권한) 및 원본 이미지 포맷을 확인해야 합니다.

썸네일 디렉토리 권한 설정 방법

그누보드4 게시판 본문 이미지 썸네일 생성 기능 구현 시, 썸네일 이미지가 저장될 디렉토리(thumbOpen)가 존재하지 않을 경우 코드를 통해 디렉토리를 생성하고 권한을 부여할 수 있습니다.

디렉토리 생성 및 권한 부여 코드

뷰 스킨 파일(view.skin.php) 내에서 다음과 같이 디렉토리 존재 여부를 확인하고 생성 및 권한을 설정하는 로직을 포함합니다.

$data_path = $g4['path']. "/data/file/{$bo_table}";
$thumb_path = $data_path. '/thumbOpen';

if (!is_dir($thumb_path)) {
 @mkdir($thumb_path, 0707);
 @chmod($thumb_path, 0707);
}

• 설정 위치: view.skin.php 내 썸네일 생성 로직 상단
• 권한 값: 0707
• 예외 및 다음 행동: 디렉토리 생성 및 권한 변경 함수(mkdir, chmod) 실행 시 서버 환경에 따라 권한 오류나 썸네일 생성 실패가 발생할 수 있습니다. 이 경우 서버에 GD 라이브러리가 정상적으로 설치되어 있는지 함께 확인해야 합니다.

실전 FAQ

Q. 썸네일이 생성되지 않고 깨져서 나타날 때는 무엇을 확인해야 하나요?

• 실행 중 막히는 점: 썸네일 폴더(thumbOpen)는 생성되었으나 이미지가 정상적으로 표시되지 않거나 깨지는 현상
• 예외 및 대안: 서버에 PHP GD 라이브러리가 설치되어 있지 않거나, 사용하려는 이미지 포맷(JPG, PNG, GIF 등)을 지원하지 않을 때 발생합니다. 서버 환경에서 GD 라이브러리 설치 여부를 확인하거나, PHP 설정 파일(php.ini)에서 GD 확장 기능이 활성화되어 있는지 점검해야 합니다.

Q. 썸네일 저장 경로의 퍼미션 오류가 발생할 때는 어떻게 조치하나요?

• 실행 중 막히는 점: 코드를 적용했으나 디렉토리 생성 및 권한 설정 과정에서 썸네일이 저장되지 않는 문제
• 예외 및 대안: view.skin.php 내에서 is_dir 및 mkdir 함수로 thumbOpen 디렉토리를 자동 생성할 때 웹 서버 계정에 쓰기 권한이 부족할 수 있습니다. 수동으로 data/file/{$bo_table}/thumbOpen 폴더를 생성하고 퍼미션을 0707 또는 0777(서버 환경에 따라)로 설정해야 합니다.

함께 보면 좋은 글

• 그누보드 기본 게시판 본문 이미지 자동 리사이징 비활성화 방법
• 그누보드 본문 이미지 클릭 시 원본 이미지 새창 열림 방지 설정 방법
• 그누보드 게시판 본문 이미지 및 텍스트 중앙 정렬 설정 방법

참고자료

기타 참고자료

• sir.kr — gd를 이용한 썸네일 만들기 - SIR - 개발자 커뮤니티
• sir.kr — GD 라이브러리를 이용한 섬네일 이미지 만들기 - SIR - 개발자 커뮤니티
• sir.kr — 이미지 등록과 함께 썸네일 파일 생성하기 write_update.skin.php파일 - SIR - 개발자 커뮤니티
• mercury-seed.com — 그누보드5 갤러리 게시판 썸네일 생성 오류 및 GD 라이브러리 설정 | 데빈포 : 그누보드 포럼
• selfdevelope.tistory.com — IT,라이믹스,XE(Xpress Engine),자바,파이썬,마리아DB,php,스크래핑,파싱,크롤링,스프링등 알짜 정보 제공