[펄스나인] 반응형 갤러리 V2+유튜브/썸네일 자동등록 > 그누보드5 스킨

그누보드5 스킨

스킨 다운로드시 좋아요 클릭과 감사의 코멘트를 남기시면 제작자에게 큰 힘이됩니다. ^^y

[펄스나인] 반응형 갤러리 V2+유튜브/썸네일 자동등록 정보

갤러리 [펄스나인] 반응형 갤러리 V2+유튜브/썸네일 자동등록

첨부파일

첨부파일 false9_gallery_v2.zip (113.3K) 141회 다운로드 2019-10-15 17:57:53 포인트 차감10
테스트한 버전11.3
호환 가능 버전5.3.x.x

본문

2019.10.15 수정내용
기존 고해상도 썸네일 maxresdefault.jpg 을 가져오던 부분이

HQ 영상이 아닌경우 썸네일이 없는 경우가 있으므로 기본 썸네일 0.jpg

가져오도록 변경 하였습니다.
피드백 주신 @goodbam 님 감사합니다.

 

수정된파일

list.skin.php (91라인 끝부분 .jpg 파일명 수정)

 

2019.10.13 수정내용
유튜브 동영상 재생 및 썸네일 자동등록 추가 되었습니다.

여분필드 wr_10 을 활용하고 있으며 유튜브 동영상 ID 만 입력하시면 자동 등록 됩니다.

유튜브 동영상 ID는 동영상 주소에서 아래 빨간색 부분 입니다.
예) https://www.youtube.com/watch?v=rDZEYB1EkaU

 

수정된 파일

autoptimize_bbs.css (44라인 ~ 50라인 추가 및 수정)

list.skin.php (84라인 ~ 96라인 수정)

view.skin.php (70라인 ~ 75라인 추가)

write.skin.php (135라인 ~147라인 추가)

 

리스트 썸네일 추출 우선순위

1순위 : 첨부파일이 이미지인 경우

2순위 : 에디터에서 이미지가 입력된 경우

3순위 : 유튜브 동영상 ID를 입력한 경우

 

동영상 ID가 입력되어 있고, 첨부파일이 이미지인 경우

첨부파일 이미지가 썸네일이 됩니다.

동영상의 썸네일인 경우 Youtube 재생버튼 아이콘이 보여집니다.

 

안녕하세요. 펄스나인 입니다.

한동안 바빠서 스킨업로드를 못했네요..

 

반응형 갤러리 업로드 이후에

생각보다 많은분들께서 스킨을 써주셔서 감사의 인사를 전함과 동시에

다음버전을 살포시 업로드 해봅니다.

 

· a 링크 ajax 처리 전부 제거

· 페이드인, 아웃 효과 제거

· 그누기본 default.css 와 겹치치 않도록 css 코드 일부 제거 및 변경 (남아있을 수 있음...)

· 스크립트 에러 찾아서 수정 및 제거

· 댓글작성 후 수정시 새로 등록되던 문제 처리

· 비밀댓글 되지않던 부분 추가

· 리스트 레이아웃 변경(그리드)

· 롤오버 효과, new 뱃지 추가, youtube 뱃지 추가

· 유튜브 동영상재생(iframe) 추가 및 썸네일 자동등록 추가

· 기타 등등.. 추가추가추가추가제거제거.

· 귀차니즘으로 인라인 style 이 조금 있을 수 있습니다.

· 코드 좀 더럽습니다.

 

· 테스트 그누 버전 : 5.3.3.6

· 폰트어썸 4.7.0 (그누기본) https://fontawesome.com/v4.7.0/icons/

· 제이쿼리 3.1.1 http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js
 

썸네일의 사이즈를 비율로 조정하기 위해

게시판관리 > 갤러리이미지 높이를 으로 맞춰주세요.

 

237736610_1570799991.4177.png

 

온전한 피드백은 언제나 환영 입니다 ^^

 

 

1754226440_1570912767.3349.jpg

237736610_1570801149.6175.jpg

추천23

댓글 전체

편의상 유튜브 동영상 기능이나 썸네일 등록이 되는부분도
있으면 좋을것 같아서 추가해 보았습니다.
좋은 의견 감사드립니다.

다만, 에디터 안에 유튜브에서 제공하는 코드복사로 입력하기에는
반응형 처리나 비율처리 등의 문제가 있어서
동영상 ID만 입력하면 동영상 재생이나 썸네일이 등록 되도록 처리했습니다.
자세항 설명은 위에 적어두었습니다~
대박 입니다!!!!  감사합니다
펄스나인님이 그동안 만들어주신 게시판 스킨들이 너무 이뻐서 사용하고 싶었는데 유튜브 썸네일이 없어서 매우 아쉬웠었습니다!!

기존에 올려주신 펄스나인님꺼 게시판 스킨들에도 이와 같이 유투브 썸네일 기능을 추가하려면 어떻게 해야하죠?? ㅜㅜ
감사히 사용하겠습니다~!
그런데 default.css에서 footer 부분이 겹쳐서 footer부분을 일단은 모두 주석처리해두었는데,
이 스킨에서는 footer를 어떤부분에 사용하는 것인가요?
주석처리하고 사용해도 문제는 없을까해서 댓글 남겨봅니다!
게시판과는 관계가 없습니다~
전에 테마에서 사용하던 공용 css를 분리해서 게시판에 적용을 한거라서
테마에서 쓰던 style이 남아있을 수 있습니다 ^^;

