본문 바로가기

알짜배기

티스토리 동영상(JWplayer) 플레이 리스트 (17.09.13) 2#[동영상 연속재생]

저번시간에 jwplaye 티스토리에 어떻게 적용하는지에

대해서 설명하였습니다.


많은 분들에게 도움이 되셨을지는 모르겠네요.


이번시간에는 jwplaye 티스토리에 동영상을 여러개를 기재하는 방법에

대해서 설명토록 하겠습니다.


동영상을 여러개 넣는방법은 간단합니다.

jwplaye 플레이 리스트를 작성하면되는데요.


소스 코드는 간단합니다.

하지만, 플레이 리스트는 최대 4까지만 가능합니다.


소스 코드는 아래와 같습니다.


<div id="player1"></div> 

<script type="text/javascript"> 

jwplayer('player1').setup({ 

playlist:[{ title:'슈퍼그랑죠 8화', sources:[{file:'https://www.youtube.com/watch?v=u371mevXtA0'}], image:'', description:'마법사 이막' },

{ title:'슈퍼그랑죠 9화', sources:[{file:'https://www.youtube.com/watch?v=-R40jg4JTeo'}], image:'', description:'마왕 제국' },

{ title:'슈퍼그랑죠 10화', sources:[{file:'https://www.youtube.com/watch?v=AsAZhMF0USk'}], image:'', description:'숲의 비밀' },

{ title:'슈퍼그랑죠 11화', sources:[{file:'https://www.youtube.com/watch?v=X4A8mD18t2Q'}], image:'', description:'용기의 돌' }], width: "100%", aspectratio: "16:9" }); </script>


설명토록 하겠습니다.

이 코드는 [플레이어1]이라 선언합니다.

<div id="player1"></div>

※ 중복 송출할 경우 player2 선언합니다.


플레이 타이틀은 [슈퍼그랑죠8화]이며,

title:'슈퍼그랑죠 8화'


불러올 영상 url=**** 입니다.

file:'https://www.youtube.com/watch?v=u371mevXtA0'

ex) 유투브로 불러왔습니다.


그리고 부제목은 [마왕이막]달아줍니다.

description:'마왕 제국'


출력은 하단과 같이 보여지실겁니다.