티스토리 블로그 음악(BGM)넣기

안녕하세요 달려라 촌딱입니다.

 

많은분들이 블로그에 음악을 넣는 방법에 대해 물어보셔서

 

오늘 포스팅을 해보고자 합니다.

 

초보라서 어설퍼도 욕만 하지 말아 주세요 ㅋㅋㅋ

 

그럼 한번 시작해 볼깨요!!

 

처음 준비할 것!! MP3 음악이 필요 합니다.

 

넣고 싶은 음악을 미리 준비 하셔야 됩니다.

 

 

블로그에 넣을 음악 준비 되셨나요?

 

먼저 비공개 게시물을 하나 만들어야 됩니다.

 

만드는 이유는 거기다가 음악파일을 넣고 활용하기 위해서 입니다

 

위에 사진대로 파일을 클릭후 배경음악으로 넣고 싶은 파일을 업로드 해주세요

 

게시물 제목을 적으시고 업로드가 완료되면 완료를 눌러주세요

 

그럼 게시물에 밑에 사진과 같이 MP3 파일이 등록된 것을 볼 수 있습니다.

 

아마 이렇게 표시가 될건데요 저는 2개 파일을 올려서 이렇게 표시가 되는데요

 

아마 보시는 분들은 1개 파일이 나올거에요

 

업로드한 파일의 링크 주소를 복사 해 줍니다

 

 

복사한 링크 주소를 다른 메모장에 메모를 해놓으시면 편합니다.

 

이제 기본 준비가 되었으니 본론으로 들어 가겠습니다.

 

 

자신의 블로그로 이동을 합니다.

 

이동을 하셨으면 관리페이지>꾸미기>스킨편집으로 이동을 합니다.

 

 

그다음 HTML 편집을 꾸욱 클릭합니다.

 

 

클릭을 하시면 아래 에디터가 뜨는데

 

여기다가 소스 코드를 작성해서 넣을 꺼에요

 

 

HTML 편집을 클릭하시고 HTML을 클릭을 하면 위에 사진처럼 에디터가 뜰거에요

 

어디다가  소스 코드를 집어 넣을 건지 제가 가르쳐 드릴깨요 

 

밑에 사진을 보면서 게속 이어가도록 하겠습니다.

 

 

위에 사진처럼 저곳에 소소코드를 넣을 건데요

 

HTML편집 맨끝부분에 위에 저자리에 소스 코드를 넣겠습니다.

 

 

 

소스코드를 넣은 후 사진 입니다.

 

소스 코드를 일일이 다 적을려면 오타가 생길수도 있고 

 

저처럼 초보분들은 실수가 많으니 제가 복사 할수 있도록 밑에 적어 놓을깨요

 

<!-- 배경음 -->

<audio loop autoplay id='bgm' 

src=여기는 아까 처음에 음악파일 링크주소 복사 한거를 넣을 거에요

</audio>

<script>
$('#bgm')[0].volume = 0.1;
</script>

 

그대로 복사 하셔서 소스 코드 넣으시면 되겠습니다.

 

 

제가 위에 표시한 부분은 음악소리 관련된 소스 코드 인데요.

 

뒤에 끝숫자 0.1 이 뜻하는 것은 볼륨 10% 뜻입니다.

 

소리가 너무 작으시면 조절하시면 될 것 같습니다.

 

 

이렇게 다 하셧다면 완료 하신거에요 ㅋㅋㅋ

 

적용을 꾸욱 누르시고 블로그 에 가시면 BGM 흘러 나올겁니다!!

 

진짜 제가 최선을 다해서 블로그에 음악(BGM)넣기 포스팅을 해보았는데요..

 

설명을 잘 했는지도 모르겠습니다.

 

궁금한 사항이 있으시면 언제든지 댓글 달아 주시고요

 

위에 포스팅한 내용은 진짜 초보적인 음악 넣기 입니다.

 

저에게는 블로그 스승님이 계십니다. 상미넴이라는 고수분이 계시느데요.

 

혹시 고급편을 보고자 하시면 저희 스승님 블로그에 가셔서 구독과 공감 누르시면서

 

참고 하시면 되겠습니다.

 

저희 스승님 블로그 주소 입니다. https://sangminem.tistory.com/

미리 알았다면 좋았을 텐데

허접한 초보 블로그 봐주셔서 너무 감사하구요

 

조금 어설퍼도 욕하지 말아 주시고 이쁘게 봐주셔요 

 

오늘 하루 좋은 하루 되세요