공지글 차별화 멀티옵션 갤러리 > 그누보드5 스킨

그누보드5 스킨

좋은 댓글과 좋아요는 제작자에게 큰힘이 됩니다.

공지글 차별화 멀티옵션 갤러리 정보

갤러리 공지글 차별화 멀티옵션 갤러리

첨부파일

gallery_notice.zip (55.1K) 23회 다운로드 2021-08-04 03:13:54 포인트 차감10
bbs.zip (6.8K) 4회 다운로드 2021-08-04 03:13:54 포인트 차감10
테스트한 버전5.4.9
호환 가능 버전아마도 모두

본문

 

예전 게시글의 완성본입니다. - https://sir.kr/g5_skin/46519

 

1. 예전 버전의 문제점

로직상으로는 이상이 없습니다. 단지 "시각적"으로 유쾌하지 못합니다.

예를 들어서 페이지 목록수를 12개로 정해주면 공지글까지 합쳐서 12개가 만들어지기 때문에 공지글이 2개일 경우는 목록부분이 10개가 되어 이빨이 빠져버린 것처럼 느껴집니다. 공지글을 추가하거나 삭제할 경우 페이지 전체가 들썩거리는 시각적인 문제가 있었습니다. 물론 2번페이지 부터는 상관이 없구요.

그래서 공지 숫자에 상관없이 페이지 목록수가 유지되도록 새롭게 코드를 수정하였습니다.

 

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

 

2. 기본코어를 건드리지 않으려고 했는데 재주가 메주라 bbs/list.php 를 수정할 수 밖에 없었습니다.

두개의 첨부파일을 모두 다운로드 받아야 합니다.

하나만 다운로드 받아도 기능하지 않습니다.

첫번째 첨부파일은 각각의 스킨 디렉토리에 올리고 두번째 첨부파일은 파일 3개를 모두 bbs 디텍토리로 올려주세요.

list.php 는 덮어씌우기가 됩니다. list_normal.php는 이전의 list.php 와 동일한 파일입니다.

list_notice.php 가 이 갤러리에서 사용할 파일입니다.

아래 그림처럼 게시판 여분필드 항목에서 가장 마지막 항목인 10 값에 yes 라고 적어줍니다.

만일 이 여분필드를 사용하지 않으면 원래의 list.php 처럼 작용하니 공지 갤러리를 적용할 때가 아니라면 처음부터 신경을 꺼 주시면 되겠습니다.

제목인 공지 차별화는 의미가 없고 그저 주석 설명글 정도이니 참고만 하시고 yes 영역만 집중해 주세요.

 

2944211003_1628014173.1876.jpg

 

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

 

3. 이 갤러리는 목록 이미지를 불러올 때 생성된 썸네일이 아니라 오리지널 이미지를 불러옵니다.

목록 이미지는 갤러리 원본 이미지의 가로 세로 사이즈에 상관없이 모든 목록 이미지의 가로 세로 길이를 똑 같은 사이즈로 불러오기 때문에 들쑥날쑥한 불편함이 없습니다.

 

988289629_1627997764.3029.jpg

 

세로길이의 퍼센트값을 조절하는 옵션이 게시판 관리페이지의 1번 여분필드에서 설정할 수 있습니다.

위 이미지의 예제에서는 80 으로 주었는데 이건 가로퍼센트가 100퍼센트라는 전제 하에서 세로길이의 퍼센트값을 의미합니다. 최대값은 100이고 100을 주면 정사각형이 됩니다.

단 100이상을 주면 그 영역은 진공으로 보이므로 100을 한계값으로 생각해 주세요.

주의사항은 70을 줄 때는 그냥 70으로 주어야지 70% 라는 꼬랑지는 붙이지 마세요.

 

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

 

4. 목록 이미지에 라운드 옵션을 줄 수가 있습니다. 여분필드 2번입니다.

라운드값은 %값이나 px값을 줍니다. 이건 세로 퍼센트값과는 다르게 반드시 px 이나 % 라는 단위를 함께 입력합니다. 예제에서는 30px 을 주었습니다.

 

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

 

