Today:
목차
티스토리 기본설정
티스토리 글쓰기를 하다보면 글씨의 기본 색상이 회색으로 되어있는 것을 발견하고 글을 발행하기 전에 매번 검정색으로 바꿔주는 작업을 하곤합니다.
티스토리 블로그를 운영하시는 블로거 분들은 이미 알고 계셔서 적용을 하거나 아니면 자신만의 서식같은 것을 가지고 있어서 따로 설정할 필요가 없으실 수도 있습니다.
혹은, 그냥 기본 글씨색상인 회색으로 쓰시는 분들도 계실 것이고, 매번 검정색으로 바꾸시는 분들도 계실 것 같습니다. 저도 글을 쓴 뒤, 매번 Alt + A 로 전체선택을 하고 글씨를 검정색으로 변경하는 작업을 매번 해왔습니다.
개인적으로 검정색이 더 가독성이 좋은 것 같다고 생각하는데요. 사실 HTML에서 설정을 변경하면 되는 것으로 알고있지만 귀차니즘 때문에 미루고 미뤄왔습니다.
회색글씨
🔻 글을 발행한 뒤 확인해보면 아래처럼 색상이 확연히 차이나는 것을 느낄 수가 있습니다. 티스토리는 왜 글씨색상의 디폴트 값이 회색으로 설정되어 있는지 이유를 알 수가 없습니다. 아마도 연필로 쓴 느낌을 주기 위해서 회색으로 기본설정이 되어있는게 아닐까 추측을 해봅니다.
스킨마다 설정하는 기본 글씨체를 설정하는 방법이 조금씩 다르기 때문에 본인의 블로그에서 하나하나 찾아보며 공부하는 것도 좋은 방법 같습니다.
기본 글씨색 변경 (반응형 스킨 #1)
🔻 먼저 티스토리에서 바로 이용가능한 무료 반응형 스킨인 #1에서 기본 글씨체 변경방법을 알아보겠습니다. 일단 테스트 블로그에서 테스트 페이지를 만들어 비공개로 발행했습니다. 아무것도 손대지 않고 제목과 글씨만 써서 글을 발행 했습니다. 아래처럼 기본 회색의 글씨가 출력이 됩니다.
🔻 블로그 관리로 진입을 해주신 뒤에 '꾸미기' 옵션 중 '스킨 편집'으로 진입을 해주시면 됩니다. 그리고 HTML 편집으로 들어가 줍시다. 티스토리를 조금 만져보신 분들이라면 아주 익숙하겠습니다. MIT License에게 저작권이 있네요.
🔻 HTML 과 CSS 그리고 파일업로드 메뉴 세가지가 나오게 되는데, CSS를 눌러줍니다.
🔻 CSS 로 진입을 하게 되면, 멀리 갈필요 없이 가장 상단에 /* reset */ 라고 나오는 부분에서 찾을 수 있습니다. 빨간색으로 표시 된 부분에 보면 color:#333 이라고 되어있는 것을 확인할 수가 있는데요.
🔻 혹은 Ctrl + F 를 눌러서 아래 내용을 찾아 주시면 됩니다.
body,th,td,input,select,textarea,button {font-size:14px;line-height:1.5;font-family:'Noto Sans', sans-serif;color:#333} /* color값은 디자인가이드에 맞게사용 */
🔻 이제 color에 나와있는 색상코드(#333)를 변경해주도록 하겠습니다. 네이버 색상코드에서 원하는 색상코드를 가져와서 #333 대신 입력하면 되겠습니다. 저는 티스토리 기본 색상표에 있는 빨간색 코드인 #EE2323를 넣어보겠습니다.
🔻CSS를 아래와같이 변경했더니, 글씨 색이 회색에서 빨간색으로 변경되었습니다. 검정색 코드인 #000000을 넣으면 검정색으로 기본 설정을 바꿀 수가 있겠지요.
body,th,td,input,select,textarea,button {font-size:14px;line-height:1.5;font-family:'Noto Sans', sans-serif;color:#EE2323} /* color값은 디자인가이드에 맞게사용 */
🔻 주의사항은 기본 설정으로 쓰는 글자들의 색상은 일괄적으로 바뀌지만, 글을 작성하는 도중에 수동으로 색상을 설정했다면 이러한 수정방법으로는 일괄변경이 되지 않습니다. 설정을 하지 않은 글들의 색이 바뀌게 되고, 기존에 작성한 글도 모두 변경되게 됩니다.
기본 글씨색 변경 (JB SKIN 149)
🔻 이번에는 제가 사용하고 있는 현재 블로그의 유료스킨인 JB Factory 의 JB 149 스킨에서의 변경을 해보겠습니다. 마찬가지로 '꾸미기' 옵션 중 '스킨 편집'으로 진입을 해주시면 됩니다. 그리고 HTML 편집으로 들어가 줍시다. HTML편집에 진입 후 CSS를 눌러줍니다.
🔻 여기 또한 마찬가지로 글쓰기에서 기본적으로 설정되는 옵션을 변경할 수 있는 곳을 찾아야합니다. 아래 코드를 찾아야하는데요. Ctrl + F 로 찾으시면 될 것 같습니다.
/* Typography */
body { line-height: 1.8; font-family: "Noto Serif", "LexiSaebomR", sans-serif; font-size: 14px; font-weight: 400; color: #666666; word-spacing: 0.5px; }
🔻 해당 코드를 찾으셨다면, Color를 검정색코드인 #000000 으로 변경해주겠습니다. 그리고 이왕 바꾸는 김에 글자 사이즈도 조금더 크게 변경해주겠습니다. font-size를 14px 에서 18px으로 추가적으로 변경하겠습니다.
이제 모든 설정이 완료 되었습니다. 기본설정을 바꾸었으니 다음부터 포스팅을 할 때 시간을 좀 더 아낄 수가 있게 되었네요.
블로그 읽어주셔서 감사합니다.
Written by Sun Lee
공감과 댓글은 작성자에게 힘이됩니다.🥰
최근댓글