MMCA 오디오가이드를 블로그에 넣는 방법

MMCA 오디오가이드는 자체 스트리밍 방식으로 제공되며, 직접 파일을 다운로드할 수 없도록 되어 있습니다. 따라서 우회 임베드 방식을 활용해야 합니다.

---

방법 1 — iframe으로 MMCA 오디오가이드 페이지 통째로 삽입

가장 간단한 방법입니다. MMCA 오디오가이드 상세 페이지 자체를 iframe으로 블로그에 넣습니다.

xml

<iframesrc="https://www.mmca.go.kr/digitals/digitalExhGuideDetail.do?exhId=202601060002023"width="100%"height="600"frameborder="0"style="border-radius:12px;"></iframe>

⚠️ 단점: MMCA 서버가 X-Frame-Options 헤더로 iframe 차단을 할 경우 표시 안 될 수 있습니다. 네이버 블로그는 iframe 삽입 자체가 불가하므로, 워드프레스·티스토리·HTML 직접 편집 가능한 블로그에서만 가능합니다.

---

방법 2 — HTML <audio> 태그 (MP3 직접 링크 확보 시)

브라우저 개발자 도구(F12) → Network 탭에서 오디오 파일 URL을 직접 추출한 뒤 사용합니다.

추출 방법:

1. MMCA 오디오가이드 페이지에서 F12 눌러 개발자 도구 열기
2. Network 탭 → 필터를 Media 또는 audio로 설정
3. 오디오 재생 버튼 누르면 .mp3 또는 .m4a URL이 잡힘
4. 해당 URL 복사

xml

<audiocontrolsstyle="width:100%; border-radius:10px;">

<sourcesrc="https://mmca.go.kr/audio/파일명.mp3"type="audio/mpeg"></audio>

---

방법 3 — 링크 버튼으로 연결 (가장 안전·범용)

직접 삽입이 어려운 경우, 버튼 링크로 MMCA 오디오가이드 페이지로 보내는 방식이 현실적입니다. 네이버 블로그·티스토리 모두 적용 가능합니다.

xml

<ahref="https://www.mmca.go.kr/digitals/digitalExhGuideDetail.do?exhId=202601060002023"target="_blank"style="display:inline-block; padding:14px 32px; background:#c8702a; color:#fff; border-radius:30px; font-weight:700; text-decoration:none;"> 

🎧 오디오가이드 듣기 → </a>

---

플랫폼별 추천 방법

블로그 플랫폼	추천 방법
워드프레스	<audio> 태그 or iframe
티스토리	<audio> 태그 (HTML 모드에서)
네이버 블로그	링크 버튼만 가능 (iframe/audio 태그 차단)
깃헙 Pages / HTML	모든 방법 가능

네이버 블로그의 경우 직접 오디오 삽입이 막혀 있어, 링크 버튼 방식(방법 3) 이 가장 현실적입니다. 앞서 만든 HTML 파일(워드프레스 등 용)에는 <audio> 태그 방식이 가장 깔끔하게 어울립니다.

오렌지처음으로