2025-08-12

Home » » 블로거(Blogger)에서 마크다운(Markdown) 쓰는 법: HTML 모드에 붙여넣기 완벽 가이드

블로거(Blogger)에서 마크다운(Markdown) 쓰는 법: HTML 모드에 붙여넣기 완벽 가이드

By 

블로거(Blogger)에서 마크다운(Markdown) 쓰는 법: HTML 모드에 붙여넣기 완벽 가이드

블로거(Blogger)에서 마크다운(Markdown) 사용법: HTML 모드에 붙여넣기, 가능할까?

Blogger에서 글을 쓸 때 마크다운 코드를 사용하고 싶으신가요? 많은 분들이 블로거의 HTML 편집 모드에 마크다운 코드를 직접 붙여넣어도 되는지 궁금해하십니다. 결론부터 말씀드리면, 직접 붙여넣기는 어렵지만, 몇 가지 방법을 통해 충분히 가능합니다.

Blogger는 기본적으로 마크다운을 네이티브하게 지원하지 않습니다. 따라서 # 제목과 같은 마크다운 코드를 그대로 붙여넣으면, HTML로 변환되지 않고 텍스트 그대로 노출될 가능성이 큽니다. 하지만 걱정 마세요. 아래에서 두 가지 효과적인 해결 방법을 자세히 알려드리겠습니다.

방법 1: 마크다운을 HTML로 변환하여 업로드하기 (가장 간단하고 추천하는 방법)

이 방법은 가장 간단하고 안정적인 방법입니다. 글을 작성하기 전에 마크다운을 HTML로 미리 변환한 후, 블로거의 HTML 모드에 붙여넣는 방식입니다.

1. 변환 도구 사용하기

2. 블로거에 업로드하기

  • 새 포스트 작성: 블로거 대시보드에서 '새 글'을 만들고 'HTML 보기' 모드로 전환하세요.

  • 코드 붙여넣기: 변환된 HTML 코드를 복사하여 HTML 모드에 붙여넣습니다.

  • 게시 확인:'미리보기'나 '게시'를 눌러 포스트가 정상적으로 렌더링되는지 확인합니다.

장점: 블로거 템플릿을 수정할 필요가 없어 가장 간단합니다. 팁: 프로그래밍 코드 하이라이팅이 필요하다면, 변환된 HTML 코드에 CSS 스타일을 추가하면 됩니다.

방법 2: 자바스크립트 라이브러리로 마크다운 렌더링하기

이 방법은 조금 더 기술적이지만, raw 마크다운 코드를 직접 블로거에 붙여넣고 싶을 때 유용합니다. 블로거 템플릿에 자바스크립트 라이브러리를 추가하여, 사용자의 브라우저에서 마크다운을 HTML로 변환하도록 하는 방식입니다.

1. 템플릿에 스크립트 추가하기

  • 테마 편집: 블로거 대시보드(설정단계)에서 '테마' > '맞춤설정' > 'HTML 편집'으로 들어갑니다.

  • 라이브러리 삽입:<head> 태그 앞이나 </body> 태그 앞에 Showdown.js나 Highlight.js 같은 마크다운 렌더링 라이브러리 스크립트 코드를 삽입합니다.

예시 코드:HTML

<linkrel="stylesheet"href="//cdnjs.cloudflare.com/ajax/libs/highlight.js
/9.9.0/styles/default.min.css"/>
<scriptsrc="//cdnjs.cloudflare.com/ajax/libs/showdown/1.6.2/showdown.min.js"></script>

2. 포스트에 마크다운 코드 넣기

  • 새 포스트 작성:'HTML 보기' 모드에서 마크다운 코드를 <pre class="markdown"> ... </pre>와 같은 태그로 감싸서 붙여넣습니다.

  • 게시 확인: 포스트를 게시하면, 방문자의 브라우저에서 자동으로 마크다운이 HTML로 변환되어 보입니다.

장점: raw 마크다운을 직접 사용할 수 있어 편리합니다. 주의사항: RSS 피드에서는 마크다운이 그대로 노출될 수 있으므로 유의해야 합니다.

결론: 블로거에서 마크다운 사용, 충분히 가능합니다.

Blogger는 마크다운을 기본적으로 지원하지 않지만, 위의 두 가지 방법을 통해 충분히 편리하게 사용할 수 있습니다. 만약 자주 마크다운을 사용하신다면, 첫 번째 방법인 'HTML로 변환해서 업로드하기'를 추천해 드립니다. 가장 간단하고 오류가 적은 방법이기 때문입니다.

만약 더 전문적이고 완벽한 마크다운 환경을 원하신다면, 마크다운을 기본적으로 지원하는 GitHub Pages나 WordPress (Jetpack 플러그인) 같은 플랫폼을 고려해 보는 것도 좋은 대안이 될 수 있습니다.

더 궁금한 점이 있으시면 언제든지 다시 질문해주세요!

버튼 텍스트

버튼 텍스트

버튼 텍스트

Share:  Facebook Twitter Google+