본문 바로가기

컴터생활의 이해/블로그팁

블로그에 노래위젯 설치하는 방법

* 티스토리 블로그를 기준으로 설명합니다!

블로그 사이드 메뉴에 설치할 수 있는 노래위젯은 여러가지가 있습니다. 블로거님들께서 이미 알고 계시겠지만 소리바다에서 제공하는 뮤비위젯, 다음 위젯뱅크 벅스 내앨범 위젯 등등 사용하기 편한 위젯은 약 5가지 내외가 있는데 나머지는 지금 제 컴퓨터가 아니라서 기억이 안나네요^^;
(더 많이 있지만 가장 편한것들은 몇가지 안된다고 생각되요)

티스토리 블로그에서 노래위젯 설치시 짜증(?)나는 한가지가 있다면 새 글을 보거나 방명록 등의 메뉴를 클릭하면 노래가 처음부터 다시 나온다는 사실.. 하지만 벅스 내앨범 위젯을 사용하면 노래가 다른글을 보아도 끊기지 않지만 자기가 구입한 노래가 아니라면 20~30초 미리듣 밖에 안된다는 현실 ㅠㅠ

http://www.loudfusion.com/ 홈페이지의 위젯을 티스토리 블로그에 달아보겠습니다^^
*스크롤 압박 주의하세요!

회원가입하기 - 완전무료


이메일은 꼭 정확하게 입력하셔야 합니다. 'Send key'를 누르면 입력하신 이메일로 5분 ~ 10분 이내에 회원가입 인증 메일이 도착합니다. 이때 스팸메일로 간주될 수도 있으니 꼭 채크하세요. 벌써 메일이 도착 했네요^^ 링크를 눌러서 계속 해주세요!


여기까지 어렵지 않으셨죠? 이제 간단한 입력이 남았네요..


저는 이미 가입했기 때문에 재가입이 싫어서 다른분의 사진을 그대로 퍼왔습니다. I Agree to the Terms Of Service(TOS) 꼭 채크해주시고 'Create Account' 를 누르시면 회웝가입완료! 짝짝짝 이제 위젯 사용을 위한 로그인 준비가 되었습니다^^



노래 추가하기 - 목록에서 검색하기

http://www.loudfusion.com/ 로그인 상태에서 'Music'메뉴를 클릭합니다. 원하는 노래를 검색해주세요. 저는 티아라(T-rara)를 검색해봤습니다. 포핍포핍 이외에 여러가지 노래가 있네요^^ 원하는 곡들을 플레이어리스트에 추가시키기 위해 초록색 버튼을 눌러주세요!



URL로 직접 노래 업로드해서 추가하기

http://www.loudfusion.com/ 로그인 상태에서 Music메뉴를 클릭합니다. 'Submit Songs' 를 클릭해주세요. 아래와 같은 화면이 표시됩니다. 이제 여기서부터가 중요합니다. 잘 봐주세요!


음악을 직접적으로 업로드 할 수 없으니 블로그나 기타 사이트에서 업로드 후에 URL 코드 소스를 붙여넣어야 합니다. 많은 분들이 이글루스에 올리라고 하셨는데 저는 이글루스 아이디가 없어서 미니홈피에 올려서 할려고했는데 미니홈피에 올리면 URL소스가 오류나니 그냥 티스토리에 비공개글로 업로드하세요.

스킨 HTML/CSS 편집에 mp3업로드 하고 소스복사해서 ULR입력해도 오류발생합니다 ㅠㅠ
티스토리에 음원을 비공개로 올릴때도 역시나 저작권 때문에 쉽지가 않습니다. 티스토리보다 저 좋은 곳이 있다면 그곳에 올리시고 음원소스를 찾아서 복사해주세요!


업로드한 음원의 태그코드 소스를 URL 창에 입력해주고 'Add song'을 클릭하면 업로드 완료!!! 뮤직 리스트에 바로 표시가 됩니다. 노[래 추가하기 - 목록에서 검색하기]에서와 같은 방법으로 플레이어 리스트에 추가시키면 원하는 노래가 쏘~옥^^

 

위젯 설정 및 태그코드 복사

상단의 Widgets(위젯)을 클릭해주세요. 원하는 모양의 플레이어를 선택할 수 있습니다. 하지만 사이드에 달경우 250x100사이즈가 가장 이상적이라고 봅니다. 소스코드 복사후 사이즈는 개인적으로 변경하셔도 무관합니다^^


Simple flexible mp3 player 2를 선택하시고 클릭하시면 위와같은 화면이 나옵니다. 기존의 태그코드를 그냥 사용해도 좋지만 저희가 원하는 것이 이것이 아니지 않습니까^^? 입맛에 맞는 세부설정을 위해 'Change the look and options of my widget'를 살포시 눌러주세요!


입맛대로 위젯의 옵션을 변경해주세요. 백그라운드 컬러에 채크 되어 있을때 왼쪽의 색상에서 마우스로 클릭해서 색을 정하시고, 폰트컬러에 채크가 되어 있을때 같은 방법으로 왼쪽의 색상에서 마우스로 클릭해서 색을 정해주세요. 색상코드를 알고 있다면 코드로 입력하셔도 됩니다^^

모든 설정이 끝났다면 'Save Changes' 눌러주세요!


여기가 가장 헷갈렸던 부분입니다. 그냥 상단의 Widgets(위젯)을 눌러주세요. 위에서 선택하고 세부설정까지 해주었던 Simple flexible mp3 player 2를 클릭해주세요. 위젯코드가 보이네요. 주저없이 드래그해서 복사해주세요. 이제 블로그에 설치면 하면 끝나네요!

 

사이드 메뉴에 설치하기

블로그에 로그인 하시고 관리자 -> 스킨 -> 사이드바 설정으로 들어갑니다. 사용 가능한 모듈에서 태그 입력기를 선택하시고 이름은 마음대로 입력, 치환자에 아까 복사했던 태그코드를 붙여넣어주세요. <center> ~ </center> 태그를 입력하면 가운데로 올 수 있게 해주는거 아시죠^^?


새글을 보거나 방명록 등 다른 메뉴를 클릭할때 노래가 처음부터 재생되는 것 이외에는 불편함이 없습니다. 이미 많은 분들이 http://www.loudfusion.com/ 노래위젯을 사용하고 계세요. 벅스 내앨범 위젯에 제가 결제한 곡이 있다면 저도 벅스 내앨범 위젯을 사용하겠지만 돈의 압박이 -_-a

최대한 쉽게 설명하려고 노력했는데 이해가 가셨는지 모르겠네요.. 질문은 댓글로 해주세요^^
칭찬도 댓글로 부탁드립니다.. 처음에는 영어라서 많이 꺼려졌었는데 한번 해보고 나니 별거 아니네요.. 오늘 애드센스 두번째 지급 받으러 외환은행 갑니다~~~ 슝슝슝..

*오타는 너그럽게 이해해주세요^^