티스토리 BGM : Snowsage Player Manual.

Matrix Ltd. 2007. 10. 10. 00:27

요 며칠간 BGM을 어떻게 하면 잘 넣었다고 소문이 날까 무지 고민하던중,
페이지가 바뀌면 끊어질 수 밖에 없는 무식 태그의 한계로 인해 gg를 치려고 했었습니다.
...만은! 엄청난 걸 발견해버렸습니다.

다음은 하얀현자님의 snowsage player, 즉 설치형 BGM 플레이어와 그 매뉴얼을 담아온 것입니다.
이하 잡설 생략하고 우리 함께 BGM 달려보아요!!
아 그리고...하얀현자님은 올해 2월에 논산으로 ㅂㅂ2 하셨다 하니..
일단 애도를 표하며, 기분 좋으면 사식 넣어드리기로 합시다. =ㅅ=;;

p.s : 컨트롤러 border를 전부 0으로 놓으면 고스트 플레이어(?)가 가능합니다. 그리고 첫곡부터 랜덤 플레이를 원하시면 player.html에서 var isRandom = 0;을 1로 바꿔주시면 됩니다. 아래에 top.bgm.ssp_randomToggle 이놈은 첫곡은 항상 똑같고 아마 그 다음부터 랜덤이 되는 듯 합니다.

--------------------------------------------------------------------------------------------

먼저, 이번 버전에서는 파일이 4개로 늘어났습니다.

frame.html  player.html  list.js  playerControl.html

여러분이 수정하셔야 하는 파일은 playerControl.html 과 list.js 파일이랍니다.
4개 파일 모두 일단 다운로드 받아 주세요^^


1. playerControl.html 에서는,

window.onload = function(){
//top.bgm.ssp_randomToggle();  // 기본적으로 랜덤 재생
if(top.changeTitle) top.changeTitle("수많은 사람들의 상상력, Tistory.com");
}

여기에서, "수많은 사람들의 상상력, Tistory.com" 부분을 수정하셔야합니다.
이 내용은 여러분의 블로그에 접속했을때, 브라우저 상단 제목표시줄에 나타나는 내용입니다^^
처음부터 Shuffle 모드로 플레이어를 돌리고 싶으실때, 앞의 "//" 두글자를 삭제해주시면 됩니다.


2. list.js 에서는, 실제로 여러분들의 노래가 들어가게 됩니다.
  addsong("음악파일주소", "음악파일제목");
과 같은 형식으로 입력해 주시면 됩니다.


3. 두개 파일을 수정하고 저장했으면, 이제 자신의 블로그에 업로드합니다.


사용자 삽입 이미지

사용자 삽입 이미지


4. 이제 스킨 편집 모드로 들어가서
아래의 코드를 붙여 넣습니다.
( 스킨이 가운데 정렬 스킨이면 isCenter 값을 1로 변경 )

사용자 삽입 이미지




5. 설치할 위치에서,
마우스 오른쪽 버튼을 눌러 나오는 값을 메모합니다.

사용자 삽입 이미지


6. 관리자 모드에서 다시한번 스킨 편집으로 돌아옵니다.


7. snowsagePlayer의 몇가지 값을 수정하여 적용시킵니다.

var isUsed = 1;         // SnowsagePlayer 적용여부 (적용: 1 / 미적용: 0)
var isCenter = 0;       // 스킨이 가운데 정렬이면 1 아니면 0
var test = 0;           // 플레이어 위치 조정시에만 1, 평상시엔 0
var leftPixel = 718;    // Controller 왼쪽(가운데)으로부터 떨어진 pixel
var topPixel = 20;      // Controller 상단으로부터 떨어진 pixel

  1) isUsed 값을 1로 변경합니다.
  2) test 값을 0으로 변경합니다.
  3) leftPixel 과 topPixel 값을 위에서 메모한 값으로 변경합니다.


8. 설치 완료!!

