내 블로그(또는 사이트에) 유튜브 영상 게시(공유)하기 + 옵션!

유튜브 영상을 내 블로그 또는 내 사이트에 가져와 재생하는 방법.

 

1. 유튜브 영상이 있는 유튜브 사이트로 이동합니다. 해당 유튜브 영상 페이지로 이동하면 하단에 공유라는 버튼이 있습니다. 공유 버튼을 클릭합니다.

 

 

 

2. 공유 버튼을 클릭하면 또 바로 하단에 공유와 관련된 기능이 표시됩니다. 여기서 해당 유튜브의 영상 자체를 내 블로그 또는 사이트에 재생하게 하기 위해 [소스 코드]를 선택합니다.

[공유] 는 단순히 유튜브의 영상이 있는 링크를 공유하는 것입니다.

 

 

 

3. iframe으로 된 HTML 소스 코드가 보이는데, 이 코드를 블로그 게시물 또는 사이트에 복사하여 붙여주면 됩니다.

 

* 해당 동영상과 연결된 다른 동영상을 제외하고, 선택한 동영상 하나만 공유할 때에는 위의 체크박스[다음 동영상으로 시작하는 재생목록과 함께 공유]를 해제합니다.

 

 (아래는 설명을 위한 유튜브 영상 공유 샘플 소스 코드입니다. 다른 영상은 src="블라블라" 부분이 다르겠죠?^^)

 

<iframe width="560" height="315" src="//www.youtube.com/embed/sakN5d7ba-A" frameborder="0" allowfullscreen></iframe>

 

 

 

공유 시, 추가 팁!

 

소스에 몇가지 수정을 하여 동영상 재생과 관련된 옵션을 변경할 수 있습니다.

 

* 태그 요소 변경

 

width : 공유 시 ,동영상의 너비(가로길이)를 지정합니다.

height : 공유 시, 동영상의 높비(세로길이)를 지정합니다.

allowfullscreen : 전체화면을 볼 수 있는 옵션을 포함합니다.

 

 

* src 요소의 파라메터 값 변경

 

&rel=0 : 재생 완료 후, 표시되는 추천 동영상을 표시하지 않습니다.

&autoplay=1 : 해당 영상을 자동 재생 시킵니다.

&loop=1 : 재생을 반복합니다.

&autohide=1 : 화면에 표시되는 메뉴바를 숨깁니다.

&start=30 : 동영상을 처음부터 재생하지 않고, 특정 초 부터 시작합니다. (30은 30초 지점부터 재생)

 

위의 값은 다음과 같이 적용할 수 있습니다. (첫번째 파라메터는 ? 뒤에, 두번째 파라메터는 & 로 연결)

<iframe width="560" height="315"

src="//www.youtube.com/embed/sakN5d7ba-A?autoplay=1&autohide=1&rel=0" frameborder="0" allowfullscreen></iframe>