지운다고 지웠는데 아직 남아 있었나보네요~ㅠ
와....엄청나게 빠른답변 감사합니다.!!
제가 생각했을 때 PC에서 그림을 3개의 컬럼으로 나누는 부분이
sizer라는 친구를 이용해서 사이즈를 맞추고?
배치를 시키는 방식인 것 같은데
모바일에서는 이 sizer가 작동을 하지 않는듯합니다.
물론 이렇게 일부로 구현하신 것으로 보이지만...
최소한 3개가 아니라 모바일에서 1줄에 이미지가 2개씩이라도 보이게 하려면
이를 조정하거나 threecolumns를 이용해서 해야될 듯 한데...
일단 모바일에서는 이 %가지고 조절하려 디버깅을 해보아도 그림 사이즈만 줄고
배치는 되지를 않는것 같아요.
혹시 조금이라도 힌트를 주실 수 없을까요...?


예상하기로는 배치를 위해 사용되는 클래스는 ... 아마도 autoptimize_bbs.css 에서의 이 클래스입니다.
(.portfolio__grid.three--columns .item, .portfolio__grid.three--columns .sizer
네 맞습니다. js파일을 통해서 컬럼처리를 하고 있습니다~
방금 다시 테스트를 해보니 모바일에서도 작동은 합니다. 혹시 다른부분에 문제가 없으신지 확인이 필요할것 같습니다.

모바일 에서는 현재 한장씩 보여주고 있습니다.
2장 이상으로 나누고자 하시는 경우는 꼭 js를 수정하실 필요는 없으실것 같고
css에서 @media max-width 별로 이미지 사이즈를 조정해보셔요.

이미지의 width가 100% 되는 구간이 있는데
이 구간을 좀더 줄이시면 될것 같습니다.
부트스트랩내용 끝나고 나오는 클래스 부분 말고
거의 맨 끝에도 미디어쿼리로 이부분이 선언이 되있는걸 찾았네요.
감사합니다!
완벽한 반응형 유튜브 스킨 너무 고맙습니다^^ 한가지 여쭈어 보고싶은 부분이 유투브 썸네일이 나오지 않는 경우는 뭘까요? 첨부파일도 없고 코드만 넣고 내용에 점하나 찍어서 올리니 썸네일이 나오지않네요? 어딘가 다른 수정부분이 필요할까요? 5.3 버전입니다~
혹시 다른 동영상ID도 넣어보셨어요?
고해상도 이미지를 가져오도록 세팅이 되어있는데
아무래도 해당동영상에 고해상도 썸네일이 없는 경우인것 같네요!
고해상도를 일반 해상도로 바꿔서 테스트해보고
다시 올려 드리겠습니다 ^^
썸네일 추출을 maxresdefault.jpg 로 하고있었는데
이 썸네일이 HQ영상 에서만 생성이 되는 썸네일 이라고 하네요~

동영상 배경으로 들어가는 썸네일(기본) 0.jpg 으로 수정하여 업로드 했습니다.
다시 테스트 부탁드립니다 ^^
우와 피드백 속도 장난아니군요^^ 최곱니다ㅎㅎ 말씀하신부분 업로드하여 확인해보니 정상적으로 섬네일 출력됩니다. 너무 감사드립니다^^
안녕하셔요~
베이스 게시판에 검색이 빠져있어서 그부분은 고려하지 못했네요 ㅎㅎ
다음주쯤 업데이트 해보겠습니다.
급하시면 검색부분만 넣어주시면 작동은 할거에요 !
드디어 다운받아 적용했어요^^ 그런데.. tail 하단 페이지가 깨져서 나오네요 ㅜㅜ
autoptimize_bbs.css 여기에서 수정을 해야하는거 같은데.. 초보라 잘 모르겠네요.
게시판을 적용하신 페이지의 하단파일에 들어가있는
클래스(class)명을 확인해주시고
autoptimize_bbs.css 파일에 동일한 클래스명을 쓰고있는것 같으니
중복되는게 있다면 지워주시면 되겠습니다.

테마에서 사용하던 css를 분리해서 게시판에 적용을 해서
footer나 기타 겹치는 클래스가 있을 수 있습니다.

해당부분은 조속히 수정을 해보겠습니다 ^^

게시글 입력창이 이렇게 깨지는데 왕초보라 어디를 건드려야할지 모르겠네요ㅠㅠ!
사용하고 있는 css가 충돌된걸까요? 다른페이지는 다 정상작동합니다!
css 충돌인것 같습니다.
글쓰기 부분 전체를 감싸는 div의 사이즈가 줄었네요
전제를 감싸는 부분의 class를 체크해보셔야 될것 같습니다~
또는 문제되는 부분의 css에서 !important 를 추가해보세요.
사용예) .div {width:100% !important}

해결이 안되시면 해당페이지의 url을 쪽지 또는 메일로 보내주시면
확인한번 해보도록 하겠습니다.
전체 1,661 |RSS
그누보드5 스킨 내용 검색

회원로그인

진행중 포인트경매

  1. @멘션 알림 자동완성 + Ckeditor4 플러그인

    참여18 회 시작19.11.17 11:33 종료19.11.24 05:15

(주)에스아이알소프트 (06253) 서울특별시 강남구 도곡로1길 14, 6층 624호 (역삼동, 삼일프라자) 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT