gd, lightbox, slide 적용 심플 갤러리 > 그누4 스킨

그누4 스킨

스킨의 저작권은 해당 스킨 제작자님께 있으며, 그누보드의 저작권과 다를 수 있습니다.
스킨 다운로드시 좋아요와 감사의 코멘트를 남기시면 제작자에게 큰 힘이됩니다. ^^y
그누보드와 관련이 있지만 스킨과 빌더가 아니면 플러그인 게시판에 올려주세요.

gd, lightbox, slide 적용 심플 갤러리 정보

갤러리 gd, lightbox, slide 적용 심플 갤러리

첨부파일

phosay_gallery.zip (210.3K) 754회 다운로드 2006-07-12 12:15:23

본문

스크린샷으로 감 잡으시고,
링크에서 테스트후 괜찮아 보이면 소스를 열어보시기 바랍니다.
엄청 지저분 하다는 말씀,,
여러 고수님들을 괴롭힌 무례한 스킨으로 딱 한가지 슬라이드 관련 미결 사항이 있는 스킨입니다.
통합 그룹 갤러리에 관심이 있으신 분은 http://babybox.co.kr/g4/gallery/?gur=sample_gal 에서
id:tt pw:1111 로 로그인후 우측최상단 "도움말 열기"를 읽어보시기 바랍니다.
쓸만하다는 코멘트가 많으면 공개할 예정입니다.

특징;
-, 리스트에서 라이트박스 스크립트로 원본 이미지를 팝업해서 보여줍니다.
-, 각종 옵션으로 리스트된 이미지만 슬라이쇼 기능있습니다.
-, 전체 이미지 슬라이드 기능은 보람찬님 소스코드를 참조 단순화 했습니다.
-, 썸네일 생성 경로와 이름이 조금 다릅니다(data/file/bo_table/thum/bf_file name)
-, 1번 파일은 관리자가 지정한 이미지 파일만 업로드 가능하도록 했습니다.
-, 글 수정시 이미 업로드된 이미지를 이쁘게 보여주므로 수정 작업이 용이합니다.

통합 그룹 갤러리 작업의 부산물로 그룹 갤러리에 속한 모든 스킨의 썸네일 생성방법을 위와같이 통일했습니다.(장점:중복방지, 수정시 사용자 캐시의 영향을 받지않아 항상 업데이트된 이미지를 보여준다)
썸네일 정리를 위한 파일을 따로 만들어 넣었습니다. - 두가지 모두 유창화님께서 도와주셨습니다.

라이센스?
코멘트 붙이고 다운 받아가시면 안 됩니다.
다운 받고 테스트후 문제점을 코멘트에 붙여주셔야 사용가능합니다.
추천
14

댓글 전체

두분 코멘트 감사합니다.
"대단"의 뜻이 약간 모호하군요.
"삽질"을 언급하시는듯~~**

오늘 일도 손에 붙지않고 해서 위에 잠시 언급한 "통합 그룹 갤러리"를 정리해서 올려 놓았습니다.
묶음파일에 이 스킨도 포함되어 있으므로 관심있으신 분들은 아래 링크를 참조 하시기 바랍니다.
http://www.sir.co.kr/bbs/board.php?bo_table=g4_skin&wr_id=15341
감사합니다. 근데 리스트에서 새창열기하면
플록님 홈페이지처럼 그렇게 이쁘게 안뜨네요.
제 환경설정이 잘못된건가요 ?
수고하세요.
세분 코멘트 감사합니다.

Gatzz님 list.skin.php 308열 부근 아래 내용을 참고하세요.
lightbox_plus.js가 중복으로 링크되면 라이트박스 팝업이미지는 되지만 파일명이 나오지 않습니다.
중복되지 않도록 적절히 선택해서 사용하세요.