예에- 이것으로 snowsage player 의 설치 과정이 끝났습니다!
혹시 설치중에 어려운 부분이 있으시면, 트랙백이나 댓글로 질문 해주시면
답변해 드리도록 하겠습니다.
이상 하얀현자 였습니다! ^ㅡ^

== Version History ==
1.01 :: 자신의 URL 쓰지 않아도 작동 가능하게 수정.
1.02 :: 등록한 노래가 3개 이하 일 때 랜덤 재생시 다운되는 현상 수정.
1.10 :: Tistory Open Beta 전체적인 구조 변경으로 플레이어를 iframe 으로 변경
1.11 :: 간혹 플레이어가 iframe 정보를 받지 못해 제목과 시간이 나오지 않던 오류 수정
1.12 :: Snowsage Player가 설치된 사이트에서 또 다른 설치 사이트로 링크시 노래목록 갱신이 되지 않던 문제 수정
1.13 :: frameset 으로 인해 tistorytoolbar가 표시될때 가로 스크롤이 생기던 문제 수정
1.14 :: 자신의 code를 입력하지 않아도 자동 인식하도록 수정
1.15 :: F2 키로, 파일 업로드 창으로 이동할 수 있게 수정 && 가운데 정렬 스킨에도 사용 가능하게 수정
1.16 :: 설치시 편의를 위해 마우스 오른쪽 버튼 클릭으로 위치 알 수 있도록 수정


2007.11.23일자 Post Script :

이 파일은 플레이어의 곡 리스트 박스가 아래로 생성되게끔 설정 되어 있는 파일입니다.
playerControl.html로 이름을 바꾸어 그대로 사용하시면 됩니다. (물론 커스터마이징은 하셔야 ^^)

2008.02.08일자 Post Script :

이 압축파일은 제 블로그에 적용시키던 (i.e. 제가 커스터마이징한) 해당 BGM의 모든 파일들입니다.
플레이어 태그는 텍스트 파일로 저장되어 있습니다.

