동영상 게시판에서 비매오, 유투브 ID로만 동영상을 재생하려고 합니다.
이틀전까지만 해도 재생이 잘 되었는데,
사파리를 제외한 크롬, 익스플로러에서는 지금 블랙화면으로 뜹니다. 썸네일은 정상적으로 뜹니다.
http://www.olivechurch.or.kr/%EC%98%AC%EB%A6%AC%EB%B8%8C%EB%B0%A9%EC%86%A1/%EB%8B%B4%EC%9E%84%EB%AA%A9%EC%82%AC-%EC%84%A4%EA%B5%90
어떻게 해결해야 하나요?
사이트 확인해봤습니다.
동영상이 안뜨는게 아니라 스타일 변경으로 동영상 크기가 0이 되어서 보이지 않고 있습니다.
스킨의 style.css 파일을 수정하셨나봅니다.
http://www.olivechurch.or.kr/wp-content/plugins/kboard/skin/play-video/style.css
.kboard-play-video-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; background-color: black; }
.kboard-play-video-container video,
.kboard-play-video-container iframe,
.kboard-play-video-container object,
.kboard-play-video-container embed { position: relative; padding-bottom; 56.25%; top: 0; left: 0; margin: 0; padding: 0; width: 100%; height: 100%; border: 0; }
위 코드를 찾아서 아래 처럼 다시 변경해주세요.
.kboard-play-video-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; background-color: black; }
.kboard-play-video-container video,
.kboard-play-video-container iframe,
.kboard-play-video-container object,
.kboard-play-video-container embed { position: absolute; top: 0; left: 0; margin: 0; padding: 0; width: 100%; height: 100%; border: 0; }
감사합니다! iframe 전체 높이가 안보이는것 때문에 제가 모르고 수정했었어요;;;;;
iframe 허용 도메인을 //content.jwplatform.com 를 추가했습니다.
그리고, div 포함하여 embed 소스 모두 글내용에 넣었습니다.
<div style="position:relative; padding-bottom:56.25%; overflow:hidden;"><iframe src="//content.jwplatform.com/players/egmocdrS-fDtwq33d.html" width="100%" height="100%" frameborder="0" scrolling="auto" allowfullscreen style="position:absolute;"></iframe></div>
모바일에서는 쇼셜 아이콘과 공백이 있지만, 웹에서는 iframe의 화면도 다 나오지 않고 공백도 있습니다.
이거 높이를 실제값으로 주라고 전화상에서는 그렇게 말씀하셨는데, 실제 값으로 주면 grey 로 공백이 또 보여집니다.
http://www.olivechurch.or.kr/%EC%98%AC%EB%A6%AC%EB%B8%8C%EB%B0%A9%EC%86%A1/%EC%84%B1%EA%B0%80%EB%8C%80?mod=document&uid=298
좋은 방법 있을까요?
content.jwplatform.com
이걸 추가해주세요.
추가하신 // 이건 호스트 도메인과 관련이 없는 문자로 입력하시면 인식하지 않습니다.
그리고 아래처럼 해보시겠어요?
<iframe src="http://content.jwplatform.com/players/egmocdrS-fDtwq33d.html" width="100%" height="100%" frameborder="0" scrolling="auto" allowfullscreen style="position:absolute;">
또는
<iframe src="https://content.jwplatform.com/players/egmocdrS-fDtwq33d.html" width="100%" height="100%" frameborder="0" scrolling="auto" allowfullscreen style="position:absolute;">
높이는 실제값을 입력해주시거나,
반응형으로 적용하기 위해서는 어쩌면 당연하지만 CSS 또는 스크립트로 비교적 난이도 있는 작업을 하셔야 합니다.