/*
rel='lightbox' 한페이지에 여러번 링크할경우 캡션에러 있으므로 주의
중복을 피하기 위해 모든 스킨의 해당 스크립트를 top.php 복사하고 스킨에서 주석처리함
이 스킨만 개별 적으로 사용시 아래 주석을 풀어주세요.
<!-- <link rel='stylesheet' type='text/css' href='<?=$board_skin_path?>/lightbox_plus/lightbox.css' />
<script type='text/javascript' src='<?=$board_skin_path?>/lightbox_plus/lightbox_plus.js'></script> -->
*/
/*    <---이것을 지우라는 예기시죠???? 지우면 에러뜨는데요..ㅜ.ㅜ
rel='lightbox' 한페이지에 여러번 링크할경우 캡션에러 있으므로 주의
중복을 피하기 위해 모든 스킨의 해당 스크립트를 top.php 복사하고 스킨에서 주석처리함
이 스킨만 개별 적으로 사용시 아래 주석을 풀어주세요.
<!-- <link rel='stylesheet' type='text/css' href='<?=$board_skin_path?>/lightbox_plus/lightbox.css' />
<script type='text/javascript' src='<?=$board_skin_path?>/lightbox_plus/lightbox_plus.js'></script> -->
*/
엉뚱한 글이될런지 모르겠습니다.
lightbox도 아직 설치를 안해서 이거 어디 버그인지는 모르겠지만..
gif이미지를 눌러보 본뒤에 다른 jpg이미지를 눌러보면..
지정된 시간 약 5 초 뒤에gif이미지가 보여지게 됩니다...
다른 이미지를 눌러도 계속 그 gif이미지가 보여지게 되는군요..
 샘플로..
http://babybox.co.kr/g4/bbs/board.php?bo_table=sample_gallery_2&page=
에 올려두었습니다. 여자 세분을 누르고.
그런다음 다른 이미지를 눌러서... 약 5초 있어 보시면 됩니다.
바로 윗분께 드린 답변처럼 링크 주석해제 활성화 시켜만 주시면 됩니다.
라이트 박스 스크립트와 이미지 CSS 모두 이미 스킨폴더에 들어있습니다.
위 pearly님께서 지적하신 문제를 해결하려면 lightbox 스크립트를 업데이트 해야 합니다.
테스트 링크에 적용시켜 놓았으니 한번 보시고 아래 경로에서 다운받아서 링크해 주세요.
lightbox 내부에 강력한 슬라이드 스크립트가 탑재되었습니다.
핫키 x 로 닫히는 기능 및 키보드 네비게이션도 추가되었군요.
테스트 링크 http://babybox.co.kr/g4/gallery/?gur=sample_gal

최신버전 다운로드 http://www.huddletogether.com/projects/lightbox2/lightbox2.02.zip

링크방법
<script type="text/javascript" src="<?=$gal4[url]?>/lightbox2.02/js/prototype.js"></script>
<script type="text/javascript" src="<?=$gal4[url]?>/lightbox2.02/js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="<?=$gal4[url]?>/lightbox2.02/js/lightbox.js"></script>

<link rel="stylesheet" href="<?=$gal4[url]?>/lightbox2.02/css/lightbox.css" type="text/css" media="screen" />


라이트박스의 슬라이드쇼 기능을 사용하기 위해 list.skin.php 에서 썸네일 링크 부분을 다음과 같이 수정합니다.
    //lightbox 사용
    echo "<tr><td align=center><a href='$dest_file' rel='lightbox[$bo_table]' title='".$list[$i]['file'][0]['source']." Hit: ".$list[$i]['wr_hit']."'>$img</a></td></tr>";//

리스트에 붙인 두개의 슬라이드쇼 스크립트는 제거해도 될듯합니다.
염치 없지만 아시는분 답변좀 부탁드리겠습니다
사진을 클릭하고 마우스를 오른쪽위로 올리면 next버튼이 나오던데
next버튼을 클릭하면 링크가 걸리면 테두리생기는걸 없앨려고 해봤는데
이거 어떻게 해야될지 모르겠네요 onfocus=blur();를 넣어봤는데 안되더군요;;
이 이미지는 css에서 불러오는거 같은데 그다음에 찾을려고 하니 자바스크립트;;;;
이 질문은 무시하셔도 상관없습니다^^;
위 코멘트를 참조해서 직접 업그레이드 하실것을 권해드립니다.
당장은 한 두가지 버그를 수정해서 바로 올리기도 뭐하고 추후 정리되는대로 업데이트 버전을 올리겠습니다.
적용에 문제가 있다면 코멘트 남겨주세요.
감사합니다. 링크 주소 받아서 하니깐 잘되네요..
<script type="text/javascript" src="<?=$gal4[url]?>/lightbox2.02/js/prototype.js"></script>
<script type="text/javascript" src="<?=$gal4[url]?>/lightbox2.02/js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="<?=$gal4[url]?>/lightbox2.02/js/lightbox.js"></script>

