오디오 플레이어는 방문자가 보고 클릭하는 요소입니다. 색상, 페이지 내 위치, 크기, 표시할 컨트롤을 변경할 수 있습니다. 저장 전에 변경 사항을 실시간으로 미리 볼 수 있습니다.
플레이어 설정 페이지 열기
텍스트 음성 변환 → 플레이어로 이동하세요. 페이지는 다섯 개 섹션으로 구성됩니다.
- 배치
- 색상
- 진행 표시줄 스타일
- 표시 컨트롤
- 실시간 미리보기
변경 사항은 페이지 하단의 미리보기에 즉시 반영됩니다.
배치
플레이어가 게시물에 표시되는 위치입니다. 하나를 선택하세요.
- 제목 앞: 게시물 제목 위에 표시
- 제목 뒤: 제목과 첫 번째 단락 사이에 표시
- 콘텐츠 뒤: 게시물 끝에 표시 (기본값)
- 발췌문 앞: 아카이브 또는 블로그 목록 보기에만 표시
- 발췌문 뒤: 아카이브의 게시물 요약 뒤에 표시
- 고정 푸터 (PRO): 방문자가 스크롤하는 동안 페이지 하단에 고정
대부분의 블로그에는 제목 뒤 또는 콘텐츠 뒤가 가장 잘 맞습니다. 고정 바 옵션은 고정 푸터 플레이어를 참조하세요.
색상
세 가지 색상 선택기로 플레이어 외관을 제어합니다.
- 배경: 플레이어 표면 색상
- 텍스트: 제목 및 시간 표시 색상
- 강조 / 재생: 재생 버튼, 진행 채우기, 활성 아이콘
테마에 맞는 색상을 선택하세요. 미리보기는 실시간으로 업데이트됩니다.
팁: 테마에서 CSS 변수를 사용하는 경우, 커스텀 CSS로 이 색상을 재정의할 수 있습니다. 커스텀 CSS를 참조하세요.
진행 표시줄 스타일
두 가지 옵션이 있습니다.
- 선형: 표준 수평 진행 표시줄 (기본값)
- 웨이브폼 (PRO): 각 게시물마다 고유한 패턴의 시각적 파형
웨이브폼은 모든 게시물에 개성을 더하며 팟캐스트 스타일 콘텐츠에 잘 어울립니다. SVG 기반으로 페이지 용량에 큰 영향을 주지 않습니다. 웨이브폼 진행 표시줄을 참조하세요.
표시 컨트롤
각 컨트롤은 간단한 켜기/끄기 토글입니다. 표시하려면 켜고, 더 깔끔한 외관을 원하면 끄세요.
- 재생 / 일시정지: 항상 켜짐 (끌 수 없음)
- 현재 시간 및 재생 시간
- 재생 속도 (0.5x, 1x, 1.25x, 1.5x, 2x)
- 볼륨
- 다운로드
- 반복
- 정보 아이콘 (음성 이름과 언어 표시)
접근성을 위해 시간 표시, 속도, 다운로드는 켜 두는 것을 권장합니다.
실시간 미리보기
페이지 하단에서 방문자에게 보이는 화면을 정확히 확인할 수 있습니다. 클릭하면 짧은 텍스트 샘플이 재생됩니다. 미리보기는 변경할 때마다 즉시 업데이트됩니다.
만족스러우면 상단 바의 변경 사항 저장을 클릭하세요. 변경 사항은 오디오가 있는 모든 게시물에 즉시 적용됩니다.
모바일 동작
플레이어는 반응형으로 작은 화면에 맞게 조정됩니다.
- 480px 미만: 다운로드 및 정보 컨트롤이 메뉴로 축소
- 320px 미만: 반복 및 속도 컨트롤이 완전히 숨겨지며, 재생과 시간만 표시
동적 CSS 캐싱
색상 설정은 페이지 로드마다 CSS를 재생성하지 않도록 12시간 동안 캐시됩니다. 변경 사항을 저장하면 캐시가 자동으로 초기화됩니다. 이전 색상이 보이면 페이지를 강력 새로 고침하세요 (Ctrl+Shift+R).