구글 닥스 → 마크다운 정제 변환기 사용법
구글 닥스(Google Docs)는 워드프레스·티스토리·노션·깃허브 등으로 글을 옮길 때 가장 많이 사용되는 작성 도구입니다. 하지만 닥스에서 ‘선택 → 복사’를 한 뒤 다른 에디터에 ‘붙여넣기’를 하면 폰트, 라인 간격, 색깔, 페이지 여백 등 인라인 스타일이 그대로 따라와 글의 모양이 깨지거나 HTML이 거대해지는 문제가 발생합니다. 본 도구는 contenteditable 영역에 닥스 콘텐츠를 그대로 붙여 넣으면, 브라우저에 전달되는 리치텍스트(HTML)를 파싱해 GitHub Flavored Markdown(GFM)으로 변환합니다.
변환 과정에서 굵게(strong), 기울임(em), 취소선(s), 링크(a), 헤딩(h1 ~ h6), 표(table), 순서 목록(ol)·비순서 목록(ul)을 모두 인식합니다. 닥스 특유의 ‘plchldr’ 클래스, 인라인 style="font-family:..." 등 불필요한 마크업은 모두 제거되어 깔끔한 마크다운이 나옵니다.
지원하는 변환 매핑
- 제목 H1 ~ H6 →
# ## ### #### ##### ###### - 굵게 →
**text**/ 기울임 →*text*/ 취소선 →~~text~~ - 인라인 코드 →
`code`/ 코드블록 → 트리플 백틱 - 링크 →
[text](url) - 표 → GFM 파이프 테이블
- 이미지 → 플레이스홀더 / 제거 / 원본 URL 유지 (옵션)
- 인용문(blockquote) →
> quote - 리스트 마커 선택 가능 (-, *, +)
이미지 처리 옵션
구글 닥스의 이미지는 닥스 내부 ‘drive.google.com’ URL을 가리키므로 외부에서는 접근이 불가합니다. 본 도구는 세 가지 처리 옵션을 제공합니다.
- 플레이스홀더(기본):
형태로 남겨 두어 나중에 수동 교체 가능 - 제거: 마크다운 결과에서 이미지를 완전히 삭제
- 원본 URL 유지: 닥스 권한이 ‘링크가 있는 모든 사용자’로 공개된 경우에만 유효
자주 묻는 질문 (FAQ)
Q. 텍스트 입력창이 아닌 박스에 붙여 넣으라는 이유는?
A. 일반 <textarea>는 리치텍스트(HTML)를 받지 못하고 ‘플레인 텍스트’로만 처리됩니다. 따라서 굵게·링크·표 등 서식을 인식하려면 contenteditable 박스에 붙여 넣어야 합니다.
Q. 한자·이모지·특수문자도 안전한가요?
A. 모든 처리는 UTF-8 기반 자바스크립트 문자열로 진행되므로 한글·한자·이모지·수식 모두 그대로 보존됩니다.
Q. 코드블록은 어떻게 인식되나요?
A. 닥스에서 ‘코드 블록’ 또는 ‘Courier New’ 폰트로 작성된 단락은 <pre> 또는 <code> 태그로 변환되어 마크다운 트리플 백틱으로 출력됩니다. 닥스가 기본 폰트로 코드를 표시한 경우 정확한 인식이 어려울 수 있으니, 닥스에서 ‘서식 → 단락 스타일 → 코드 블록’으로 명시적으로 지정한 뒤 복사하세요.