가이드 /
무료 AI로 스킨 만들기
스킨은 HTML 파일 하나�
스킨은 사이트의 모양(색, 배치, 글꼴, 모양)을 정합니다. CSS가 들어 있는 HTML 파일 하나입니다. 메뉴·곡 목록·플레이어는 사이트가 직접 그리고, 스킨은 모양만 입힙니다. 그래서 어떤 스킨이든 모든 개인사이트에서 동작하고, 재생은 언제나 똑같이 됩니다.
빠른 방법 (5분 정도)
- 스킨 요청문 만들기를 엽니다. 느낌, 밝게/어둡게, 색 두 가지, 모서리 모양을 고릅니다.
- 복사를 누르고 무료 ChatGPT나 Claude에 붙여넣습니다.
- 답이 중간에 끊기면 “이어서”라고 입력합니다.
- 코드를 메모장 같은 편집기에 붙여넣고
myskin.html(UTF-8)로 저장합니다. - 스킨 검사기로 확인합니다. 알려 준 문제를 고치거나, 문제 내용을 AI에게 다시 붙여넣어 고쳐 달라고 합니다.
- 내 사이트에서 ⚙ 관리 → Skins → 이름 입력 → 올리기 → Use this skin.
스킨에서 시작하기
갤러리에서 스킨을 내려받아 맨 위 색(:root { --bg: …; --accent: … })을 바꿔도 됩니다.
규칙 요약
.html파일 하나, 100KB 이하, CSS는<style>안에.{{menu}},{{content}},{{player}}는 각각 정확히 한 번.- 선택:
{{site_name}},{{artist_name}},{{description}},{{year}},{{lang}},{{lang_select}}. - 스크립트 금지 (
<script>,onclick=…), 입력창·버튼·iframe 금지. - 외부 파일 금지: 웹폰트, 다른 사이트 이미지,
@import. 작은data:이미지와 CSS 그라디언트는 괜찮습니다. - 일반 링크(
<a href="https://…">로 SNS 연결)는 괜찮습니다.
왜 이렇게 엄격할까요? 스크립트 없는 스킨은 비밀번호를 훔치거나 사이트를 느리게 만들 수 없고, 무료 AI도 한 번에 만들 수 있기 때문입니다.
팁
.aml-player[hidden]{display:none}를 꼭 넣으세요. 누가 재생하기 전까지 플레이어가 숨어 있습니다.- 플레이어는 화면 아래에 고정하고
body에padding-bottom을 주세요. - 휴대폰에서 확인하세요. 좁은 화면에서는 장르 칩이 제목 아래로 내려가야 합니다.
- ⚙ 관리 링크는 모든 페이지 맨 아래에 자동으로 붙습니다.
.aml-adminbar모양은 바꿔도 되지만 숨기지는 마세요.