여분필드 활용 오디오/비디오 출력 스킨 > 그누보드5 스킨

그누보드5 스킨

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

여분필드 활용 오디오/비디오 출력 스킨 정보

갤러리 여분필드 활용 오디오/비디오 출력 스킨

첨부파일

wr_av_2017.09.14_1.7z (20.1K) 334회 다운로드 2017-09-14 21:50:33

본문

http://sir.co.kr/g5_skin/7650

위 내용과 달라진 부분은 거의 없습니다.
경로가 테마로 바뀐 것과 극히 일부의 소스가 업데이트 된 것 뿐입니다.

'your theme' 폴더의 내용은 사용하시는 테마 안에 넣어주면 됩니다.


1889776576_7qlr30i2_2015.05.29_11.png

basic_av : Basic 게시판을 조금 수정했습니다.
리스트에 썸네일을 출력했습니다. 그로 인해 좁아진 공간 때문에 일부 항목을 배제했습니다.
list.skin.php 파일 상단의 규정과 게시판 설정의 썸네일 크기가 일치되게 설정합니다. Webzine 게시판(webzine_av)도 마찬가지...
(이미지 첨부시에 영향 받음)


1889776576_htdkIvEN_2015.05.29_12.png

gallery_av : Gallery 게시판입니다.


1889776576_HDc0OXTr_2015.05.29_13.png

이렇게 설정했습니다.
수정이 필요하면 게시판 설정에서 썸네일 크기를 임의로 변경하고, 변경한 px에서 각각 '-3'으로 계산한 px을
list.skin.php의 상단

$thumb_width=142;
$thumb_height=95;

에 입력해줍니다.

왜 그런지는 묻지도 따지지도 마세요. 원조 초보니...;;;



1889776576_2dhTAHrs_2015.05.29_14.png

'여분필드 1'과 '여분필드 2'을 사용합니다.

'여분필드 1'에 동영상 소스를 입력합니다.
유투브만 사용할 것 같으면... 간편히 주소만 입력하면 되는 방식으로 바꾸는 편이 낫겠으나
Vimeo비디오, 오디오 등의 형식도 가능케 하기 위해... 직접 (html 소스) 입력 방식을 사용했습니다.

(여러 형식을 지원하기 위해 여분필드들을 주저리 주저리 늘어놓는 방식은 좀...)

 


'여분필드 2'에 유투브 동영상 ID를 넣어주면 자동으로 최신글에 썸네일로 출력됩니다.

https://www.youtube.com/watch?v=oJLKO_6d5xw

'=' 뒷부분이 유투브 ID입니다.

'소스코드'에서 보면...

https://www.youtube.com/embed/oJLKO_6d5xw?rel=0


유투브 ID 대신 이미지를 아래의 '첨부파일'로 등록해도 됩니다.

 

 

<video width="400" controls><source src="https://media.giphy.com/media/AFO0Uo7G0P2Fy/giphy.mp4" type="video/mp4">Your browser does not support HTML5 video.</video>

비디오라면 이렇게...

 

<audio controls><source src="http://internationale.kr/data/mybox1/peace-intro.mp3" type="audio/mpeg">Your browser does not support the audio tag.</audio>
오디오라면...

 


102cf480cb7b8954a4829a791536f6d2_1505395338_8475.png

webzine_av : Webzine 게시판입니다.



1889776576_aTS9Zbz4_2015.05.29_15.png

모바일 스킨도 내용은 위와 거의 비슷합니다.
모바일의 좁은 화면을 고려하여 Basic에는 썸네일을 출력하지 않았습니다.



1889776576_IKGWwzpv_2015.05.29_16.png

Gallery 최신글입니다.

'container' 너비를 변경하셨다면... 당연히 그에 맞게 손봐줘야 합니다.
살살 다뤄주세요!


잘못된 곳 지적 부탁드립니다.

추천
5

댓글 전체

그누보드 5.0.42버젼으로 만든 웹페이지인데요
모바일 부분에서 동영상 처리 진행이 어려워서...

스킨을 찾다가 적용해보려는데....


혹시 5.0.42에서는 안되나요?
본문에 링크한 테마 이전 버전을 사용하면 됩니다.
2015. 6. 3에 마지막으로 올렸으니, '5.0.35'를 기준으로 했을 것입니다.
보드 스킨은 수정되는 경우가 많지 않습니다만, '5.0.36'에서 수정된 내용이 있네요.
해당 부분 수정해서 사용하시기 바랍니다.
번거롭게 문의드려서 죄송합니다.

테마버젼이나 기존 버젼 모두
/js/jquery.mobile.resize.js  js 폴더에 카피를 한 상태구요


첫번째 여분필드에서 사용하는 Audio/Video

<iframe width="640" height="360" src="http://play......eie" frameborder="0" allowfullscreen></iframe>
정상적으로 플레이됩니다.

두번째 여분필드에서 사용하는 Youtube ID

유튜브의 아이디 정보를 입력하면, 썸네일은 정상적으로 나타내는데요,
유튜브는 동영상 플레이가 되지 않네요..

유튜브의 소스 중 간단한 url 정보 말고,
소스코드복사를 하여  첫번째 Audio/Video에 입력하면 정상적으로 출력
<iframe width="854" height="480" src="https://www.youtube.com/embed/aDvTnd71QiM" frameborder="0" allowfullscreen></iframe>

물론 썸네일은 자동추출은 안됩니다.


두번째 필드의 ID값 입력만으로 유튜브 영상 플레이가 정상적으로 되게 하려면,
추가로 어떤 부분을 봐야 하는지? 문의드립니다.
첫번째 여분필드에는... '소스코드'를 넣어주어야 합니다.
두번째 여분필드는... '재생 여부'와는 전혀 상관이 없습니다. 썸네일 출력을 위해 필요할 뿐입니다.
완전 초보입니다. 게시판중에 한가지 게시판을 위에 첫번째 이미지와 같은 방식으로 변경하고싶은데.. 혹시 어떻게 해야하는지 자세히 설명좀 부탁드려도 될까요?...
따로 손 댈 곳은 없습니다.

'basic_av' 폴더를
'theme/사용 테마/skin/board/'에 넣고
'관리자 모드'의 해당 게시판 설정에서 스킨을 '(테마) basic_av'로 바꿔주기만 하면 됩니다.
전체 2,431 |RSS
그누보드5 스킨 내용 검색

회원로그인

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