5. 공지글 썸네일은 무조건 정사각형 이미지로 불러와 집니다.

이것도 게시판 여분필드 3에서 px 이나 % 로 입력합니다. 예제에서는 50% 로 주어서 원형이미지로 만들었습니다.

1,2,3번의 여분필드 제목은 큰 의미가 없습니다. 그냥 주석처럼 생각하세요.

 

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

 

6. 갤러리 게시글은 내용물 글쓰기가 필요없는 경우가 많습니다. 글쓰기 모드에서 본문숨기기 체크 후 아무 글자나 적어주면 텍스트가 본문 상에서 보이지 않습니다. 

 

988289629_1627983631.6401.jpg

 

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

 

7. pc 에서는 크롬에서 확인하였고 모바일에서는 안드로이드에서만 확인하였습니다.

그런데... 이상하게도 제가 자바스크립트로 만든 이미지 사이즈 조절함수 중 공지글 이미지함수가 크롬 모바일이나 네이버 어플 등에서는 잘 먹는데 삼성 인터넷에서는 잘 안 먹네요.

본문 목록과 동일한 코드인데 목록에서는 잘 먹거든요. 여하튼 재주 좋으신 분들은 알아서 고쳐 쓰세요.ㅋ

css 는 막코딩 했으니 다듬어서 사용하실 분들은 그렇게 하시길요.

 

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

 

2021년 8월 4일 오전 03시 10분을 기해 소스를 수정하여 새로운 파일과 설명글 올렸습니다.

 

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

추천
12

댓글 전체

죄송합니다.
2021년 8월 3일 오후 10시 40분을 기해 소스를 수정하여 새로운 파일과 설명글 올립니다.
파일을 다운로드 받으셨으면 새로 다운로드 받아서 사용하세요.
트리플님 늘 감사요.
죄송합니다.
2021년 8월 3일 오후 10시 40분을 기해 소스를 수정하여 새로운 파일과 설명글 올립니다.
파일을 다운로드 받으셨으면 새로 다운로드 받아서 사용하세요.
늘 감사드려요.
죄송합니다.
2021년 8월 3일 오후 10시 40분을 기해 소스를 수정하여 새로운 파일과 설명글 올립니다.
파일을 다운로드 받으셨으면 새로 다운로드 받아서 사용하세요.
그간 잘 지내셨는지요. 휴가때 다슬기 죽도록 잡았습니다.ㅋ
에고... 예전 방식으로 회귀해야겠네요. $list 를 스킨 디렉토리에서 무력화시키니
게시글 필드 정렬이 안 되네요.... 기본정렬 외에 조회수, 오래된 순... 등등이 먹통입니다.
스킨 디렉토리에서 다시 정렬하려니 성가시기도 하고...
그냥 첫번째 올린 방식으로 아침에 작업하려구요. 지금은 좀 자구요.ㅜㅠ
그러네요 ㅎ
혼란 드려 죄송합니다 ㅠㅠ
제가 다른 이유로 그런 방벙을 쓰는데
전 아래를 사용안해서 그 문제는 없었네요 ㅠ
list_notice.php
/*
if(!$sst)
    $sst  = "wr_num, wr_reply";

if ($sst) {
    $sql_order = " order by {$sst} {$sod} ";
}
*/
스킨 디렉토리에서 한 두개의 명령어 문제를 해결해도 내가 알지 못하는 어떤 요소가 차후에 생길 지 모르겠어요.
어쩌면 새롭게 변수의 정의를 요구할 수도 있고...
그래서 그런 걸 감안하고라도 문서 두개를 여분필드나 또는 기타 조건에 의해 통으로 인클루드 하는 게 정신건강에 이로울 것 같습니다.
신경 써 주셔서 감사합니다.
휴가기간동안 다슬기 잡으면서 코드가 머리속에 맴도셨겠습니다.
그누보드 순정판에 basic게시판은 공지글이 차별화 되어나오고 갤러리는 공지글이 차별화 되어있지 않은 것은 그 만큼 구현하기가 어렵다는 증거라고 보이는데요.
많은 분을 위해서 수고하시는 노력에 감사하다는 말씀을 드립니다.
고맙습니다. ^^
디테일하게 설명하자면 길고 여튼 소스질을 하다 보니 이전 스킨에서는 사소한 약점이 많이 발견되어서 은근히 시간이 걸렸습니다.

원래 아무리 쉬운 코드도 다른 분이 짠 코드는 눈에 쉽게 안 들어 오거든요.
덕분에 그누 갤러리의 기본 구조를 이 기회에 공부 하였습니다.
이건 또 제가 처음으로 만들어본 갤러리 게시판이기도 합니다.

저는 사실 홈페이지 만들고 뭐고 이것보다는 "그누게시판 포트폴리오"를 가지고 싶어요. 홈페이지 "꾸미기"는 사실 개발이나 프로그래밍이 아니라 디자인이나 퍼블리싱의 영역이라 제 취향과는 좀 안 맞거든요.

이제 진짜 마지막 수정본 올렸습니다.ㅋ
새롭고 멋진 갤러리 스킨입니다.

모바일에서 보면 썸네일이 한줄에 2개씩  작게 나오는데, 한 줄에 1개씩 썸네일이 크게 나오려면 어떻게 해야하는지요?

좋은 갤러리 스킨을 제작하시느라 수고가 많으셨습니다.
css 를 고쳐야 하는데... 음... 저 같은 경우는 되도록이면 원본 css 파일을 건드리지 않으려고 막코딩을 하거든요.

그래서 모바일 스킨 디렉토리에 list.skin.php 를 보면 61번째 줄에

<li class="gall_li <?php if ($wr_id == $list[$i]['wr_id']) { ?>gall_now<?php } ?>">

가 있습니다. 이 클래스는 기본이 50% 로 되어 있는지라... 아래처럼 고쳐주세요. 스타일로 가로를 100% 로 주세요.

<li style=width:100% class="gall_li <?php if ($wr_id == $list[$i]['wr_id']) { ?>gall_now<?php } ?>">

댓글 감사합니다.
수고하셨습니다ㅎ!

저는 페이징 문제때매 골치랑 코어를 안건드리고자

list.skin에서 목록을 두개 호출하고

상단(공지만)
하단(공지제외 또는 공지포함 모든글)

이렇게 했었거든요 ㅎ...
이 게시판의 기본소스도 그렇습니다. 상단에 is_notice 로 목록을 만든 php 를 인클루드하고 하단에는 !is_notice 로 불러 왔거든요.

그런데 단순하게 이렇게 만들면 1번 페이지에서 공지목록에 따라 페이지의 이빨이 빠지더라구요. 또 그걸 해결하고 나니 마지막 페이징 문제가 나오더군요.

마지막 페이징 문제는 총 목록 25개 중 12씩 정렬하고 공지가 2개라면 첫 페이지는 공지 2개-본문 12개, 2번 페이지는 공지-0개 본문 11개하고 2번 페이지로 끝이 나야 하는데 3번 페이지가 또 생겨요.

총 토탈값이 계산되어서 두개가 진공영역이 되긴 하는데 존재하지만 보이지 않는 꼴이라 쓸데없는 3번페이지가 생기는 바람에 그걸 처리하느라 시간이 좀 걸렸습니다.
결국 루프문으로 카운트할 때 마지막값으로 토탈수-공지목록수를 주고 루프문을 돌렸습니다.

앞으로 더 다듬어야지요. 특히 이미지를 같은 사이즈로 리사이징하고 테두리 설정값까지 같이 주다 보니 리소스가 큰 것 같습니다. 좀 더 효율적이고 부하가 작은 소스를 생각 중입니다.
전체 2,434 |RSS
그누보드5 스킨 내용 검색

회원로그인

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