<link rel="stylesheet" href="<?=$gal4[url]?>/lightbox2.02/css/lightbox.css" type="text/css" media="screen" />
위에서
<?=$gal4[url]?>부분을 <?=$board_skin_path?>게 하니깐 잘되고요..
이미지 배꼽 떠서 bbs폴더에 images폴더 넣어주니깐 잘되고요..
근데.
리스트에 붙인 두개의 슬라이드쇼 스크립트는 제거해도 될듯합니다.
이 부분은 어떤 라인 인지 좀 가르쳐주세요.. 수고하세요.
잘 하셨네요.
//리스트에 붙인 두개의 슬라이드쇼 스크립트는 제거해도 될듯합니다.
그냥 두셔도 됩니다.

<?=$gal4[url]?> 변수는 "그룹통합갤러리" 관련 변수입니다.
일반스킨 게시판에 그룹별 최근이미지 스킨, 최신이미지 스킨 및 관련 라이브러리까지 참고 경로에 사용된 모든 스킨을 "그룹 통합 갤러리"에 올려 놓았습니다.
특정그룹전체를 하나의 갤러리로 구축하는 경우 참고하세요.
세분 코멘트 감사합니다.

Gatzz님,
최신갤러리에 적용하는 것도 어렵지 않습니다.
스크립트 링크 잡아주고, 썸네일 링크 부분만 위 코멘트 참조해서 수정해주시면 됩니다.
일반 스킨 게시판에 제가 올린"그룹 통합 갤러리"에 포함된 최신이미지 스킨을 참조하시면 되겠군요.
최고의 갤러리 스킨입니다.
공개해주신 플록님에게 감사의 댓글을 남김니다~

아주 작은거지만..혹시나 저같은 초보 분들을 위해서 적겠습니다.

썸네일등에서 분류를 직접 클릭했을경우..
진한 파랑색으로 분류가 나오는경우가 있습니다.
이것을 없애실려면
list.skin.php의 83열의
------------------------------------------------------------------------------------
      $style = " style='font-weight:bold; color:darkblue;' ";
------------------------------------------------------------------------------------
에서 color코드를 없애시던가 하시면 됩니다.

ps.적고보니 너무 초보적인거라서 부끄럽네요..
플록님 너무 예쁜 갤러리 스킨 만들어주셔서 감사합니다.^^
그런데 제가 초보여서 그런지 영 적용을 못시키겠네요..
질문란에 질문 남겨놓았는데요..
위의 샘플사이트처럼 팝업으로 멋진효과가 나타나지않고 자기창에서 그냥떠버리네요..ㅜㅜ
이유가 뭘까요..
바쁘시겠지만 조언부탁드립니다.
http://ejenkorea.co.kr/gnuboard4/bbs/board.php?bo_table=gallery
몇분께서 메일로 문의하셔서 라이트박스를 활용한 이미지 팝업에 대한 보충설명을 붙입니다.

---------------------------------------------------------------------------

1, 라이트 박스 최신버전 다운로드 http://www.huddletogether.com/projects/lightbox2/lightbox2.02.zip

2, 압축해제 lightbox2.02 폴더째 해당 스킨폴더에 업로드

3, list.skin.php 상단에 아래 코드 삽입 (중복되면 안됩니다)
<script type="text/javascript" src="<?=$board_skin_path?>/lightbox2.02/js/prototype.js"></script>
<script type="text/javascript" src="<?=$board_skin_path?>/lightbox2.02/js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="<?=$board_skin_path?>/lightbox2.02/js/lightbox.js"></script>
<link rel="stylesheet" href="<?=$board_skin_path?>/lightbox2.02/css/lightbox.css" type="text/css" media="screen" />

4, list.skin.php 썸네일 하이퍼링크부분에서 아래 코드를 참조 수정
    //lightbox 사용
    echo "<tr><td align=center><a href='$dest_file' rel='lightbox[$bo_table]' title='".$list[$i]['file'][0]['source']." Hit: ".$list[$i]['wr_hit']."'>$img</a></td></tr>";

--------------------------------------------------------------------------- 끝
거의 성공은 해가는데 갈길이 아직 머네여

리스트에서 사이즈가 조절이 안되여..

좋은 스킨 올려주신걸 훌융히 써야는데 이렇게 막혀있으니..죄송 쩝 -.-;;;

http://www.dart.co.kr/bbs/board.php?bo_table=gallery&page=

