유튜브 영상 티스토리에서 자동 재생 하는 법

유튜브 영상을 티스토리에서 자동 재생 하는 법

유튜브 영상을 티 스토리에서 자동 재생 하는 법에 대해서 한번 알아보겠습니다.  코드의 출처는 https://sunstar2.tistory.com/2414 입니다.

 

우선 글쓰기 모드를 기본 모드에서 HTML로 선택하여 변경합니다.

기본모드에서 HTML로 변경

 

다음의 스크립트를 여기 링크에서 복사하여 붙여 넣기 합니다. 

<div class="tt_article_useless_p_margin contents_style"><div id="player">&nbsp;</div>
<p data-ke-size="size16">
<script src="https://www.youtube.com/iframe_api"></script>
</p>
<p data-ke-size="size16">
<script>
  var player;
  function onYouTubeIframeAPIReady(){
    player = new YT.Player('player',{
     videoId:'유튜브 동영상 고유 번호',
      playerVars:{'autoplay':1,'playsinline':1, 'loop':1, 'playlist':'유튜브 동영상 고유 번호'},
      events:{ 'onReady':onPlayerReady }
    });
  }
  function onPlayerReady(e){	
    e.target.mute();
    e.target.playVideo();
    setTimeout(function(){e.target.unMute()},100);
  }
</script>
</p>

 

‘유튜브 동영상 고유 번호’라고 적혀 있는 두 군데에 적용하고자 하는 유튜브 영상의 고유번호만 입력하시고 완료를 누르시면 됩니다.

유튜브 동영상 고유 번호에 관련된 영상의 고유번호를 입렵합니다. 두군데를 고치셔야 합니다. 이 예시 에서 유튜브 영상 고유번호는 pCpvBvUDTLc 입니다.

유튜브 영상 고유 번호 찾기

유튜브 영상 고유 번호 (유튜브 영상 고유 ID)는 재생하고자 하는 영상의 주소를 보시면“watch? v=“다음에 나오는 것이 고유 번호 입니다. 또한 Share (공유) 버튼을 누르시면 간단하게 축약된 주소가 나오는데 잘 보시면 메인 주소에 나와 있는 유튜브 영상 고유 번호와 일치 합니다. 이 예시 에서 유튜브 영상 고유 번호는  pCpvBvUDTLc 입니다.

유튜브영상 고유번호 (ID) 찾는법