작은 미디어플레이어에도 위의 그림과 같이 |
글은 다음과 같은 순서로 이어지고 있습니다.
|
2. Embed로 본문에 음악 넣기
■ 오늘 연재하는 글
2. Embed로 본문에 음악 넣기 2. 1) 미디어 플레이어 복사해서 붙이기 2. 2) Embed 태그로 음원 넣기 2. 3) Embed 태그내 각종 명령 익히기 2. 4) Style 명령으로 플레이어 색깔 바꾸기 2. 5) 특별한 나, 나만의 플레이어 색으로 꾸미기 |
아래 그림에서 보는 것처럼 미디어플레이어의
종류에는 여러가지가 있습니다.
|
종류별로 만드는 방법에 대해서
지금부터 알아보겠습니다.
3) Embed 태그내 각종 명령 익히기
되도록이면 Daum 블로그 내에서 활용 가능한 것으로
예를 들도록 합니다. 다른 곳에선 다른 기준이 있을 수 있습니다.
사실은 EMBED 태그를 아래와 같이 간단하게 작성해도
독자들에게 음악을 들려줄 수 있습니다.
〈EMBED src="음원주소"〉
태그가 매우 심플(간단^^) 하죠? ^^
이렇게 간단히 작성해도 음악을 들려 줄 수 있습니다.
그러나,
Daum 블로그에서는 길이와 높이를 꼭 정해 주는 것이 좋습니다.
그렇게 하지 않으면
Daum 블로그 프로그램이 자동으로 태그를 삽입 하는 과정에서
화면이 자리잡기까지 시간이 걸리게 되고
오류로 갑자기 창이 닫힐 수도 있습니다.
블로그 독자가 게시판을 여는데 내 뜻과는 달리
창이 닫혀 버리면 귀찮은 생각에 짜증냅니다.^^
그러므로 아래의 예가
Daum 블로그에서는 가장 쉽고 간단한 태그라고 봐야 합니다.
〈EMBED src="음원주소" width=300 height=45〉
약간의 지식을 더하여 Daum 블로그 글쓰기 프로그램이
태그를 잘못 삽입하지 않도록 아래와 같이 정확하게 적어준다면
길이와 높이를 정해 주지 않아도 간단한 면에서 좋습니다.
'이건 이런 음악이다' 하고 미리 미디어 형식(type)을 정해주는 것 입니다.
이유는 다시 설명할 기회가 있을 겁니다.
음원주소의 파일이 xxx.wma로 끝날 경우 |
〈EMBED src="음원주소.wma" type=audio/x-ms-wma〉
〈EMBED src="음원주소.asf" type=audio/x-ms-asf〉〈EMBED src="음원주소.mp3" type=application/x-mplayer2〉
위와 같은 형식으로 작성할 경우, 길이와 높이는 자동으로
width=300 height=45 크기로 보여집니다.
오류가 발생할 확률도 적어집니다.
이렇게 간단하게 작성해도 되는데
지금 우리들이 볼 수 있는 태그들은 뭐가 그리 복잡하냐?
다 이유가 있을 것 입니다.
세상 모든 것, 이유없이 만들어 진 게 없다는데. 알아볼까요?
위의 간단하게 작성한 미디어플레이어를 올렸더니...
〈EMBED src="음원주소.wma" type=audio/x-ms-wma〉
이렇게 올렸더니 말이죠.
다음과 같은 요구사항들이 있군요.
해결방법도 같이 봅니다.
1. 소리가 작아요. 좀 더 크게 안돼요?
volume="0" |
볼륨을 최대로 하라. "0"이 최대음, 최소음은 "-10000" 세밀하게 조정 가능. volume="0" 라는 명령어 자체가 없으면 중간 정도 음이고 |
〈EMBED src="음원주소.wma" type=audio/x-ms-wma
volume="0"〉
2. Play 버튼을 눌러야 음악이 나오도록 만들어 주세요.
autostart="false" |
자동으로 시작하지 못하게 함. Play를 눌러야만 노래가 나오게 하려면 "false"라 적고, 게시물을 열기만 하면 자동으로 노래가 나오게 하려면 "true"라고 적으면 되는데, "false" 대신 "0", "true" 대신 "1"을 넣어도 같은 효과 |
〈EMBED src="음원주소.wma" type=audio/x-ms-wma
강조 ^^, EMBED 태그 내에서는 항상
"false" 대신 "0", "true" 대신 "1"을 넣어도 같은 효과입니다.
3. 계속 반복해서 노래를 들려주고 싶어요.
loop="-1" |
노래 무한 반복 "-1"은 노래 끝나면 다시 계속 반복 (무한) "3"이라고 넣으면 당근, 3번. ^^ loop="-1"이라는 명령어 자체가 없으면 딱 한 번만 실행 |
〈EMBED src="음원주소.wma" type=audio/x-ms-wma
4. 스테레오의 오른쪽 소리만 더 크게 할 수 없나요?
balance="10000" |
오른쪽 스테레오 최대로 하라. balance="10000" 명령어가 없으면 좌,우 같은 음높이. -10000이면 최대 왼쪽이고 10000이면 최대 오른쪽 |
〈EMBED src="음원주소.wma" type=audio/x-ms-wma
volume="0" balance="10000"〉
이런 Embed 태그 내의 명령어들은 필요에 따라 복합적으로 사용할 수 있습니다. - 밑줄 쫘악! ^^ 예를 들면 여기 나온 명령어들을 모두 사용해도 되고 필요한 명령어만 골라 사용해도 된다는 말 입니다. 맘대로 뒤섞어 사용해도 아무 문제 없습니다.
5. 미디어 형식을 정해줘야 하나요?
type=audio/x-ms-wma type=audio/x-ms-asf type=application/x-mplayer2 |
미디어형식을 미리 정해 주는 것이 좋습니다 파일의 확장자가 .wma로 끝나면 type=audio/x-ms-wma 파일의 확장자가 .asf로 끝나면 type=audio/x-ms-asf 파일의 확장자가 .mp3로 끝나면 type=application/x-mplayer2 |
카페나 블로그, 각종 게시판의 글쓰기 프로그램도
사람이 만드는 거라 약간씩의 오류가 있을 수 있습니다.
Daum 블로그의 경우도 블로거가 제대로 작성하지 못한
태그를 자동으로 완성시켜 올려주는 기능이 있습니다만, 미디어 형식을
원래대로 구분하지 못하여 게시물을 열 때, 오류가 발생하는 경우가 종종 있습니다.
형식을 미리 정해 주면 이런 오류를 방지할 수 있습니다.
〈EMBED src="음원주소.wma" type=audio/x-ms-wma
volume="0" autostart="false" loop="-1"〉
6. 미디어 파일 정보를 보여주고 싶어요.
showstatusbar="true" |
플레이어 상태바에 파일정보와 동작상태를 보여줍니다. 명령어 자체가 없거나 "false"이면 보여주지 않게 됩니다. "true" 대신 "1"을, "false" 대신 "0"을 넣어도 같은 효과 |
〈EMBED src="음원주소.wma" type=audio/x-ms-wma
volume="0" autostart="true" loop="-1" showstatusbar="1"〉
7. 콘트롤 바가 필요 없거든요.
showcontrols="0" |
플레이어의 각종 조절기능을 없앱니다. 명령어 자체가 없거나 "true"이면 보이는 기능입니다. "true" 대신 "1"을, "false" 대신 "0"을 넣어도 같은 효과 |
volume="0" autostart="true" loop="-1" showstatusbar="1" showcontrols="0"〉
8. 소리크기 조절기능을 없앱시다.
showaudiocontrols="0" |
소리크기 조절기능을 없앱니다. 가로폭을 줄여야 할 때도 유용 합니다. 명령어 자체가 없거나 "true"이면 보이는 기능입니다. "true" 대신 "1"을, "false" 대신 "0"을 넣어도 같은 효과 |
volume="0" autostart="true" loop="-1" showaudiocontrols="0"〉
9. 한 곡만 들려 드릴 겁니다.
showpositioncontrols="0" |
곡 선택 기능(Position Control)을 없앱니다. 가로폭을 줄여야 할 때도 유용 합니다. 명령어 자체가 없거나 "true"이면 보이는 기능입니다. "true" 대신 "1"을, "false" 대신 "0"을 넣어도 같은 효과 |
volume="0" autostart="true" loop="-1" showpositioncontrols="0"〉
10. [응용] 위 9번을 이용, 가로 길이를 170px로 줄여 봅니다.
〈EMBED src="음원주소.wma" type=audio/x-ms-wma
volume="0" autostart="1" loop="-1" showpositioncontrols="0" width=170〉
11. [응용] 위 8,9번의 소리 조절 기능과 곡 선택 기능을 다 없애려면?
showaudiocontrols="0" showpositioncontrols="0" |
두 명령어 다 넣어 줍니다. 가로폭을 줄여야 할 때도 유용 합니다. 명령어 자체가 없거나 "true"이면 보이는 기능입니다. "true" 대신 "1"을, "false" 대신 "0"을 넣어도 같은 효과 |
volume="0" autostart="true" loop="-1"
showpositioncontrols="0" showaudiocontrols="0"〉
12. [응용] 가로폭 최대한 줄이기
showpositioncontrols="0" |
위 11번 항목을 응용합니다. 가로폭을 대폭 줄여야 할 때 유용 합니다. 명령어 자체가 없거나 "true"이면 보이는 기능입니다. "true" 대신 "1"을, "false" 대신 "0"을 넣어도 같은 효과 |
volume="0" autostart="0" loop="-1" width=73
showpositioncontrols="0" showaudiocontrols="0"〉
13. 트랙 바 없애기
showtracker="0" |
트랙바를 없앱니다. 세로폭을 줄여야 할 때 유용 합니다. 명령어 자체가 없거나 "true"이면 보이는 기능입니다. "true" 대신 "1"을, "false" 대신 "0"을 넣어도 같은 효과 |
volume="0" autostart="0" loop="-1" showtracker="0"〉
14. [응용] 가로 및 세로폭 최대한 줄이기
showaudiocontrols="0" showpositioncontrols="0" |
위 11와 13번 항목을 응용합니다. 가로 및 세로폭을 줄여야 할 때 유용 합니다. 명령어 자체가 없거나 "true"이면 보이는 기능입니다. "true" 대신 "1"을, "false" 대신 "0"을 넣어도 같은 효과 |
volume="0" autostart="0" loop="-1" width=73 height=26
showpositioncontrols="0" showaudiocontrols="0" showtracker="0"〉
15. [응용] 가로 및 세로폭 줄이기 - 2
showpositioncontrols="0" |
위 9번과 13번 항목을 응용합니다. 가로 및 세로폭을 줄여야 할 때 유용 합니다. 명령어 자체가 없거나 "true"이면 보이는 기능입니다. "true" 대신 "1"을, "false" 대신 "0"을 넣어도 같은 효과 |
volume="0" autostart="0" loop="-1" width=170 height=26
showpositioncontrols="0" showtracker="0"〉
16. 베껴가지 못하게 하고 싶어요.
enablecontextmenu=0 |
플레이어 위에 마우스를 올리고 우측버튼을 눌러도 명령어 자체가 없으면 볼 수 있는 것이지요. "false" 대신 "0"을 넣어도 같은 효과 |
volume="0" autostart="1" loop="-1"
enablecontextmenu=0〉
hidden=1 |
플레이어를 감추고 음악만 흐르게 합니다. 명령어 자체가 없으면 보이는 기능입니다. "true" 대신 "1"을 넣어도 같은 효과 |
volume="0" autostart="1" loop="-1" hidden=1〉
4) Style 명령으로 스킨 색깔 바꾸기
단원 들어가기 전에...
블로그와는 상관없지만 필요한 얘기 하나 하고 넘어갑니다.
"어? 음악을 올릴려고 했더니 왜 안되는거야?"
이런 얘기 많이 합니다.
특히 일부 포털 사이트나 카페에 음악을 올릴 경우
HTML로 살펴보면 이런 메시지가 끼어 있습니다.
〈EMBED src=[안내]태그제한으로등록되지않습니다-음원주소.wma
type=audio/x-ms-wma volume="0" autostart="1" loop="-1" width=300 height=45〉
이 경우에 대비해서, 아래와 같이
EMBED 태그 내 src= 앞에 style 명령어를 하나 집어넣어 줍니다.
〈EMBED style="width:300px; height:45px" src=음원주소.wma
type=audio/x-ms-wma volume="0" autostart="1" loop="-1"〉
눈치채셨겠지만, 가로와 세로 길이를
style 명령어로 정해준 것 뿐입니다.
자세히 보시면 아시겠지만
style 명령어는 기호나 단위를 제대로 적어주어야 합니다.
style="width:300px;height:45px" |
이유는 이야기를 듣다보면 절로 알게 됩니다.
OK?
다음 연재를 기대해 주세요.
■ 다음 연재할 내용
2. Embed로 본문에 음악 넣기 2. 1) 미디어 플레이어 복사해서 붙이기 2. 2) Embed 태그로 음원 넣기 2. 3) Embed 태그내 각종 명령 익히기 2. 4) Style 명령으로 플레이어 색깔 바꾸기 2. 5) 특별한 나, 나만의 플레이어 색으로 꾸미기 |
인터넷에 저작권이 없는 음악이 제법 있습니다.
저작권 없는 음악을 찾으신다면 여기 링크를 참고하십시오.
http://blog.daum.net/mozzin/2919999
아래 들리는 음악은 인디밴드 MP3 전문사이트
www.millim.com에서 활동하는 재즈 뮤지션 EbNZ님의
Take It Easy라는 곡입니다.
'컴퓨터 자료실' 카테고리의 다른 글
◎ 한글의 올바른 영문표기법 (0) | 2010.01.16 |
---|---|
△ 집에서 시디 만들어 굽기 △ (0) | 2010.01.16 |
■ 마음에 드는 음악 여러곡을 하나의 음악파일로 만드는법 ■| (0) | 2010.01.16 |
◆ 음악, 영상시를 CD로 굽는 방법 ♬ (0) | 2010.01.16 |
★ 연속듣기 음악파일 쉽게 만드는 방법 ★ (0) | 2010.01.16 |