웹폰트 티스토리 블로그에 적용하기

티스토리 블로그를 시작하면서 소소하게 꾸미는 걸 좋아하여 이 것 저 것 손을 대고 있다. 그 중 하나가 바로 웹폰트다. 이 블로그에는 티머니 둥근바람 폰트가 기본으로 적용해보았다.

웹폰트를 적용하는 방법은 먼저 웹 폰트를 구한 후 이를 티스토리 스킨에 업로드 하거나, 무료로 풀려있는 공유된 웹폰트 url을 이용하는 방법이 있다.

가장 대표적인 웹폰트 사이트로는 눈누 가 있다.

https://noonnu.cc/

내가 사용하고 싶었던 티머니 둥근바람 폰트는 눈누에서 bold체만 제공하고 있어서 직접 다운로드 사이트에서 다운 받은 후 티스토리 스킨에 업로드 한 뒤 url 주소를 직접 적용했다.

@font-face {
  font-family: '폰트 이름';
  src: url('폰트 주소') format('woff')
  font-weight: normal;
  font-style: normal;
}

/* 전체 본문에 적용 */
body {
  font-family: '폰트 이름', sans-serif;
}

/* 특정 요소에만 적용하고 싶을 때 */
h1, h2, h3 {
  font-family: '폰트 이름', sans-serif;
}

URL 폰트 주소에 티스토리 스킨에 업로드 한 뒤 URL을 첨부하는 방식으로 사용했다.

적용 후, 블로그를 새로고침해서 웹폰트가 정상적으로 보이는지 확인하고 필요에 따라 폰트 크기나 스타일을 조정하면 됩니다.