맨땅에 헤딩하는 사람

HTML/CSS 수정에 대한 기초적인 글은 아래 글에서 참고바란다. 2020/05/03 - [정보] - 티스토리 HTML/CSS 수정하기 Color Scripter를 사용하던 중 디자인적으로 불만이 하나 생겼다. 그것은 바로 코드의 최대 line 길이에 따라 코드블럭의 width가 결정된다는 점이다. 글로 풀어쓰려니 설명이 잘 안되는 느낌인데 아래 그림을 보면 이해가 쉽게 될 것이다. 글 작성 시 여러 코드를 삽입하는 경우 최대 line의 길이는 제각각이다. 따라서 위와 같이 표현되기 일쑤인데 이는 개인적으로 일관성을 헤치고 심미성을 저해시킨다고 생각한다. Color scripter는 HTML 코드를 제공하므로 이에 대한 CSS 구문을 추가하면 다른 코드블럭처럼 포스트 화면의 최대 길이로 일관되게 설정할..

블로그를 시작해야겠다 마음 먹고 다양한 블로그 종류 중 무엇으로 시작할 지 정한데 있어 기준이 된 첫 번째가 디자인이다. 보기 좋은 떡이 먹기 좋다는 말도 있듯이 보기 좋은 디자인이 가독성이 좋을 것이고 이는 정보 전달에 더 도움이 될 것이라 판단해서다. 개인적으로 가장 디자인이 좋아보이는 블로그는 티스토리다. 그러나 티스토리를 시작하자마자 나는 깨닫고 말았다. HTML, CSS에 대한 개발 지식이 있어야 예쁘게 꾸밀수가 있다는 것을.. 티스토리가 제공하는 기본 스킨이 그렇게 나쁜 편은 아니지만 예쁜 편도 아니다. 또한 글 작성 시 문서편집기처럼 글씨크기 변경 등의 다양한 기능들을 제공하지도 않는다. (HTML이라 그런거라 생각한다..) 나를 포함해 티스토리 블로그를 운영하는 수많은 사용자들이 HTML,..

지난 번에 썼던 하이라이트 적용에 이어 코드 블럭 Line number 적용하는 방법을 소개한다. Highlight 스타일 적용하는 방법은 아래 글을 참고바란다. 2020/04/24 - [정보] - 티스토리 코드블럭 하이라이트(Highlight.js) 스타일 및 Line number 적용하기 (1) 하이라이트 스타일 적용 티스토리 코드블럭 하이라이트(Highlight.js) 스타일 및 Line number 적용하기 (1) 하이라이트 스타일 적용 티스토리에는 프로그래밍 코드를 삽입하기 위한 코드블럭이라는 도구가 있다. 다만, 기본적으로 제공하는 코드블럭의 경우 아래와 같이 겉보기에 굉장히 밋밋하다. 코드블럭에 스타일을 적용하는 방법과 Line num.. purplechip.tistory.com Line n..

티스토리에는 프로그래밍 코드를 삽입하기 위한 코드블럭이라는 도구가 있다. 다만, 기본적으로 제공하는 코드블럭의 경우 아래와 같이 겉보기에 굉장히 밋밋하다. 코드블럭에 스타일을 적용하는 방법과 Line number를 추가하는 방법을 소개하는 블로그 글들이 많은데, HTML, CSS를 하나도 모르는 나에겐 조금 헷갈리는 작업이었다. 따라서 이 글에서 조금 더 쉽게 설명하고자 한다. 하이라이트 스타일 적용하기 하이라이트 스타일을 적용하는 방법은 두 가지가 있다. 1. 티스토리 제공 플러그인 사용 2. Highlight.js 사용 (HTML 수정) 1.의 경우 굉장히 간단하지만, 스타일이 몇가지 없고 2.의 경우 아주 살짝 귀찮은 작업이 수반되지만, 스타일 개수가 많다. 하나씩 보도록 하자. 1. 티스토리 제공..