코드블럭 (3) 썸네일형 리스트형 [TISTORY/Code Block] 티스토리 코드블럭 스크롤(Scroll) 설정 #관련 글 [TISTORY/Code Block] 티스토리 코드블럭 하이라이트(highlight.js) 테마 설정 [TISTORY/Code Block] 티스토리 코드블럭 라인넘버(line number) 설정 [TISTORY/Code Block] 티스토리 코드블럭 스크롤(Scroll) 설정 #스크롤(Scroll) 코드 블럭에 하이라이트를 설정하면 데모 사이트에서 본 디자인과 다를 수 있습니다. 티스토리의 css코드에 기본적인 스타일이 설정되어 있기 때문입니다. 가독성을 높이고 마음에 드는 스타일 설정을 위해 몇 가지 수정을 할건데 이번 글에서는 스크롤 설정을 하겠습니다. 블로그 관리 페이지 → [스킨 편집] → [CSS] 탭으로 이동해서 아래와 같은 코드를 적용합니다. code { white-space: p.. [TISTORY/Code Block] 티스토리 코드블럭 라인넘버(line number) 설정 #관련 글 [TISTORY/Code Block] 티스토리 코드블럭 하이라이트(highlight.js) 테마 설정 [TISTORY/Code Block] 티스토리 코드블럭 라인넘버(line number) 설정 [TISTORY/Code Block] 티스토리 코드블럭 스크롤(Scroll) 설정 #라인넘버(Line Number) 코드 블럭에 하이라이트를 설정하면 데모 사이트에서 본 디자인과 다를 수 있습니다. 티스토리의 css코드에 기본적으로 설정 된 코드들이 있어서 그렇습니다. 마음에 드는 디자인과 가독성을 높이기 위해 몇 가지 수정을 할 건데, 첫 번째로 라인넘버를 설정하겠습니다. github.com/wcoder/highlightjs-line-numbers.js wcoder/highlightjs-line-nu.. [TISTORY/Code Block] 티스토리 코드블럭 하이라이트(highlight.js) 테마 설정 #관련 글 [TISTORY/Code Block] 티스토리 코드블럭 하이라이트(highlight.js) 테마 설정 [TISTORY/Code Block] 티스토리 코드블럭 라인넘버(line number) 설정 [TISTORY/Code Block] 티스토리 코드블럭 스크롤(Scroll) 설정 # 코드 블럭 하이라이트 적용 블로그에서 글을 쓸 때 코드를 작성하는 경우가 있습니다. 티스토리에서 기본적으로 제공해주는 코드 블럭이 있지만 에디터에서만 하이라이트가 적용되고, 작성 후 실제 블로그에서 보면 하이라이트가 되지 않기 때문에 별로도 구현해야 합니다. 코드블럭을 설정하는 3가지 방법을 소개하겠습니다. # highlight.js 적용 방법 1 - 블로그 관리 페이지에서 적용 블로그 관리 페이지 메뉴에서 [플러그인.. 이전 1 다음
