Quiver로 문서작성 후 블로그에 올리기

제가 Quiver로 작성한 후에 블로그에 올릴때 사용하는 방법 입니다.

1. Quiver로 글 작성

2. File -> Export Note -> As HTML

3. html파일에서 다음부분 수정

<!-- 원본 -->

<style>

body{margin:0 auto;max-width:800px;line-height:1.4}

...

</style>

<!-- 수정본 (max-width:800px;부분 삭제) -->

<style>

body{margin:0 auto;line-height:1.4}

...

</style>

<!-- common.css -->

<style>* {-webkit-tap-highlight-color: rgba(0,0,0,0);}html {-webkit-text-size-adjust: none;}body {font-family: Arial, Helvetica, sans-serif;margin: 0;color: #333;word-wrap: break-word;}h1, h2, h3, h4, h5, h6 {line-height: 1.1;}img {max-width: 100% !important;}blockquote {margin: 0;padding: 0 15px;color: #777;border-left: 4px solid #ddd;}hr {background-color: #ddd;border: 0;height: 1px;margin: 15px 0;}code {font-family: Menlo, Consolas, 'Ubuntu Mono', Monaco, 'source-code-pro', monospace;line-height: 1.4;margin: 0;padding: 0.2em 0;font-size: 85%;background-color: rgba(0,0,0,0.04);border-radius: 3px;}pre > code {margin: 0;padding: 0;font-size: 100%;word-break: normal;background: transparent;border: 0;}ol {list-style-type: decimal;}ol ol, ul ol {list-style-type: lower-latin;}ol ol ol, ul ol ol, ul ul ol, ol ul ol {list-style-type: lower-roman;}table {border-spacing: 0;border-collapse: collapse;margin-top: 0;margin-bottom: 16px;}table th {font-weight: bold;}table th, table td {padding: 6px 13px;border: 1px solid #ddd;}table tr {border-top: 1px solid #ccc;}table tr:nth-child(even) {background-color: #f8f8f8;}input[type="checkbox"] {cursor: default;margin-right: 0.5em;font-size: 13px;}.task-list-item {list-style-type: none;}.task-list-item+.task-list-item {margin-top: 3px;}.task-list-item input {float: left;margin: 0.3em 1em 0.25em -1.6em;vertical-align: middle;}#tag-field {margin: 8px 2px 10px;}#tag-field .tag {display: inline-block;background: #cadff3;border-radius: 4px;padding: 1px 8px;color: black;font-size: 12px;margin-right: 10px;line-height: 1.4;}</style>

<!-- 이부분 삭제 -->

4. 블로그에 글작성 -> html 보기로 변환후 위의 html 파일 복사 후 붙혀넣기

5. 이미지 업로드 후 엑박영역 교체

※ 2016.08.31 업데이트

Markdown Cell로 테이블을 그렸을 때에는 아래의 css를 살려야 합니다.

<!-- common.css -->

<style>* table {border-spacing: 0;border-collapse: collapse;margin-top: 0;margin-bottom: 16px;}table th {font-weight: bold;}table th, table td {padding: 6px 13px;border: 1px solid #ddd;}table tr {border-top: 1px solid #ccc;}table tr:nth-child(even) {background-color: #f8f8f8;}input[type="checkbox"]</style>

이상입니다.

혹시 좀 더 쉽게 할 수 있는 방법을 아시는 분 계시다면 연락 부탁드립니다.