티스토리 블로그 인용란을 꾸며보자!

728x170

이번 글에서는 티스토리 블로그 인용란을 꾸미는 방법을 알아보겠습니다!

보통 글을 쓸 때 다른 출처의 글이나 컨텐츠를 삽입하여 신뢰도를 높이고 싶은 때 인용을 활용하는데요, 저는 그러한 일반적인 인용의 방식도 사용하지만 특정 문구를 강조하기 위해 인용을 사용하고 있습니다.

티스토리에서 기본적으로 제공하는 인용은 아래와 같이 얇은 두께의 회색 바 형태의 서식을 제공하고 있습니다.

그런데 다른 분들의 티스토리를 보면 형형색색의 센스있는 색과 모양으로 인용란을 꾸미고 있는데, 저는 티스토리 블로그 글쓰기의 상단 도구탭을 아무리 찾아봐도 인용란의 서식 편집 기능을 찾을 수 없었습니다.

찾으면 길이 있다더니, 인용란을 편집하는 것은 상단 도구 탭에서 지원하는 것이 아니고 css 편집 기능을 이용해야 한다는 것을 알 수 있었습니다. css 편집은 티스토리 블로그 관리자 화면의 '꾸미기 - 스킨편집 - html편집 - css' 의 경로에서 찾을 수 있습니다.

css 편집을 들어가면 아래처럼 어지러운 영어들이 써있는 창이 뜨는데, 여기에서 인용문을 뜻하는 'blockquote'를 찾아줍니다. 찾는 방법은 Ctrl + F 를 눌러 찾기 기능을 활성화 하여 찾을 수 있습니다.

스킨마다 인용란에 대한 정의 방법이 다르겠지만 'blockquote' 옆이나 아래에 'margin-bottom, padding, border-left' 라는 표현이 있으면 인용란에 대한 부분이 맞습니다.

margin-bottom 은 아래 여백을 의미하고, padding은 내용과 바(bar) 사이의 여백, border-left는 인용란 바(bar)의 두께와 색을 정하는 영역입니다. 색은 html 컬러코드를 사용하는데 구글에서 #ababab를 입력하면 내가 원하는 색을 고를 수 있고 해당하는 색의 코드를 알아낼 수 있습니다.

스킨마다 다를 수 있겠으나, 아래 'blockquote'의 'margin-bottom, padding, border-left'를 수정하여 인용란을 편집할 수 있습니다.