한번만보시고 문제의 힌트라도 좀 주시면 감사하겠습니다..
아참 그누는 4.09.02 현시간 최신 버젼입니다..
------------------------------------------------------------
아 해결됬습니다 정말좋은스킨 감사합니다.^^*
여분 필드3 에 줄바꿈(리스트 분류,최신글 분류,최신글 이미지) 숫자를 연이어 입력하세요.(5,2,6 처럼 구분자, 포함 모두입력후 추후 조정하십시오.
------------------------------------------------
에서 [[[리스트 분류,최신글 분류,최신글 이미지]]] 이부분이 무엇을 말하는지 모르겠어요.
5,2,6 으로 설정하긴 했는데. 1,1,1 등으로 변경해도 아무변화가 없던데여...

(리스트 분류,최신글 분류,최신글 이미지)의 뜻좀 알려주시면 감사하겠습니다.

어처구니 없는질문 같아 죄송합니다^^;;;
1) 리스트 분류 -> 리스트 및 뷰페이지 상단에 보여지는 분류 출력시 줄바꿈

2) 최신글 분류 -> 게시판이 아닌 그룹 인덱스에서 게시판내 분류별 최신글 출력 줄바꿈

3) 최신글 이미지 -> 게시판이 아닌 그룹 인덱스에서 갤러리 그룹의 전체 새 이미지 줄바꿈

즉, 1번은 분류를 사용할 경우 리스트나 뷰페이지의 상단에 보여지는 분류항목의 줄바꿈이고,

2,3 번은 이 스킨만 사용할 경우는 적용 사항이 없는 내용입니다.
그룹 인덱스 http://gnusr.com/g4/gallery/?gur=sample_gal 를 참조하시면 이해에 도움이 되실지 모르겠네요,

2번은 그룹인덱스 위에서 다섯번째 형태이고,
3번은 그룹인덱스에 전체적으로 적용된 줄바꿈 형태입니다.
잘사용하겠습니다.

전반적으로 하드코딩이 너무 되어있습니다 :(

loadingimg:'http://phosay.com/g4/gnusr/lightbox_plus/loading.gif',
expandimg:'http://phosay.com/g4/gnusr/lightbox_plus/expand.gif',
shrinkimg:'http://phosay.com/g4/gnusr/lightbox_plus/shrink.gif'

이와 같은식의 하드코딩은 실수이신지요???

slideshow_control.php , slideshow_main.php
SQL 구문에 g4_board_file 이와 같이 하드 코딩되어 있습니다.
g4_board_file -> $g4[board_file_table]
지적해주셔서 고맙습니다.^^
이후 업데이트가 있습니다만 제대로 정리하지 못해 죄송합니다.
lightox_plus 버전은 gif 에니메이션 관련 버그때문에 현재 사용하지 않습니다.
코멘트에 보시는 것처럼 2.02버전을 사용하실것을 권해드립니다.
문제된 하드코딩 부분을 지적해주셔서 감사합니다.
말씀하신 부분은 다음 버전에서 고쳐놓겠습니다.
이 스킨에서 업데이트된 스킨과 분류 다중선택 스킨등 다른 두개의 스킨을 포함한 그룹통합 개념의 갤러리 테스트 경로입니다.
http://gnusr.com/g4/gallery/?gur=sample_gal
바로바로 체크는 못합니다만, 해당 링크에 글 남겨주시면 참고하겠습니다.
pontos님 저도 그문제 때문에 확인했더니 라이트박스 2.0안에 첨부된 images 폴더를 통재로 그누보드 bbs 폴더에 넣으세요
그러면 해결됩니다...x표시 난 부분을 오른쪽마우스로 속성을 봤더니 bbs폴더의 이미지 폴더와 화일이 있어야 하더군요..
그 필요한 화일들이 라이트박스 안에 있었구요...
으~ 뭐가 잘못 됬는지 잘 모르겠는데요~~~~~

라이트 박스도 업글했고...그누보드도 업글 했는데...

라이트 박스로 창이 열리지는 않코 그냥 일반 창으로 열리는 어떻게 해야되나요...도와주세요..
급문의!!! 고수님들 부탁드려요~
이거 '리스트목록'에서 사진을 클릭해도 제목클릭처럼
내용을 바로 보이게 링크를 걸고싶은데 도저히 모르겠어요.
사진쪽에 링크를 수정해야할듯한데 스크립트에는 제가 도통몰라서리..
아시는 고수님들 답글부탁드려요^^;
전체 5,850 |RSS
그누4 스킨 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1402호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT