블로그에 좋아하는 음악과 동영상 올리기 [Embeded Flash Tag]

안녕하세요. 요즘 MP3나 wma 등 음원파일을 블로그에 올리지 못하는 경우가 많습니다.

특히, 자신의 블로그에 음악을 올리고 싶은데, html도 어렵고, 또, 여러가지 파일 변환을 하고

부분적으로 편집 등의 작업을 해야하는 경우가 많아 선뜻 자신이 좋아하는 음악을 올리지

못하는 경우가 있는 분들이 많아서, 우연찮게 웹서핑을 하던 중에 괜찮은 사이트가 있어서

도움이 될까해서 소개해 드립니다.

음악을 올리는 방법에는 세 가지 방법이 있습니다.

첫번째는, 자신이 업로드해두었던 MP3파일을 직접 변환하여 플레이어 코드를 사용하는 것이고,

두번째는, 윈도우무비메이커를 이용하여 wmv를 만들고, 다시 다음팟인코더를 이용하여

flv 파일로 변환시킨 후, 플레이어 코드를 생성하여 사용하는 것입니다. 

세번째는, Moyea flv editor를 이용하여 mp3만 변환 후, webtools.com에서 태그를 생성하여

사진과 적절히 맞추어 사용하는 방법입니다.

우선  첫번째 방법을 알려드리면,

http://www.webestools.com/mp3-player-flash-swf-generator-flash-mp3-player-fla-script-play-music-mp3-site.html

위의 주소를 클릭하면 " Flash Mp3 Player Generator " 라는 윈도우 창이 뜹니다.
(쉽게 이해하면 자신의 mp3 파일주소만 입력을 한 후 플레이어의 형태만 옵션으로
선정을 해주면 임베디드 태그가 자동으로 생성되어 자신의 블로그에 사용할 수 있도록
해주는 프로그램이라고 이해하시면 됩니다. 단, mp3만 되는 것 같습니다.)

* 우선 업로드된 .mp3 파일이 있어야 합니다.
예를 들면, http://웹상에 올려진 폴더 및 파일명.mp3 형식으로 올려져 있어야 겠지요.
그럼 모든 준비가 된겁니다.

다음의 사진에 기재된 순서대로 진행을 하시면 됩니다.
[사진을 클릭하시면 사진이 확대됩니다]

다음은 위의 순서대로 작업을 한 <object>~</object> 코드를 복사(copy)하여 블로그에
html 작성모드에서 붙여넣기한 모습입니다.

다음 두번째 방법을 알려드리면, Free Flv Player in flash (video player)를
이용하는 방법입니다.(업로드된 동영상 flv파일은 바로 사용할 수 있습니다.)

http://www.webestools.com/flv-player-free-flash-mp4-mov-h264-put-videos-on-your-website-streaming-video-player-flv.html

flv 파일이 있으면 좋겠지만, flv를 만드는 방법 한가지를 선정하여 실행해보면,
윈도우 무비 메이커를 이용하여 wmv 파일을 생성합니다.

(1) 윈도우 무비 메이커 실행(음악 flv 만들기)

사진과 mp3파일을 이용하여 동일한 타임(time)으로 맞춘 후에 동영상게시를 합니다.

동영상(wmv)파일의 용량이 너무 크면 인코딩을 해도 블로그에 업로드(티스토리 10M이내)가
어려우므로, 20M이내로 압축하여 변환시킵니다.

다음 변환된 wmv 파일을 다음팟인코더를 이용하여 flv파일로 변화시킵니다.
(윈도우 무비메이커를 거치지 않고, 바로 다음팟인코더에서 생성되는지는 잘 모르겠네요.
사용할 줄 아시는 분은 바로 사용하시는 것이 더 편하실 것 같네요.)

생성된 flv 파일과 곰플레이어를 이용하여 영상-> 화면저장을 사용하여 저장한 사진을
파일올리기로 블로그에 업로드 시킵니다.

위처럼 파일을 업로드한 후에 위에 링크한 주소를 클릭하여 생성시킵니다.
(http://www.webestools.com/flv-player-free-flash-mp4-mov-h264-put-videos-on-your-website-streaming-video-player-flv.html)

미리보기를 클릭하여 생성된 윈도우창에서 오른쪽마우스를 클릭하여 속성에 들어가서
각 파일의 주소를 복사하여 다음 아래처럼 주소를 입력시킨 후 사이즈와 스타일,
자동재생 등의 옵션을 선택합니다. (동영상 flv파일은 바로 적용 가능합니다.)

다음 아래 사진처럼 generate를 클릭한 후 Use the embed tag를
(내부태그를 클릭한 후 드래그된 상태에서??) 클릭하여 <object>~</object> 태그가 생성되면
그 태그를 복사(copy)하여 자신의 블로그에 사용을 하면 됩니다.

그럼 다음과 같이 생성됩니다.

<위의 결과물은 컨트롤 창이 좀 안맞는 것 같아서 Style #27을 재선택하여 적용한 결과입니다.>

또, 세번째방법은 위의 결과물들처럼 화면 편집 등이 번거롭게 느껴지신다면, 아래의 방법을
이용하세요.

(1) 다음 두개의 파일들을 자신의 웹호스팅이나 티스토리 스킨->HTML/CSS편집->업로드기능을
    이용하여 같은 폴더에 업로드 시킵니다. (.cab 과 .swf파일을 압축하였습니다)

flashplayer.zip

 

(2) 다음 메모장의 태그에 주소를 수정하여 사용하시면 추후 사진파일주소와 flv파일주소 편집만
    으로 편하게 이용하실 수 있습니다.
    (티스토리의 html/css편집에 파일을 업로드 및 주소를 얻는 방법은 다음 링크된 주소로
     ( http://plusblog.tistory.com/457  )이동하여 글을 읽어보시면 쉽게 이해하실겁니다.)

플래시음악재생기태그.txt

       

 

video4web_setup.a00

video4web_setup.a01

video4web_setup.alz

 프리웨어 입니다. (분할압축된 3개의 파일을 모두 다운로드 후 .alz 파일의 압축을 풀어주세요.)

Moyea converter (MP3->FLV)를 이용하여 두번째 방법을 적용하여 생성 후, 태그의 크기를

width="400" height="28" (위에 첨부한 '플래시재생음악태그' 참조)로 맞추어 적용하였습니다. 

메모장을 열어 한글로 된 태그에 파일 주소를 입력하여 사용하시면 추후 flv 파일주소만 수정하여

사용하시면 됩니다.

다음은 프로그램을 설치 후 실행한 화면입니다. 음악파일로만 출력(export)시켰습니다.

또, 다른 여러 기능들이 있는데 비슷한 사용법일 것 같습니다. 필요하시면 시험삼아 사용해도 
좋을 듯 싶습니다.

그럼~