홈>컴퓨터이야기
logo_01.gif


TOTAL ARTICLE : 91, TOTAL PAGE : 1 / 5
구분 웹일반 | 태그-소스 | 제로보드 | 그누보드 |
제로보드 : GD를 이용하여 썸네일을 제로보드 갤러리에 적용시키기
 오예    | 2004·05·20 01:27 | HIT : 3,478 | VOTE : 254
 FILE 
  • scroll_gal.zip (10.0 KB), Down : 21
  • thumbnail.zip (9.0 KB), Down : 26


  • 이제 본격적으로 GD함수를 이용하여 제로보드에 썸네일을 이용해 보겠습니다

    일단 이 첨부된 소스는 두가지 인데 thumb.php는 제가 쓰고 있는 파일입니다.

    호스팅 회사의 GD라이브러리의 오류때문에 gif 파일 생성이 안되더군요.. 그래

    서 gif 을 jpg 파일로 바꿔쓰고 있습니다. bmp 파일도 잘 안되고 오히려 용량

    이 커지기 때문에 jpg 파일로 변환하여 사용중입니다. 수정하실 분들은 수정하

    셔도 무방하구요..

    또하나 이전 강좌에서도 밝혔듯이 제 서버에서는 ImageCopyResampled 명

    령이 제대로 작동하질 않아서 아쉽지만 ImageCopyResized를 사용하고 있습

    니다. ImageCopyResampled 문을 사용하실려면 앞의 주석문(//)을 삭제하시

    고 ImageCopyResized문을 지워주세요~ 또 자신의 서버가 gif 파일 생성을

    잘 지원할 경우 thumbgif.php 을 thumb.php 파일로 교체한 다음 사용하세요~


    암튼 두 파일중 자신에 맞는 파일은 선택하여 thumb.php 로 이름을 바꾼뒤 4

    번째 줄의 제로보드 절대경로를 수정해 주시고, 49~51번째 줄 부근의 로고 이

    미지로 쓸 파일 이름을 수정해 줍니다. 그리고 thumb.php을 제로보드 폴더 안

    에 업로드 하고, 로고 이미지로 쓸 세가지 파일 logol.png, logom.png,

    logos.php 을 제로보드 images 폴더 안에 업로드 합니다. 이때 로고이미지는

    예쁘게 나타내기 위해 배경이 없는 투명이미지로 gif나 png 파일로 제작합니

    다. gif 파일일 경우 49~51번째 줄의 경로와 파일명을 수정해 주시고 53번째 줄

    의 $overlay_img=ImageCreateFromPNG($over); 를

    $overlay_img=ImageCreateFromGIF($over); 로 수정해 쓰시기 바랍니다.

    전 편의상 썸네일 이미지의 싸이즈에 따라 로고이미지를 세가지로 구분해 쓰

    고 있습니다. 썸네일이 작은 경우, 중간, 큰 경우 세종류로 나눠서 거기에 쓰일

    logos, logom, logol 로 나눴는데, 필요치 않으신 분들은 수정해서 쓰셔도

    상관없습니다~

    제가 사용하는 thumbnail 함수는 다음과 같습니다.

    thumbnail($file, $save_filename, $max_width, $max_height)

    $file은 원본 이미지의 경로입니다. $save_filename은 원본이미지 이름에 추가로 붙일 이름이구요, $max_width와 $max_height는 썸네일을 생성할 가로세로 사이즈 입니다. 예를 들어 원본파일이 $file="절대경로/test.jpg" 이고 $save_filename="_small.thumb" 이라면 동일한 폴더안에 "test.jpg_small.thumb" 으로 저장이 됩니다. 일단 썸네일의 생성은 첨부한 그림과 같이 센터를 중심으로 최대 사이즈로 잘라냈습니다. 이미지의 중앙에 대부분 표현하고자 하는 포인트가 있다보니 아무래도 가로세로 비율을 맞추면서 원하는 사이즈로 나타내는 방법으론 이게 젤 나을듯 싶더군여.. 암튼 다음으로 수정하여 사용하는 방법입니다.

    -----------------------------------------------------------------
    일단 thumb.php 파일과 제작한 로고이미지를 업로드 하시고 썸네일이 쓰일 제로보드 스킨의 setup.php 파일의 맨 위에 다음을 추가해 줍니다.

    include "thumb.php";
    ?>

    -----------------------------------------------------------------
    다음으로 list_main.php 파일의 맨 위에 다음을 추가합니다.(처음엔 글 작성완료 버튼을 누르는 순간 썸네일을 생성하게 할까도 해봤는데 그것보다는 목록보기를 할때 썸네일이 있는지를 체크해서 없으면 생성하는 방법이 더 좋을거 같더군요.. 혹시 첨부파일 정리를 해서 썸네일을 다 지웠더라도 목록보기를 하면 다시 생성할수 있으니깐.. 역시 제일 좋은 부분은 바로 list_main.php 안인거 같네여)

    if(eregi("\.jpg|\.png|\.jpeg|\.gif|\.bmp",$data['file_name1'])&&@file_exists($data['file_name1'])) {
    if(!@file_exists($data['file_name1']."_s.thumb")) thumbnail($data['file_name1'],"_s.thumb","40","30");
    if(!@file_exists($data['file_name1']."_m.thumb")) thumbnail($data['file_name1'],"_m.thumb","100","75");
    if(!@file_exists($data['file_name1']."_l.thumb")) thumbnail($data['file_name1'],"_l.thumb","200","150");
    }
    if(eregi("\.jpg|\.png|\.jpeg|\.gif|\.bmp",$data['file_name2'])&&@file_exists($data['file_name2'])) {
    if(!@file_exists($data['file_name2']."_s.thumb")) thumbnail($data['file_name2'],"_s.thumb","40","30");
    if(!@file_exists($data['file_name2']."_m.thumb")) thumbnail($data['file_name2'],"_m.thumb","100","75");
    if(!@file_exists($data['file_name2']."_l.thumb")) thumbnail($data['file_name2'],"_l.thumb","200","150");
    }
    ?>

    제로보드에 이미지나 파일을 업로드 하면 /bbs/data/게시판이름  폴더 안에 이미지가 업로드 됩니다. 소스를 수정하면 썸네일을 별도의 디렉토리에 생성하게도 할 수 있긴하지만.. 관리할때나 다른곳에서 불러올때나 제일 좋은 방법은 원본 이미지와 같은 폴더 안에 비슷한 이름으로 생성하는게 좋을거 같아서.. 일단 jpg 이미지 파일이라면, data/게시판이름/이미지.jpg_l.thumb 이런식으로 이름이 붙게 만들었습니다. 새로운 파일이름보다는 이렇게 하는게 후에 썸네일을 불러올때 수정하기도 간편하고 좋을거 같습니다. 전 썸네일을 small, midium, large 세 사이즈로 구분해서 쓰기 때문에 저렇게 사용하고 있습니다. 동일한 형식으로 자신의 홈에 맞게 수정하여 사용하시면 됩니다.

    -----------------------------------------------------------------
    다음으로 목록보기의 부분에 원본 이미지 대신 썸네일로 나타내는 방법입니다.
    이 부분도 보통 list_main.php 에 있습니다. 예를 들어 제로보드의 기본 갤러리 스킨인 zero_pic_gallery의 경우에는 55번째 줄의 $_srcname = $data[file_name1]; 이 부분을 중간사이즈의 썸네일로 나타낼려면, $_srcname = $data[file_name1]."_m.thumb"; 의 식으로 바꿔주면 됩니다. 그리고 갤러리 출력부분의 border=0 width= 같은 태그 안의 width 나 height 는 삭제하셔서 썸네일이 그대로 출력되게 바꿔주시면 됩니다.

    또 하나 ggambo5200_gallery 스킨을 예를 들자면, $screenshot = $data['file_name1']; 이나 $screenshot = $data['file_name2']; 부분을 위와 같은 식으로 $screenshot = $data['file_name1']."_m.thumb"; 같은 식으로 바꿔 쓰시면 됩니다. 물론 필요없이 이미지 사이즈를 체크하고, img 태그안의 width 나 height 설정부분은 제거해 주시면 원하는 사이즈의 썸네일로 출력이 가능합니다.

    말로는 복잡해 보여도, 단순한 태그만 알면 쉽게 수정할수 있으실거라 생각합니다~

    그리고 최근갤러리 부분을 수정하실때도 outlogin.php 의 print_gallery 펑션 안의 $filename = $_zb_url.$data[file_name1]; ,$filename = $_zb_url.$data[file_name2]; 이런 부분을 모두 위와 같은 방법으로 $filename = $_zb_url.$data[file_name1]."_m.thumb";, $filename = $_zb_url.$data[file_name2]."_m.thumb"; 이런식으로만 바꿔주시면 됩니다. 물론 _m.thumb 은 중간사이즈의 썸네일일 경우를 예를 든거구요~

    자신이 직접 만든 함수로 최근갤러리를 나타내시는 분들도 다 이런식으로만 수정해 주시면 됩니다.

    -----------------------------------------------------------------
    다음으로 글을 지웠을때 해당하는 썸네일도 함께 지워지도록 수정을 하겠습니다. 제로보드 delete_ok.php 파일 여시고 다음과 같은 부분을 찾아 그 아래에 소스를 추가합니다.
    // 파일삭제
       @z_unlink("./".$s_data[file_name1]);
       @z_unlink("./".$s_data[file_name2]);

       //추가
       @z_unlink("./".$s_data[file_name1]."_s.thumb");
       @z_unlink("./".$s_data[file_name1]."_m.thumb");
       @z_unlink("./".$s_data[file_name1]."_l.thumb");
       @z_unlink("./".$s_data[file_name2]."_s.thumb");
       @z_unlink("./".$s_data[file_name2]."_m.thumb");
       @z_unlink("./".$s_data[file_name2]."_l.thumb");

    물론 자신이 생성한 파일명이 _s.thumb, _m.thumb, _l.thumb 이 아닌경우에는 맞게 고치시면 되구요.. 그 다음으로 글 수정하기를 했을 경우 업로드된 이미지를 삭제했을때 썸네일도 함께 삭제되기 위한 수정입니다. write_ok.php 파일을 여시고 * 수정글일때 부분을 찾아 수정을 합니다.
    <원본>
    // 파일삭제
                    if($del_file1==1) {@z_unlink("./".$s_data[file_name1]);$del_que1=",file_name1='',s_file_name1=''";}
                    if($del_file2==1) {@z_unlink("./".$s_data[file_name2]);$del_que2=",file_name2='',s_file_name2=''";}

    <수정>
    // 파일삭제
                    if($del_file1==1) {
                            @z_unlink("./".$s_data[file_name1]);
                            @z_unlink("./".$s_data[file_name1]."_s.thumb");
                            @z_unlink("./".$s_data[file_name1]."_m.thumb");
                            @z_unlink("./".$s_data[file_name1]."_l.thumb");
                            $del_que1=",file_name1='',s_file_name1=''";
                            }
                    if($del_file2==1) {
                            @z_unlink("./".$s_data[file_name2]);
                            @z_unlink("./".$s_data[file_name2]."_s.thumb");
                            @z_unlink("./".$s_data[file_name2]."_m.thumb");
                            @z_unlink("./".$s_data[file_name2]."_l.thumb");
                            $del_que2=",file_name2='',s_file_name2=''";
                            }

    -----------------------------------------------------------------
    이제 수정은 다 끝났습니다. 직접하면 정말 간단한 건데 설명할려고 하니 상당히 길어지네요... 복잡해 보이구여. ^^;; 글을 삭제할때나 수정했을때의 제로보드 수정부분은 안하셔도 상관은 없습니다. 썸네일을 지워주고 싶으시면 직접 ftp 프로그램으로 접속하셔서 지워주셔도 되고 제로보드 관리자 모드의 첨부파일 정리를 하셔도 썸네일이 삭제됩니다. 그리고 나서 다시 해당 게시판의 목록보기를 하면 재생성 되구요.. 이를 응용하면 얼마든지 다양한 기능 구현이 가능합니다. 트래픽도 상당량 줄일수 있구요.. 아무래도 썸네일이 요즘 추세이다 보니 아직 사용해보지 않으신 분들을 위해 허접하게나마 팁을 올려봤네여..



    -----------------------------------------------------------------
    *추가팁+1*
    사용하다 보니 이미지가 가끔 원하는 사이즈보다 한 1픽셀정도 작아져서 오른쪽끝이나 아래끝부분에 흰줄이 가끔 보일때도 있더군여.. 이럴땐 thumb.php 소스의 ImageCopyResized($dst_img, $src_img, 0, 0, $srcx, $srcy, $max_width, $max_height, $srcW, $srcH); 이부분을
    ImageCopyResized($dst_img, $src_img, 0, 0, $srcx, $srcy, $max_width+1, $max_height+1, $srcW, $srcH);
    이렇게 바꿔놓고 사용해 보세여~
    샬롬~
    난! 자유인...
    이영호
    감사합니다. 좋은자료....<BR>그런데 썸네일된 파일을 파일명+"_l.thumb" 이런식이아닌 확장자를 "thumb" 로만 할려면 어떻게 해야합니까?? 예을 들면 test.jpg 화일을 test.jpg_l.thumb 가 아닌 test.thumb로만 주고 싶습니다.<BR>어디를 수정해야하나요??

    06·02·19 02:40 수정 삭제

    오예
    방문해 주셔서 감사합니다.
    소스에 보면
    @z_unlink("./".$s_data[file_name1]."_s.thumb");
    @z_unlink("./".$s_data[file_name1]."_m.thumb");
    @z_unlink("./".$s_data[file_name1]."_l.thumb");
    이부분이 있습니다. 저기에 _s 나 _m  나 _l 를 자신이 원하는 이름으로 모두 바꾸어 주시면 되겠네요.

    참고로 요즘에는 게시판 스킨내에 자체로 썸네일을 지원하는 게시판들이 있습니다. 이런 게시판을 쓰면 더 편합니다.

    06·02·19 16:36

      
    91 태그-소스   [java]마우스 오른쪽버튼 반응없게 (소스보기금지)  오예(쥔장) 04·05·04 1988 134
    90 태그-소스   [css]스크롤바 색 바꾸기  오예(쥔장) 04·05·04 2038 137
    89 태그-소스   [java]소스보기 금지된곳 소스보기  오예(쥔장) 04·05·04 2135 150
    88 제로보드   제로보드 30초 제한 풀기  오예(쥔장) 04·04·14 2514 162
    제로보드   GD를 이용하여 썸네일을 제로보드 갤러리에 적용시키기 2  오예 04·05·20 3478 254
    86 제로보드   여러게시판 최근게시물 통합하여 뽑기 2차 수개 버젼입니다.  오예 04·05·28 5156 389
    85 태그-소스   [태그]그림에서 오른쪽 마우스 작동안되게 하는법  오예 04·06·02 2586 266
    84 제로보드   [제로보드]제로보드 최신버전에서 플래시 메뉴 사용할때 새로고침 안되는 문제  오예 04·08·30 4025 299
    83 제로보드   [제로보드]새로고침 후에도 현재 페이지 계속 보이기  오예 04·08·30 2883 299
    82 태그-소스   [태그]embed 태그의 못든 것  오예 04·10·20 3228 201
    81 태그-소스   [태그]object 태그(iframe 대신 사용) 2  오예 04·12·31 2169 113
    80 태그-소스   [태그]iframe 태그  오예 04·12·31 2338 111
    79 제로보드   게시판에 스팸방지하기  오예 05·01·19 2444 160
    78 태그-소스   스크롤바 색상바꾸기  오예 05·02·02 2005 138
    77 태그-소스   [태그]소스보기 막기 모음  오예 05·05·04 2113 103
    76 태그-소스   [태그]소스보기 막기 강좌  오예 05·05·04 2119 106
    75 제로보드   최근 게시물보기 속도 빠르게 만들기  오예 05·06·02 3370 119
    74 제로보드   GD게시판의 썸네일을 이용해 겔러리 최근파일 빠르게 보여주기  오예 05·06·08 2008 116
    73 제로보드    [팁]게시물 작성시 내용을 복사해주기  오예 05·06·21 2212 128
    72 제로보드   제로보드에 웹에디터 사용하기(미니위니)  오예 05·06·21 3040 166
    12345
    Copyright 1999-2020 Zeroboard / skin by GGAMBO