블로그

[워드프레스 블로그 만들기 #07] 한글 폰트 추가하는 방법

워드프레스에 기본적으로 설치되어 있는 폰트는 한글보다는 영문에 어울리는 폰트가 대부분입니다.

가독성 좋은 한글 글꼴을 적용하고 싶은 분들을 위하여 워드프레스에 한글 폰트를 추가하여 적용하는 방법에 대해 알아보겠습니다.

제가 설치하려는 글꼴은 프리텐다드(Pretendard) 폰트인데요, 원하시는 폰트에 맞게 응용하시면 좋을 거 같습니다.


무료 한글 폰트 프리텐다드(Pretendard)

프리텐다드 폰트는 뛰어난 가독성 및 간결하고 세련된 디자인으로 가장 많이 사용되는 무료 한글 폰트로 공식 홈페이지(https://cactus.tistory.com/306)에서 다운로드할 수 있습니다.

프리텐다드 폰트를 다운로드하면 종류가 다양해서 어떤 폰트를 사용해야 할지 난감하실 텐데요, 그 차이는 아래와 같습니다.

  • ‘public’은 컴퓨터에 설치하고 문서를 작성할 때 사용하는 PC용 폰트이고, ‘web’은 홈페이지에 적용할 때 사용되는 용량이 작은 폰트입니다.
  • ‘static’은 폰트의 두께에 따라 각 파일이 존재하며, ‘variable’은 1개의 파일로 폰트의 굵기를 설정하는 것입니다.
  • ‘woff2’는 ‘woff’ 파일을 개선한 버전으로 압축률은 높으나, 2015년 이전 출시된 일부 오래된 브라우저에서 지원하지 않을 수 있습니다.
  • ‘subset’은 불필요한 부분을 없애서 용량을 더 줄인 폰트입니다.

저는 로딩 시간을 줄이기 위하여 용량이 가장 작은 web > static > woff2-subset 폴더 안의 폰트를 설치해 보겠습니다.


워드프레스에 한글 폰트 추가하기

워드프레스에 한글 폰트를 적용하는 방법은 웹폰트를 적용하는 방법과 폰트를 직접 업로드하는 방법이 있습니다.

웹폰트는 온라인의 특정 서버에 위치한 폰트 파일을 불러와서 나의 웹사이트에 적용하는 것인데요, 적용은 간단하나 사이트 로딩 속도가 느려질 수 있습니다.

저는 속도 저하 없이 폰트를 적용할 수 있는 폰트 업로드 방식을 선택하였습니다.

woff2 파일을 업로드하기 위해 WP Extra File Types 플러그인을 설치합니다.

설정 > Extra File Types에서 ‘Check only file extensions’을 체크하고 찾기(Ctrl+F)로 ‘woff2’ 파일 2개를 찾아 체크 후 저장합니다.

Custom Fonts 플러그인을 설치 후 모양 > Custom Fonts에서 ‘Add New Font’를 클릭합니다.

① 폰트 네임을 적고 ② Choose File을 클릭하여 파일을 업로드합니다.

폰트를 선택한 후에 ③ Use Font 클릭, ④ 굵기를 설정하고 ⑤ 폰트를 저장합니다.

같은 방법으로 프리텐다드 두께별로 폰트를 모두 업로드합니다.

  • Thin : 100
  • ExtraLight : 200
  • Light : 300
  • Regular : 400
  • Medium : 500
  • SemiBold : 600
  • Bold : 700
  • ExtraBold : 800
  • Black : 900

워드프레스에 폰트를 직접 업로드하면 속도 저하 없이 한글 폰트 적용이 가능합니다.

폰트가 적용되었다면 사용자 정의 > 글로벌 > 타이포그래피Font family에서 폰트를 선택할 수 있는데요,

테마별 코딩 차이에 따라 위 방법이 적용되지 않을 수도 있습니다.

다음 글에서 워드프레스에 폰트 업로드 방식으로 폰트 적용이 되지 않을 때 폰트 적용하는 방법에 대해 알아보겠습니다.

Subscribe
Notify of
guest
0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
error: Content is protected !!
0
Would love your thoughts, please comment.x
()
x