고정 BGM 이란, 현재 게시글처럼 BGM이 스크롤을 따라서 움직이는것을 뜻합니다.

주로 스크롤압박이 심한 긴 게시글에 쓰면 됩니다.

스크립트:

<embed src="BGM 주소" style="position:fixed; right:0%; bottom:0%;">

스타일태그 구조 설명

position:fixed

태그의 위치를 설정, fixed(고정) 으로 되어있습니다.

right:0%

오른쪽 여백을 설정, 0%로 설정되어있습니다.

bottom:0%

아래쪽 여백을 설정, 0%로 설정되어있습니다.

왼쪽에 붙이고 싶다면

right:0% 대신, left:0% 를 붙이면 되겠죠?

그리고 위에 붙이고 싶다면

bottom:0% 대신, top:0% 를 붙이면 됩니다.

아까는 괜히 div 태그 만지는 바람에 잘못되어버렸네요.

이렇게 간단히 축약할 수 있는데 괜히;

by sprite

유튜브에 대해서 이름만 알고 자세한걸 많이 모르시는분들을 위해 정리합니다.

이 글은 굳이 읽을 필요는 없으며, 알아두면 기능상 편리합니다. 하지만 유튜브로 브금 업로드 하실 분들은 이 페이지는 반드시 읽어주세요.

1. 유투브? 유튜브?

많은 분이 헷갈리는 이름 표기이지만, 유튜브가 맞습니다. 유투브라고 주장하는 사람들, 그럼 수영장이나 해수욕장 갈때 끼고가는게 튜브가 아니라 투브라고 하는건가요?

2. 유튜브는 업로드 용량이 무제한이다?

아닙니다. 정확히말해서 한정적이라고 할 수 있죠. 하지만 어지간한 동영상은 다 올라갑니다. 그 한계가 어디까지냐고요? 2시간입니다.

2시간 넘는거 올라가는데?라고 물으시는 분들 계실겁니다. 근데 그거 제대로 올라가던가요? 아닙니다.

유튜브에서 2시간이 넘는 동영상을 올리기 위해서는 규정을 잘 지키고 동영상을 많이 올려야만 받는 '디렉터' 권한이 있어야 2시간이 넘는 동영상의 등록이 가능합니다.

근데 웃기는건 2시간짜리 넘는 동영상이 디렉터가 아니라도 업로드는 됩니다. 그래서 기껏 업로드 전부 기다렸는데 디렉터 권한 없다고 그냥 짤라버리죠.

3. 유튜브 기능 추가법 기본

유튜브의 기능에 대해서 설명하기 위해서 먼저 알아야할 것은 간단한 HTML에 대한 지식입니다. 이건 핱브인들이라면 embed를 쓰기때문에 익숙할겁니다만, 좀 형식이 다릅니다.

유튜브 주소를 한번 보죠.

보통 유튜브에서 공유를 누르면 아래와 같이 뜰겁니다. 유튜브코드라고 된 부분은 동영상 고유 코드를 말하는겁니다.

http://youtu.be/유튜브코드

절대로 이걸 브금주소창에 붙여넣지 마시고 링크 이외의 용도로 사용하지 마세요. 왜냐면 이건 정확한 주소가 아니라 리다이렉트가 걸린 주소라서 이걸 가지고 아무리 용을 써봤자 embed도 걸리지 않습니다. 올바른 유튜브 주소 형식은

http://www.youtube.com/watch?v=유튜브코드

혹은

http://www.youtube.com/embed/유튜브코드

입니다.

이중에서 사용하기 편한건 아래에 있는 http://www.youtube.com/embed/유튜브코드 입니다. 브금주소창에는 위에걸 넣어도 상관없습니다. 이제 이걸 가지고 한번 해보도록 하겠습니다.

1) 옵션 설정은 뒤에 ?를 붙여서 시작한다.

기본입니다. 주소창에 보통 보이는 ?는 뒤에 추가로 뭔가를 더 붙일거라는 일종의 명령어입니다. 이건 다른 사이트에서도 통용되는 말이니 익혀두면 참 좋습니다. 하지만 이걸 계속 사용하지는 않습니다. 반드시 이 표시는 한번만 써주세요.

2) 옵션 추가는 &로 추가한다.

시작은 ?로 하되, 여러개를 붙이고싶다면 뒤에다가 &를 붙여서 더 넣을 수 있습니다. 그러니까

http://주소창?옵션1&옵션2&옵션3...

이런식으로 간다는거죠.

기본은 이게 끝입니다. 다음은 이 옵션들에 대해서 알아보도록 하죠.

4. 유튜브 기능 옵션

위에 보이는 저 옵션들에다가 이제 넣을 명령어를 알아보겠습니다. 이건 외워두면 편해요.

1) 반복재생

loop=1

말 그대로 반복재생입니다. 1을 0으로 바꾸면 반복이 되지 않습니다. (* 추가: version=3, 그러니까 현재 버전에선 반복재생이 되지 않습니다. version=2나 1과 함께 써주세요.)

2) 자동재생

autoplay=1

마찬가지로 자동재생 코드입니다. 역시 0으로 바꾸면 자동재생이 안됩니다.

3) 버전 바꾸기

version=숫자

유튜브 동영상 버전을 바꾸는겁니다. 브금을 사용할거라면 숫자에 2를 넣는걸 추천하고, 작성일 기준으로 현재 버전은 3입니다. version=1은 제가 사용하지 않았으므로 앞으로 version=1에 대해서는 따로 언급하지 않겠습니다.

