Lavalic 뮤직 플레이어 모듈

원본 자료 참고

https://rhymix.org/tip/1272
https://xe1.xpressengine.com/forum/22985851

 

 

 

 

 

간단 소개

XE 초창기때 유명했던 Lavalic mp3 player를 개선한 버전입니다.

페이지가 바뀌거나 해도 끊김없이 음악을 듣고 싶은 분들께 도움이 되었으면 합니다.

클로드AI로 바이브 코딩으로 작업했습니다. 질문하셔도 잘 모릅니다 ㅠㅠ

 

 

수정사항

1. 플래시 기반으로 되어 있는 것을 htm5 오디오로 수정했습니다. 

2. mp3만 되던 것을, 첨부파일/mp3 링크주소/유튜브 주소를 입력하면 재생되도록 했습니다.

3. 유튜브 재생시에는 플레이어 재생바가 사라지고 유튜브 영상과 재생바를 그대로 보여줍니다.

4. 모바일에서도 가능하도록 했습니다.

 

 

사용방법

(모듈과 위젯이 각각 설정이 필요합니다. 뮤직 플레이어는 위젯에서 불러옵니다.)

 

 

모듈 설정법

 

1. 우선 모듈을 다운받으시어 /modules/ 에 압축을 푸세요.

2. lavalic 뮤직 플레이어와 연동할 음악 게시판을 메뉴에서 만듭니다. 게시판에 아래 그림과 같이 확장변수를 설정합니다. 

확장변수 1은 음악의 제목을, 확장변수 2는 가수를, 3번에는 가사, 그리고 4번에는 외부 URL을 적습니다.

 

 

 

3."관리자메뉴 > 모듈" 에서 Lavalic Music Player 를 찾으셔서 오른쪽 하단의 생성버튼을 누릅니다. Lavalic MP3 플레이어 관리화면이 나오면, 다양한 설정을 하시면 됩니다.

가. 모듈이름 - 실제 lavalic  뮤직플레이어가 실행할 때 연동되는 이름입니다. widget 설정시 이 이름이 필요합니다.
나. 모듈분류 - 모듈분류입니다. 관리가 편하도록 존재하는것 입니다.
다. 브라우저 제목 - Lavalic 뮤직플레이어 창의 제목을 설정합니다.
라. 위의 2번과정에서처럼 만든 게시판들을 선택합니다. 한개 이상 선택하셔야 합니다.(확장변수를 만든 게시판)
마. 글자 크기 - 위젯의 뮤직플레이어에서 사용되는 글자 크기입니다.
바. 자동 재생 - 위젯의 뮤직플레이어가 실행 되지 마자 바로 연주를 시작하는가를 나타냅니다.
사. 리스트 섞기 - 위젯의 뮤직플레이어를 처음 실행했을때, 리스트를 랜덤하게 섞어서 보일지를 나타냅니다.
아. 랜덤 재생 - 위젯의 뮤직플레이어의 첫 연주때 랜덤하게 곡을 골라서 재생할지를 나타냅니다.

 

4. 설정을 마치고, 등록을 하면 모듈이 생성 완료됩니다.

 

 

---

 

 

위젯 설정 편

 

 

1. 뮤직 플레이어를 설치할 페이지로 이동하여 페이지 수정을 누릅니다.

2. 위에 위젯 추가에서 Lavalic 뮤직 플레이어를 선택합니다.

가. 스킨 - 출력 형식을 설정하는것 입니다. 큰 의미는 없습니다. (각자 마음에 드는 뮤직플레이어 이미지를 사용하세요)

-버튼 출력 스킨을 선택 : 위젯 설정창의 제일 하단의 Lavalic 열기 텍스트 입력칸에 입력한 텍스트가 보여집니다.

-ms play 로고 : 간단한 음악플레이어라는 단어가 있는 작은 이미지가 생성됩니다. 
-위의 생성된 텍스트나 이미지를 클릭하면 뮤직플레이가 실행됩니다.

 

나. 캐시 - 몇분 간격으로 위젯 출력값을 캐싱할것인지를 설정합니다.

 

다. Lavalic 모듈 선택 - 모듈 설정편(3번의 가 항목)에서 생성한 Lavalic 모듈을 선택합니다.(게시판이 아니라, lavalic 생성 모듈 이름입니다.)

 

라. Lavalic 열기 텍스트 - Lavalic 실행 버튼에 들어갈 텍스트입니다. ex) Lavalic MP3 Player 열기

3. 코드 생성을 누릅니다. 아래에 코드가 뜰 경우(레이아웃 편집 페이지일 경우) 이를 복사해서, 원하는 위치에 붙여넣도록 합니다.