안녕하세요.
이번 포스팅에서는 티스토리 블로그에 배경음악을 삽입해볼겁니다.
그리 어렵지 않으니 아래 방법만 잘 따라주시길 바래요.
1. SCM Music Player 링크로 고고씽
SCM Music Player - seamless music for your website
SCM Music Player is a free and open source web music player, that brings a seamless music experience to your website. Support Tumblr, Blogger, Weebly, Tistory and more. Continous Playback Cross Pages - Seamless playback throughout your website. Full Featur
scmplayer.co
- 위 사이트는 우리가 손쉽게 배경음악을 블로그에 삽입할 수 있도록 도와줄 무료 오픈소스웨어입니다.
- 아직은 서툰 html/css언어, 저희를 대신해서 해당 사이트에서 스크립트를 생성해줄 꺼에요.
- 우리는 그걸 복사/붙여넣기만 하면 된다는 말씀!!
위 링크를 타고 들어가시면, 위와 같은 창이 출력됩니다.
Choose Skin, 음악 플레이어 스킨을 고르라는 뜻이죠.
저는 다크다크한 검정이 좋기에 검정을 선택했습니다.
*추가로 더 다양한 스킨을 보고 싶으시면 4000+ Custom Skins를 클릭하시면 됩니다.
2. 스킨을 다 고르셨다면 Next(다음)을 클릭해주세요.
3. 원하는 노래 링크(URL)을 복사해 와주세요.
- Song title에는 해당 링크의 노래제목을 써주세요.
저는 유튜브에서 집중음악으로 피아노 & 빗소리를 가져왔어요.
4. 원하는 노래목록을 다 넣었다면 Next(다음) 클릭
5. 기본 셋팅창이 나와요. 원하시는 설정을 해주세요.
PlayBack
Auto Play: 자동재생
Suffle Playback: 재생순서 섞어듣기
Default Volume: 기본음량 조절
Repeat Mode: 반복재생 여부
-Repeat Playlist: 반복재생 목록
-Play Playlist Once: 재생목록 한번 재생
-Repeat item: 한곡 반복재생
Appearence
Placement of Player Bar: 음악재생 창의 위치
- Top:꼭대기 or Bottom:바닥
Show Playlist by Default: 재생목록을 보이게 할지 여부
6. 설정을 끝내셨다면 Done(마무리)를 클릭
7. 밑에 자동으로 출력된 스크립트를 복사해주세요!
8. 복사한 스크립트를 나와있는 설명대로 붙여넣기 해주시고 스킨을 적용시켜 주세요.
- Congratulations! Your SCM Music Player has been created. /** 축하한다 너의 SCM 음악재생기가 완성되었어. **/
- Please paste the code into your HTML template, right under <body> or <body...
(Tumblr user: go to Customize appearance> Edit HTML) /** 너의 HTML 템플릿(스킨)의 body태그 밑에 붙여넣기해. **/
9. 오류해결
- 블로그의 형태도 다양하고, 블로그마다 짜여진 스크립트가 달라서 어느 블로그는 되는 경우도
어느 블로그는 안되는 경우도 발생합니다. 저의 블로그도 마찬가지였는데요.
- 그래서 저는 마지막에 SCM Music player가 아닌 Wiki player로 바꿔 시도하니 그제서야 정상 작동하더군요.
* 본인의 블로그에 맞는 음악재생기를 찾아쓰시길 바랍니다. / 음악재생기별 그래픽툴은 비슷하기 때문에 위에 방법 그대로 진행하셔도 무관합니다.
* Wiki player: http://www.wikplayer.com/
* 하나 단점, 음악이 나오는 건 좋으나 음악을 불러오면서 블로그가 매끄럽게 동작하지 못할 수 있습니다.
이상, Patience Lee 였습니다.
감사합니다. ^^
'컴퓨터 활용 Tip' 카테고리의 다른 글
| 갤럭시탭S7 세컨드스크린 연결 문제 해결하기 (0) | 2021.02.10 |
|---|---|
| [스크랩] 안쓰는 공유기로 무선랜카드 만들기 (2) | 2020.03.04 |
| 구글 애널리틱스 활성화하기 (0) | 2019.12.28 |
| [블로그] Kakao AdFit 등록하기 (2) | 2019.12.10 |
| [컴퓨터활용] 손쉽게 컴퓨터를 관리하는 방법 1 (0) | 2019.12.09 |