3-1) 재생바 숨기기

autohide=1

version=3에선 자동으로 숨겨지니 이건 version=2 한정입니다. 플짤에 유용하게 사용할 수 있습니다.

3-2) 제목 숨기기

showinfo=0

플짤 만들기 2단계

3-3) 컨트롤바 조종 못하게하기

controls=0

플짤 만들기 3단계. 이건 version=3에서만 사용가능합니다.

4) 재생바 색 바꾸기

color1=XXXXXXXX&color2=XXXXXXXX

version=2에서 재생바 색을 바꿀 수 있습니다. 저 뒤에 있는 8자리에 16진법으로 써주시면됩니다.

4-1) 깔끔한 회색

color1=99999999&color2=99999999

4-2) 뭔가 간지나는 까만색

color1=00000000&color2=00000000

4-3) 배경 완전히 흰색

color1=FFFFFFFF&color2=FFFFFFFF

5) 재생바 색 바꾸기2

theme=light

version=3에서도 됩니다. 하지만 이거 말고 다른 색을 찾을 수는 없네요.

6) 추천 동영상 표시안하기

rel=0

7) wmode

wmode 호환성 조절 옵션

wmode="transparent"

wmode="window"

wmode="opaque"

뭔지 모르겠는데 제보들어오니 일단 적어봅니다.

8) HD로 보기

vq=hdXXXX

저 XXXX부분에 숫자를 넣어주면됩니다. 일종의 화질 조정인데 주요 숫자로는 480, 720, 1080등을 넣어주면됩니다.

제보해주신 olleh님 감사합니다.

이 글은 더 추가될 수 있습니다.

by데반

바쁜 사람들을 위한 요약:

1. 유튜브 업로드를 한다.

2. 동영상 주소창에 있는 코드를 본다. (예. http://www.youtube.com/watch?v=9bZkp7q19f0에서 9bZkp7q19f0 부분.)

3. <embed src="http://www.youtube.com/v/유튜브코드?version=2&amp;hl=ko_KR&autoplay=1&loop=1&amp;rel=0" type="application/x-shockwave-flash" width="300" height="25" allowscriptaccess="always" allowfullscreen="true"></embed>

유튜브코드라고 적힌 부분에다가 2번 코드를 복사해넣는다.

4. HTML 에디터에 통채로 복사+붙여넣기.

5. 완료.

유튜브 브금 플레이어 만들기

유튜브로 전환하게 된 이상 이제 이 유튜브를 브금형식으로 한번 만들어봅시다.

어차피 여긴 브금저장소이고, 재생바만 떡하니 나와있고 자동+반복재생만 되면 그냥 유튜브 쓰는게 낫습니다.

자 그럼 한번 해볼까요?

예시로 싸이의 강남스타일을 해보겠습니다.

*주의 강남스타일은 예시입니다. 국내 음원은 그냥 공식 동영상을 그대로 퍼와주세요.

http://www.youtube.com/watch?v=9bZkp7q19f0

들어가면 아래와 같은 페이지가 보일겁니다.

딱히 뭐 원곡인증따위 안해도 되겠죠?

뭔가 수상한 다운로드 버튼이 있지만 상관없어! 공유를 눌러줍시다.

URL 주소가 보일건데, http://youtu.be/ 부분을 http://www.youtube.com/watch?v=로 바꿔서 BGM주소 부분에다가 붙여넣기 해두세요.

뭔지몰라도 형식은 저렇게 하라네요.

이제 소스 코드를 눌러주세요.

동영상 채로 퍼올려면 그냥 저걸 복사해서 HTML 소스에다가 집어넣으면 되지만, 제가 원하는건 모양바꾸기+자동재생+반복재생이니 저거가지곤 성에도 안찹니다.

이전 소스 코드 사용에 체크를 해주세요.

소스가 확 바뀌었죠? 저걸 복사해서 HTML 편집기에다가 붙여넣기합니다.

이렇게요. 복잡하지만 embed 빼곤 다 필요없습니다. <embed> </embed>라고 된 부분 빼고는 앞뒤로 날려주세요.

그럼 아래처럼 되겠죠?

이제 저걸 수정합니다. 아래 3단계를 그대로 따라해주세요.

1.src=""이라고 된 부분에다가 적혀있는 주소가 보이시죠?

version=3을 version=2로 바꿔주세요. 유튜브 재생 버전을 바꾸는겁니다.

2.그리고 ko_KR&이라고 된 부분 뒤에 autoplay=1&loop=1& 을 넣어주세요.

자동재생부분이 autoplay=1 이고 반복재생이 loop=1입니다. 빼고싶으면 빼셔도 됩니다.

3.width="" height="" 여기 숫자를 각각 300, 25로 바꿔주세요.

동영상 크기를 변환할때도 저 숫자만 바꿔주면 바꿔집니다.

그럼 아래와 같은 소스 코드가 됩니다.

<embed src="http://www.youtube.com/v/9bZkp7q19f0?version=2&hl=ko_KR&autoplay=1&loop=1&rel=0" type="application/x-shockwave-flash" width="300" height="25" allowscriptaccess="always" allowfullscreen="true"></embed>

아예 이걸 갖다가 9bZkp7q19f0이라고 된 부분만 동영상 코드로 바꿔줘도 됩니다.

이제 HTML모드가 아니라 에디터 모드로 가봅시다.

훌륭한 브금 플레이어가 됩니다.

아래는 크기만 바꾼 동영상 예시입니다. 예시를 잘못 들었네요;;