유투브(Youtube) 동영상 자동 재생 및 특정 위치 재생 만들기, 메뉴바 숨기기

IT 바라보기/Website


              [공지]연극 [스캔들] 초대이벤트! 진행中! (~5/29 까지)
              [공지]연극 [시간을 파는 상점] 초대이벤트! 진행中! (~6/4 까지)



안녕하세요. 하늘다래입니다.
여러 사이트들을 돌아다니다보면 게시물 제목에 <자동재생> 이라고 표기되어 게시물을 열면 동영상이 자동으로 재생되는 것을 많이보셨을 것이라 생각합니다. 이 방법은 HTML 태그를 어느정도 아시는 분이면 매우 간단한 방법인데 오늘 팁은 초보자용이라고 생각하시면서 읽으시면 되겠습니다. 
덤으로 <자동재생> 뿐만 아니라 <특정위치재생>, <메뉴바 숨기기> 까지 배워보죠. ^^

 
  자동재생 만들기

0. 유투브에 접속합니다.
1. 원하는 동영상을 찾아서 <공유> 버튼을 선택합니다.
2. 아래 <소스코드> 버튼을 선택합니다.
3. 소스코드 아래 옵션 값 중 <이전 소스 코드 사용> 을 체크합니다.
4. 화면 크기를 선택 또는 입력합니다.


<소스 코드> 버튼을 선택하면 기본적으로 iframe 소스코드가 생성이 되는데 iframe 은 악의적인 사용이 가능한 경우가 많아 우리나라 사이트들에선 막아둔 곳이 많죠. ^^ 그래서 <이전 소스 코드 사용> 을 선택해 object 소스코드를 생성합니다.

5. 생성된 소스코드를 모두 선택하여 메모장 같은 곳에 복사하여 필요한 부분만 빼고 삭제하겠습니다. 우리는 <embed> 소스만 필요합니다. ^^ 아래 소스에서 붉은색으로 칠해진 곳이죠. 

<object width="735" height="404"><param name="movie" value="https://www.youtube.com/v/X6XXia5B2Wg?version=3&amp;hl=ko_KR&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="https://www.youtube.com/v/X6XXia5B2Wg?version=3&amp;hl=ko_KR&amp;rel=0" type="application/x-shockwave-flash" width="735" height="404" allowscriptaccess="always" allowfullscreen="true"></embed></object> 

6. 복사한 <embed> 소스코드 중 src=" " 부분에 &autoplay=1 를 넣어주면 자동재생 소스가 됩니다.

<embed src="https://www.youtube.com/v/X6XXia5B2Wg?version=3&amp;hl=ko_KR&amp;rel=0&autoplay=1" type="application/x-shockwave-flash" width="735" height="404" allowscriptaccess="always" allowfullscreen="true"></embed>

간단하죠? ^^ 아래는 원본 동영상과 자동재생 적용된 동영상입니다. 폴딩 된 부분 누르세요. ^^

<원본 동영상>


자동재생 동영상 열기



 
  특정 위치 재생 만들기

동영상 길이가 길거나 보여주고자 하는 부분부터 시작하고 싶은 경우 <자동재생> 과 동일한 방법으로 &start=재생위치(초로 환산한 재생시간) 로 사용하면 됩니다.

<embed src="https://www.youtube.com/v/X6XXia5B2Wg?version=3&amp;hl=ko_KR&amp;rel=0&start=67" type="application/x-shockwave-flash" width="735" height="404" allowscriptaccess="always" allowfullscreen="true"></embed>

적용된 동영상은 아래 폴딩을 누르시면 확인 가능합니다. ^^

재생위치 적용 확인


 
  메뉴바 숨기기

보통 <자동재생>의 경우 메뉴바 숨기기까지 적용해서 많이들 사용합니다. 마찬가지로 &autohide=1 를 소스에 추가해줍니다.

<embed src="https://www.youtube.com/v/X6XXia5B2Wg?version=3&amp;hl=ko_KR&amp;rel=0&autohide=1" type="application/x-shockwave-flash" width="735" height="404" allowscriptaccess="always" allowfullscreen="true"></embed>

적용된 동영상은 아래 폴딩을 누르시면 확인 가능합니다. ^^

메뉴 숨기기 적용 확인



 
  자동재생 + 특정위치재생 + 메뉴바숨기기

위 소개한 방법은 중복 적용 가능합니다. 아래와 같이 사용하면 됩니다.

