반응형





iframe 바꿔주는 사이트가 있네요

이게 더 편하고 각 옵션들은 아래에 참고해서 쓰시면 될듯 합니다.

http://nuridol.net/ut_convert.html


유튜브는 세계최고의 동영상 저장소라고 볼 수 있다.


게다가 요즘은 엔터테인먼트 회사나 공중파도 유튜브 계정을 만들어 영상을 올리고 있어서 웬만한 영상들은 찾아서 볼 수 있다. 

특히 나는 공중파의 가요프로그램 영상을 볼 수 있다는게 좋았다. 옛날 추억의 노래와 그 무대를 볼 수 있어서다.

화질도 깨끗해서 이 영상을 좀 더 많은 사람들과 나누고파 퍼오려고 하는데 화면도 작게 나오고 화질도 나쁘게 나왔다.


그래서 검색해서 화면도 크고 깨끗하게 퍼오는 법을 알아보았다.





언젠가부터 많은 사람들이 오가는 커뮤니티나 사이트에서는 iframe 태그를 막아 놓았다. 

사람들이 막 다른 나쁜 사이트 링크를 걸어 놓거나 악용하는 소지가 많기 때문이라고 한다.

다음 카페도 iframe으로 퍼가면 화면에 나타나지 않고 

싸이월드 블로그는 아예 html 모드를 없애버렸다.

그래서 싸이 블로그에서는 외부컨텐츠 모드를 이용해서 주소입력을 해서 퍼오기만 가능하다.

(티스토리도 글쓰기에 외부컨텐츠 기능이 있다. 근데 영상이 나오지 않는다. 뭐지..)




싸이 블로그 글쓰기 화면

외부컨텐츠를 누르면 다음과 같이 주소입력하는 창이 뜬다.





저 부분에 유튜브에 공유 탭을 누르면 나오는 주소를 넣으면 된다.


아니면 주소 바로 위에 각 SNS 아이콘이 있는데 이걸로 공유하기를 해도 된다.




하지만 이걸로 공유하게 되면

아래 사진 처럼 이렇게 영상이 작게 공유 된다.




그래서 좀 더 크고 좋은 화질로 공유하려고 하면 이전코드소스를 사용해서 퍼오는게 좋다.

공유->소스코드 탭을 누르면 iframe 소스코드로 되어있다.


여기서 이전소스코드사용을 체크해주면 소스코드가 바뀌게 된다.



사이즈 크기도 선택할 수 있다.


저 소스를 복사해서 글쓰기를 할 때 html 모드에서 붙여넣기 하면된다. 

하지만 화질은 기본화질로 재생된다.




영상사이즈에 맞게 고화질로 재생시켜주기 위해서는 소스코드에 추가로 옵션을 주어야 한다.

만약 HD 720p 로 재생하고 싶다면

&vq=hd720

HD 1080p 로 재생하고 싶다면

&vq=hd1080

을 추가해주면 된다.

(※ &는 여러 옵션을 추가해주기 위한 구분자이다)


위 영상의 소스코드에 추가한다면


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


이런 식으로 embed 소스 줄에 version=3뒤나 &amp 앞에 추가 해주면 된다. 

(아니면 물음표 뒤에 바로 vq=hd720 이라고 추가해도 된다.)



그리고 화면 사이즈는 시청자가 전체화면 보기로 해서 보면 상관은 없지만 

그냥보는 시청자를 위해 720 화질이면 

width="1280" height="720"

1080화질이면

width="1920" height="1080"

이런식으로 바꿔주는게 좋다.



또 자동으로 재생해주고 싶다면 같은자리에

&autoplay=1 

이라고 추가해주면 된다.



그럼 고화질로 자동재생하라고 하고 싶으면

&vq=hd720&autoplay=1

을 추가해주면 된다.



그리고 또 하나

어떤 유튜브 영상은 이전소스코드를 지원하지 않는 경우가 있다. 또 위 소스를 해도 영상이 안나오면 이 방법을 써보면 해결될 것이다.

그럴 경우에는 


저 표시된 부분을 이용하면 된다.

영상마다 고유한 주소를 갖는데 저게 그 주소이다.

저 부분을 복사해서


 <embed width="640" height="360" src="http://www.youtube.com/v/고유주소&vq=hd720&autoplay=1&start=60&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true"></embed>

고유주소 부분에 붙여넣으면 iframe 영상도 재생할 수 있다.


예제


위 영상은 아래 소스이다.

<embed width="640" height="480" src="http://www.youtube.com/v/ufsrgE0BYf0?vq=hd720&autoplay=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true">


1920 1080 사이즈하면 너무 커져서 블로그 글 사이즈를 넘어가게 된다. 하지만 화질은 1080 으로 아주 좋다. 

영상바 아래에 화면설정을 보면 1080으로 설정되어있다


한 가지 팁!

&start=60

이거는 영상 시작지점을 지정하는건데 초 단위이다.

1분이면 60, 3분이면 180 이런식으로 초로 계산해서 넣어주면 된다.




반응형

+ Recent posts