개인적으로 글을 조금 정리하여 작성하고 싶을때 markdown Editor를 이용한다.
그중에서도 Typora 를 이용하여 작성을 하는데
작성한 내용을 그대로 tistory에 그대로 붙여넣고 싶은 경우가 있다.
그럴 경우 몇가지 문제점과 해결방안에 대해서 이야기 해보자.
복사 & 붙여넣기 시 문제들
1. 코드블럭 줄내림 문제.
아래와 같이 code block을 넣는 경우 줄내림이 되지 않아 곤란한 상황이 발생한다.
var msg = "안녕하세요 동해물과 백두산이 마르고 닮도록 하느님이 보우하사 우리나라 만세 무궁화 삼천리 화려강산 대한 사람 대한으로 길이 보전하세";
console.log(msg);2. 문단 간 빈줄 없어짐.
Typora에서 한줄 공백을 넣어도 공백줄이 보이지 않는 문제가 있다.
은근 귀찮다.
3. 글자가 너무 작다.
Typora에서 볼때보다 글자가 너무 작아서 가독성이 떨어진다.
해결방안
1. 테마지정
흰색 배경의 Tistory에는 Typora github 테마가 가장 잘 어울리는 듯하다.
그래서 Typora내에서 github으로 선택.
자신의 블로그 본문 배경색을 Typora의 테마랑 맞추면 어느것을 해도 상관 없을 듯함.
2. Tistory CSS 편집.
블로그관리 > 꾸미기 > CSS편집 > CSS탭에 아래의 내용을 추가하면 Typora에서 볼때와 비슷하게 폰트사이즈와 줄내림 처리등이 가능하다.
추가적으로 발생하는 문제는 그때 그때 CSS를 수정해서 하는 수밖에는 없을 것 같다.
/* ***** markdown code block ***** */
.md-fences span {
white-space : normal;
font-size : 1.1em;
}
.md-line {
min-height : 24px;
}
.cm-tab {
width : 24px;
}
#content blockquote {
border-left: 4px solid #dddddd;
padding: 0 15px;
color: #777777;
}3. 복붙시 Tip
코드블럭이나 heading과 같은 부분에서 복사하지 말고 빈줄을 에서 전체선택을 해서 복사하여 붙여넣기를 하면됨.
