나는 블로그를 만들 때 정상우 님이 제작하신 티스토리 스킨인 hELLO 스킨을 선택하여 사용하기로 했었다.
내가 티스토리에 글을 포스팅하는 과정은.. Typora를 이용하여 마크다운으로 글을 작성한 다음, html 코드로 글을 복사 후 티스토리의 html 편집기에 복사-붙여넣기 후에 사진이 필요한 경우 사진을 중간중간에 삽입해주는 식으로 글을 포스팅했다.
그런데 이 때 짜증나는 점이, 인용구(blockquote)가 정말 큰. 정말 정말 큰 따옴표로.. 닫히지도 않은 채로.. 위에 덩그러니 나오는 것이였다.... 바로 아래 이거..
마찬가지로, 문단 사이사이로 선 그어서 나눈 것도 . . . 으로 표시되는거... 너무 싫었어
그래서 첫 번째 방법으로 찾은 것이. 다른 블로그에서 찾은 이 방법이였다.
간단하고 좋은 방법이라 좋았으나... 단점이 있었는데
- 글을 수정할 때 깨지는 경우가 있었고
- 코드블럭을 마음대로 수정할 수가 없었다.
글 수정이야 다시 복붙해와서 써주면 되니까 괜찮았는데..
저 두 번째 이유가 너무너무너무너무 짜증났다. highlight.js 써서 나도 atom dark버전 테마 쓰고 옆에 line number도 표시하고 싶다고!!!!!
그래서 결국 2시간정도의 삽질 끝에.. 방법을 찾아냈다.
html도 css도 문외한인 나에겐.. 너무 힘든 길이였어.....
여느 편집 과정과 다르지 않게,
블로그 관리 > 스킨 편집 > html 편집으로 들어가 css에 가서 이 부분을 찾는다
Line 1337~1347 부분이 변경해준 부분이다. (서식 부분의 코드는 이곳을 참고했다.)
아무튼 저 부분을 찾아 밑의 코드로 대체해준다.
.permalink>.content .contents_style div[data-ke-type=moreLess] blockquote,
.permalink>.content .contents_style>blockquote {
text-align: start;
background: none;
padding: 0 1em;
font-size: 16px;
color: #6a737d;
line-height: 25.6px;
border-left: .25em solid #dfe2e5;
}
그럼.. 아주 깔끔하게 원래 마크다운 형식처럼 인용구(blockquote) 형식이 적용된다.
이렇게!!!!!!!!!!
그래 이래야지!!!!!!!!!
이 다음엔 코드블럭 이쁘게 꾸며야지...ㅎ