1. basic 스킨에서 첨부파일의 압축을 풀어 pc 와 모바일 각각의 디렉토리별로 파일과 폴더를 업로드하여 덮어씌우기 합니다.

----------

2. 게시판 설정에서 글쓰기시 에디터를 사용하지 않는 옵션을 줍니다.

----------

3. 글쓰기시 html 체크박스를 해제하고 셀렉트에서 mp3_circle 를 선택합니다.

----------

3. 글쓰기시 아래의 자바스크립트 변수를 본인의 취향대로 기입합니다.

<script>
pcSize = "400px"; // pc 가로세로 픽셀
mobileSize = "250px"; // 모바일 가로세로 픽셀
pcBorder = 10; // pc 테두리 픽셀 - 트랙바 굵기
mobileBorder = 7; // 모바일 테두리 픽셀 - 트랙바 굵기
baseColor = "#ffffff"; // 기본 색상
trackColor = "#81bef7"; // 트랙바 색상
startMode = 0; // 최초시작번호 0은 랜덤시작
playButton = "play.png" // 재생버튼주소
stopButton = "stop.png" // 정지버튼주소
mediaList_1 = ["1.mp3", "1번곡정보", "1.jpg"];
mediaList_2 = ["2.mp3", "2번곡정보", "2.jpg"];
mediaList_3 = ["3.mp3", "3번곡정보", "3.jpg"];
</script>

----------

4. 리스트 배열은 아래의 형식으로 더해 나가거나 빼 나갑니다. 숫자는 몇개라도 상관 없습니다.

mediaList_n = ["n번 mp3주소", "n번 곡정보", "n번 이미지주소"];

이미지의 경우는 직사각형 이미지라도 알아서 정사각형 원형 이미지로 리사이징 합니다.

----------

5. 한 곡이 끝나면 다음 곡으로 자동재생 됩니다.

다음 순번 자동 넘기기는 전진 버튼 클릭 이후에는 정방향으로 후진 버튼 클릭 이후에는 역방향으로 진행됩니다. 최초는 정방향 자동 넘기기입니다.

----------

6. 재생 정지 버튼의 샘플 주소는 아래와 같습니다.

playButton = "https://blog.kakaocdn.net/dn/1aY1b/btrvZ309K9P/sG5NEaf9zdImHuywWo9HF1/img.png";
stopButton = "https://blog.kakaocdn.net/dn/bL3YN6/btrv5mEIyno/Ocj1pX1nrIRJ3I8flDIUG0/img.png";

----------

7. css 는 media 디렉토리 안의 php 파일 안에 입력되어 있으니 원하는대로 수정해 쓰세요.

본인이 수정하여 사용하는 건 얼마든지 가능하지만

원본이나 수정본을 무료거나 유료거나 재배포 엄금 입니다.

또한 js 코드만 발췌하여 단독 페이지로 띄우는 것도 엄금하겠습니다.

----------

8. 그누순정 기준입니다.

커스텀 스킨이나 다른 테마나 빌더는 적용해 보고 안 되면 그만이며 거기에 대한 질문은 일절 받지 않습니다.

기능에 대한 오류가 있으면 모르겠으니 기본 기능을 첨삭하거나 css 스타일링 문제 역시 질문 받지 않을게요.^^

100% 자바스크립트로 만든 것이라 php 버전은 크게 상관 없을 것입니다.