댓글을 달아 주세요

  1. 이전 댓글 더보기
  2. BlogIcon ColorFilter 2008.04.29 12:38 신고  Modify/Delete  Reply

    앗 갑자기 파비콘 보이네요..ㅋㅋ 감사합니다

  3. BlogIcon ColorFilter 2008.04.29 15:15 신고  Modify/Delete  Reply

    ㅇ ㅏ네근데 죄송핟네 참고로
    가운데 정렬값 1로 하면 플레이어가 안보이네요..
    그리고 내컴터에서보는거랑 다른컴터에서보는거랑 플레이어 위치가
    다르네욤..-,-
    ㅎㅎ
    아무튼감사합니다

    • BlogIcon Μųźёноliс 2008.04.29 17:23 신고  Modify/Delete

      음...다른 컴퓨터에서 볼 때 위치가 다른 것이 아니라..
      가운데 정렬을 사용할 경우는, 브라우저의 사이즈를 조절하면 위치가 바뀌어버립니다.
      (가령, 브라우저를 실행한 이후 최대화를 한다든가)

  4. BlogIcon ColorFilter 2008.04.29 15:18 신고  Modify/Delete  Reply

    ㅇ ㅏ죄송한데,
    저위에 카테고리 접는거 어떻게하셨나요?접는태그는 아무리찾아도 안나오네요
    ㅜㅜ..more//less 를이용하신건가?

    • BlogIcon Μųźёноliс 2008.04.29 17:25 신고  Modify/Delete

      저건 따로 자바스크립트 파일을 추가해야 합니다.
      여러 스킨들에서 사용 중이기도 하지만, http://muzeholic.tistory.com/378
      여기 압축파일 풀어보시면 toggle.js라고 있습니다.
      해당 파일과 skin.html에 관련 태그를 추가해주시면 적용이 되겠죠 ^^;

  5. BlogIcon ColorFilter 2008.04.29 22:48 신고  Modify/Delete  Reply

    감사합니다~친절하시네요

  6. BlogIcon ColorFilter 2008.04.29 23:35 신고  Modify/Delete  Reply

    What's new,guest 그런메뉴들의 폭은 어떻게줄이신건가요??

    • BlogIcon Μųźёноliс 2008.04.30 00:08 신고  Modify/Delete

      style.css에 보시면..#blogMenu a 항목이 있을텐데, 거기서 height 부분을 조절해주시면 됩니다. (font 수치를 바꿔주면 되겠죠.)

  7. BlogIcon ColorFilter 2008.04.30 03:17 신고  Modify/Delete  Reply

    ㅇ ㅏ~감사합니다..근데왜 홈피에 노래는안넣으셨나요?
    제가 너무 뮤즈님 홈피를따라한거같아서
    뮤즈님이 싫어하실거같네요..ㅋㅋㅋ
    ㅇ ㅏ..그리고 혹시 본문사이즈가 몇인가요?580인가요,아니면 600인가요?

    • BlogIcon Μųźёноliс 2008.04.30 08:58 신고  Modify/Delete

      정확하게는 590이랍니다 ^^:
      (이유는 제 사진들이 580인데 이미지 블럭이 좌우로 5px씩 먹어서;;)
      그리고 홈피에 노래는...후 뭐 들으러 올 사람들이 없어선지...=ㅅ= (후략)

  8. BlogIcon ColorFilter 2008.04.30 15:41 신고  Modify/Delete  Reply

    안녕하세요~뮤즈님덕분에 스킨이쁘게꾸몄네요..ㅎㅎ 자주놀러올게요
    오늘 도메인도신청해서 홈피주소바꿨는데 달라진건없지만 기분은
    좋네요..-_-

  9. BlogIcon 초인(超人) 2008.05.05 14:08 신고  Modify/Delete  Reply

    리스트에서 자신의 블로그에서 첨부를 어떻게 빼죠?? 쥬크박스로만 나와서 빼기가 어렵네요 ㅎㅎ;

    • BlogIcon Μųźёноliс 2008.05.05 21:13 신고  Modify/Delete

      해당 첨부파일이 있는 글을 에디터로 불러서, HTML편집모드로 들어가시면..
      아마 주크박스에 해당하는 태그가 보이실겁니다.
      그러면 노래 제목 왼쪽에 **.mp3이라는 파일명이 나오는데..
      이놈을 http://자신아이디.tistory.com/attachment/**.mp3 식으로 적으시면
      바로 해당 URL이 된답니다 ^^;;

  10. BlogIcon 김성언 2008.06.11 20:48  Modify/Delete  Reply

    스노우에이지를 잘 사용하고 있습니다.
    하나 여쭤 보고 싶은게 있어 이렇게 질문합니다.
    다른게 아니라 전체 반복 기능하고 Sequence를 초기치로
    하고 싶은데 이걸 어떻게 설정하나요?
    제건 전체 한번 진행과 Suffle이 초기치로
    잡혀져 있습니다.
    그럼 한 수 부탁드립니다.

    • BlogIcon Μųźёноliс 2008.06.11 21:14 신고  Modify/Delete

      player.html을 열어서 조금 내리다보면
      var isRandom = n;
      var loopOne = n;
      이라고 되어 있는 부분이 있습니다.
      isRandom = 0; 그리고 loopOne = 0;인 상태로 저장을 하시면
      말씀하신대로 전체 반복과 순차적 재생이 기본으로 세팅될 듯 합니다.

  11. BlogIcon 야짐히라 2008.06.18 21:50  Modify/Delete  Reply

    snowsage player를 쓰려는 사람인데
    재생이나 정지버튼들이 ??class=로 나오네요 어떻게 해야되나요?

    • BlogIcon Μųźёноliс 2008.06.18 22:47 신고  Modify/Delete

      저도 처음 들어본 상황이라 그런지 문제가 뭔지 잘 모르겠습니다 ^^;;
      도움이 못 되어드려 죄송합니다 ㅠㅠ;

  12. 2008.06.19 18:34  Modify/Delete  Reply

    비밀댓글입니다

  13. 2008.09.21 17:16  Modify/Delete  Reply

    비밀댓글입니다

    • BlogIcon Μųźёноliс 2008.09.21 21:09 신고  Modify/Delete

      그런가요? =ㅅ=a 그렇다면 제가 사용하던 버젼으로 올려둔 것을 한번 수정해서 사용해보시기 바랍니다. 이유가 뭔지는 모르겠지만 원본이 잘 안 된다고 하시는 분들이 있어서요..

  14. BlogIcon 피터팬이야 2008.09.27 21:00  Modify/Delete  Reply

    제가 적용은 완료가 되었는데요...
    주소창의 글주소 좀 이상하게 나오네요..ㅜㅜ
    그래서 문의 드립니다...트랙백주소처럼 포스팅한 글 아래에 해당 글주소로 나타낼수 있는 방법을 알고 계시면 부탁드립니다....ㅜㅜ

    • BlogIcon Μųźёноliс 2008.09.27 21:57 신고  Modify/Delete

      아...주소창의 지저분함(?)은 어쩔 수 없는 부분인듯 합니다.
      아마 다른 네임서버로 덮어씌우는 방법이 있지 않을까 합니다만..
      저도 전문가가 아니라 가능한지 아닌지조차도 모르겠습니다. ㅠㅠ;

      그리고 해당 글의 링크..를 그대로 표현하고 싶으시다면 [*##_article_rep_link_##]를 사용해보시면 될 듯 한데요? ([과 #사이의 *는 지워주시는 센스 ㅎㅎ) 음...<a href="[*##_article_rep_link_##]">[*##_article_rep_link_##]</a> 뭐 이렇게 넣어주면 안 될라나요? (-- )a

  15. 2008.11.27 20:36  Modify/Delete  Reply

    비밀댓글입니다

    • BlogIcon Μųźёноliс 2008.11.27 23:07 신고  Modify/Delete

      이게 재생이 되다 멈추는 경우는...아마 컴퓨터 사양이나 인터넷 회선 때문에 버퍼링이 걸리는 것이 아닐까 생각됩니다. 지금 걸어두신 음악은 잘 재생이 되고 있는 것 같습니다만...아직도 그런 문제가 있으시다면 용량이 작은 음악파일로 교체하시면 해결되지 않을까 싶습니다. ^^;

    • 2008.11.28 07:40  Modify/Delete

      비밀댓글입니다

    • 2008.11.28 07:55  Modify/Delete

      비밀댓글입니다

    • BlogIcon Μųźёноliс 2008.11.28 09:16 신고  Modify/Delete

      흠...그러게요 만약 다른 블로그의 snowsage player로는 BGM이 제대로 나온다면...개인 컴퓨터나 인터넷 회선 문제라기보단 티스토리 측의 일부 서버가 데이터전송을 제대로 하지 못해서 그럴지도 모르겠네요;; 이거 참 해결방법을 드리지 못해 죄송합니다. ㅠ

    • 2008.11.28 20:23  Modify/Delete

      비밀댓글입니다

  16. BlogIcon doggygw 2008.12.02 01:48 신고  Modify/Delete  Reply

    휴 :( 학생이 밤중에 무슨 짓인지 ㅜㅜ

    저, 일단 설치는 제대로 된 것 같아요..
    위치도 맘에 들고 제목도 이상하지 않고 다 좋은데
    노래가 안나와요 ;ㅅ; 자꾸 0kbps로 나오구요..

    아무래도 list 파일에 음악주소를 잘못 넣은거 같은데요..
    그건 어떻게 뽑아서 넣어야하죠??
    제가 막 다른 곳에서 주소를 뽑으니 엄청 복잡하더라구요.

    그 올려주신 파일 다운받아 봤는데 거기는
    엄청 간단하게 되어있더라구요ㅜ
    어떻게 하신거에요??

  17. BlogIcon doggygw 2008.12.02 02:04 신고  Modify/Delete  Reply

    아. 역시 뮤즈님껄로 하니까 되는군요..
    음악주소를 어디서 따오시는지 알려주세요 ㅜㅜ

    http://muzeholic.tistory.com/attachment/cp503.mp3

    이런 주소는 어떻게 만드는지 상세히 부탁드려요 ㅜㅠ

    • BlogIcon Μųźёноliс 2008.12.02 11:25 신고  Modify/Delete

      안녕하세요 ^^;; 잘 해결하셨는지 모르겠습니다.

      사실 도메인주소/attachment/ 뒤에 붙이는 파일명은..에디터에서 해당 음원 파일로 쥬크박스를 삽입하신 후, html 모드로 보시면 확인하실 수 있기도 하고...그게 귀찮으시다면 주크박스로 업로드가 되어있는 포스트 주소에 /m만 추가해주시면 바로 파일명이 보이게 되어있습니다. (도메인주소/m/포스트넘버의 순서. 예시: muzeholic.tistory.com/m/1)

      이 /m은 모바일용 페이지라고 태터툴즈 시절부터 지원을 하던 놈인데...이렇게 접속을 할 경우 쥬크박스는 뜨지 않고 대신 음원파일을 다운로드할 수 있게 되거든요 ^^;; 도움이 되셨다면 좋겠습니다.

  18. BlogIcon doggygw 2008.12.02 16:14 신고  Modify/Delete  Reply

    대충.. 작동은 하네요 키키키~! 감사드려요ㅋㅋ

    근데, 처음부터 셔플모드 하려면..
    //를 지우라고 하셨는데 //이 두 군데 잖아요.
    뭘 지워야 하죠?

    • BlogIcon Μųźёноliс 2008.12.02 17:20 신고  Modify/Delete

      window.onload = function(){
      //top.bgm.ssp_randomToggle();
      if(top.changeTitle) top.changeTitle("수많은 사람들의 상상력, Tistory.com");
      }
      에서 //를 지우시면 되는데...제가 해보니 저렇게 하면 첫곡이 항상 동일하더라구요? 첫곡도 랜덤으로 되길 원하시면...player.html에서 var isRandom = 0;을 1로 바꿔주시면 될거예요.

  19. BlogIcon 라둔하게둔 2008.12.15 22:26 신고  Modify/Delete  Reply

    안녕하세요, 그간 수 차례 삽질에 삽질을 거듭하다가 이제 정상적으로 돌아가고 있는 모습을 보며 흐뭇해 하고 있는 중이랍니다.

    그런데... 리스트에 다른 곡을 하나 업데이트 했더니 리스트의 순서/곡 정보가 완전 반대로 나오는군요... ^^;; 이거 원 황당해서리;

    뭐, 어차피 저 블로그는 오픈하려면 4개월 정도는 넘어야 오픈할 거기 때문에 느긋하게 하면 되겠지요. 무사히(?) 재생이 되는 걸 보고드리러 간만에 들렀습니다. 건강하세요~

    • BlogIcon Μųźёноliс 2008.12.22 09:13 신고  Modify/Delete

      ㅎㅎ 잘 되어가고 있으시다니 다행입니다. 아이고 =ㅅ= 전 이거 뭐 몇일 만에 리플 체크를 하는지 모르겠네요. 요즘 업무량이 살인적이라 말이죠 ㅠㅠ

      오픈하시면 꼭 놀러가겠습니다. ^^;;

  20. 2009.01.01 10:45  Modify/Delete  Reply

    비밀댓글입니다

    • BlogIcon Μųźёноliс 2009.01.02 09:18 신고  Modify/Delete

      저는 몇달째 사용을 안 하고 있어서 몰랐군요...이상하네요? 티스토리 측에서 스크립트를 막은게 아니라면 되던게 안 될 이유는 없는데 말이죠 ^^;;

  21. BlogIcon [sm]rose 2009.01.03 15:14 신고  Modify/Delete  Reply

    흠,, 안되네요 티스토리측에서 무슨짓을 했는지.. 막혀버렸습니다 ㅠ.ㅜ