<embed src="https://www.youtube.com/v/X6XXia5B2Wg?version=3&amp;hl=ko_KR&amp;rel=0&autoplay=1&start=67&autohide=1" type="application/x-shockwave-flash" width="735" height="404" allowscriptaccess="always" allowfullscreen="true"></embed>

적용된 동영상은 아래 폴딩을 누르시면 확인 가능합니다. ^^

자동재생+특정위치재생+메뉴바숨기기



유투브 동영상 컨트롤 중 자주 사용하는 태그에 대해서 소개해봤습니다.
다음번에는 다음팟이나 비메오 같은 다른 UCC 사이트에서도 사용 가능한 방법에 대해서 소개해 보겠습니다.
방법은 비슷하니 응용해보셔도 되겠네요. ^^


Name
Password
Homepage
Secret
튼튼이 아빠 2011.09.16 10:03 신고 URL EDIT REPLY
유투브에 옵션이 이렇게 많은줄몰랐어요.
좋은 정보 감사합니다 :)
하늘다래 | 2011.09.16 11:41 신고 URL EDIT
유투브 기능이라기 보다
HTML 태그만 알고 있으면 응용 할 수 있는 부분이예요^^
하늘엔별 2011.09.16 13:17 신고 URL EDIT REPLY
이런 좋은 팁이 있었군요.
잘 배우고 갑니당~~~
하늘다래 | 2011.09.16 16:49 신고 URL EDIT
하늘엔별님이시다^^
도움이 되는 팁이면 좋겠네요^^
튼튼이 아빠 2011.09.16 17:49 신고 URL EDIT REPLY
오 맞아 HTML 기능 !!
제 지식이 좀 짧고 얕아요 ㅎㅎ
많이 배워갈게요 !!
하늘다래 | 2011.09.16 18:50 신고 URL EDIT
예전 같으면 제가 아는 지식 많이많이 퍼드릴께요! 라고 외치겠지만
요샌 바빠서 블로깅을 잘 못하니 ㅠ_ㅠ
속상해요 ㅎㅎ;;
비톤 2011.09.16 22:07 신고 URL EDIT REPLY
이런좋은기능이 있었다니~~
좋은팁 감사합니다..
하늘다래 | 2011.09.16 23:37 신고 URL EDIT
네^^
잘 사용하시길 바래요^^
파워뽐뿌걸 2011.09.23 08:38 신고 URL EDIT REPLY
이거 좋네요. 포스팅할때 참조할게요!
하늘다래 | 2011.09.23 11:10 신고 URL EDIT
동영상 넣어서 포스팅 할때
유용 할 것 같아서 썼다죠^^
2011.09.27 19:23 신고 URL EDIT REPLY
알기쉬웠습니다^^
하늘다래 | 2011.11.20 23:12 신고 URL EDIT
다행입니다^^
2011.11.20 20:41 URL EDIT REPLY
비밀댓글입니다
하늘다래 | 2011.11.20 23:13 신고 URL EDIT
네~
비공개로 퍼가는건 상관 없구요~
공개 하시려면 글 처음이나 마지막에
출처만 살짝 넣어주세요^^
小山소산 2011.12.16 13:47 신고 URL EDIT REPLY
잘 보고 갑니다.
小山소산 2011.12.16 13:48 신고 URL EDIT REPLY
좋은 정보 감사합니다.
한번 해봐야 겠네요.
즐거운주말 되세요..
이별비까끙_ 2011.12.27 18:58 신고 URL EDIT REPLY
정말 감사합니다 ㅇㅅㅇ!! 자동재생 배우고싶었는데, 정말 유용한정보 알아가네요 .
qq 2011.12.28 10:56 신고 URL EDIT REPLY
정말 좋은 기능이네요..

감사합니다..
2012.02.06 20:00 URL EDIT REPLY
비밀댓글입니다
Washing Machine 2012.03.24 11:48 신고 URL EDIT REPLY
최근 들어서 불여시 잘 안 썼는데 말이죠.
크롬을 주로 사용했는데, 오랫만에 한 번 써봐야 겠네요. ^^
렐레통통 2012.07.21 01:00 신고 URL EDIT REPLY
유용한 정보 감사히 잘 쓸게요! 도움이 됐어요^^
이상 2012.10.30 02:14 신고 URL EDIT REPLY
특정 재생시간 만드는 법에 대해 찾다가 들렸어요!
누구나 쉽게 알 수있도록 잘 설명해주셨네요
감사해요~ 잘 배우고 갑니다
SWF 2013.03.05 10:09 신고 URL EDIT REPLY
동영상 재생시키다가 특정위치에서 일시정지 하는 방법은?