Design/티스토리
[티스토리꾸미기] Pretendard 적용하기 / 폰트 적용하기
레오나르도 다빈츠
2023. 3. 8. 19:06
서치하다보면 velog UI가 너무 예뻐서,, 갈아타야하는 것인가 많이 고민했다.
하지만 당장 갈아타기엔 시간이 걸릴 것 같고 티스토리만의 장점도 있기때문에 우선 급한불부터 껐다.
- font-family를 Pretendard로 변경했다.
- h1, h2, ...h4 태그는 쓸데없이 padding이 50px 정도로 들어가있었다. 그래서 항상 포스팅을 하다보면 내가 생각한 결과물대로 나오지 않아서 성취감이 -10정도 떨어졌다. 모든 padding을 0으로 수정해버렸다.
- 기본 폰트크기를 16px → 18px로 조정했다.
- 간격이 숨막혔던 코드 블록에 padding을 넓히고 border-radius를 주었다. 스크롤바 없는게 불편해서 숨기지않으려고했지만 실패.. 다음에 시도해보자.
이 정도만 해도 속이 시원하다.
귀찮아서 미루고 미루다가 반차쓴김에 날 잡고 적용해보기.. 재밌었다.
혹시 누군가에게 도움이 될까해서 남겨보는 적용방법..😀
1. 티스토리 환경설정 > 스킨편집에서 CSS에 아래 코드를 import 한다. 상단 아무데나 넣으면 된다.
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
2. /* reset */으로 시작하는 저 코드에서 아래부분을 찾아 font-family 제일 앞에 Pretendard를 넣어준다.
body,th,td,input,select,textarea,button {
font-size:20px;
line-height:1.5;
font-family: Pretendard, 'applesdgothicneo-light', 'Malgun Gothic', '맑은 고딕';
color:#666;
font-weight: 200;
}